Not able to connect to my local graphql server with apollo studio sandbox

I am running a graphql server using serverless offline and trying to connect to the server with Aollo Studio. The weirdest bug is that it was connecting properly a week back and now the exact same server is not connecting. The same thing I have deployed on the AWS and Aollo Studio is able to connect to the deployed server. Any idea what could be the reason for it?

Environment

I am on Macbook m1 pro.

Node Version 15.6

As you can in the config file I have started a playground as well on this path http://localhost:3000/dev/playground which I am able to access but this playground is also not connecting the server.

One thing which I have observed is my local network IP URL like http://192.168.1.3:3000/dev/playground is also not working when I am trying to visit so maybe some kind of network issue might be there.But when I run something like a React App I am able to access it on this http://192.168.1.3:3000

My serverless.yml looks like below

service: serverless-graphql-rdsframeworkVersion: "3.8.0"provider:name: awsruntime: nodejs14.xstage: ${env:PROVIDER_STAGE}region: ${env:REGION}environment:JWT_SECRET: ${env:JWT_SECRET}DATABASE_URL: ${env:DATABASE_URL}REDIRECT_TO_DASHBOARD: ${env:REDIRECT_TO_DASHBOARD}HUB_SPOT_CLIENT_ID: ${env:HUB_SPOT_CLIENT_ID}HUB_SPOT_CLIENT_SECRET: ${env:HUB_SPOT_CLIENT_SECRET}HUB_SPOT_REDIRECT_URI: ${env:HUB_SPOT_REDIRECT_URI}plugins:- serverless-plugin-typescript- serverless-offlinepackage:patterns:- "migrations/**"- "**.js"- "config"custom:serverless-offline:httpPort: ${env:httpPort, 3000}lambdaPort: ${env:lambdaPort, 3002}serverless-plugin-typescript:tsConfigFileLocation: "./tsconfig.json"functions:graphql:handler: server.handlerevents:- http:path: graphqlmethod: postcors: trueplayground:handler: server.playgroundHandlerevents:- http:path: playgroundmethod: getcors: trueoauth-callback:handler: ./rest-apis-handlers/oauth-callback.handlerevents:- http:path: oauth-callbackmethod: getcors: true

And the file server.ts looks like below which contains the handler function

import { ApolloError, ApolloServer } from "apollo-server-lambda";import lambdaPlayground from "graphql-playground-middleware-lambda";import { verifyToken } from "./common/jwt";import { useContext } from "./core/context";import resolvers from "./graphql/resolvers";import typeDefs from "./graphql/schema";const server = new ApolloServer({typeDefs,resolvers,context: ({ event, context, express }) => {const auth = express.req.headers["authorization"] as string;if (auth) {const [_, token] = auth.split("Bearer ");try {const user = verifyToken(token);if (user) {return useContext({type: "user",properties: {...user,},});} else {throw new ApolloError("Not authenticated", "UNAUTHENTICATED");}} catch (ex) {}}return useContext({type: "public",});},});export const handler = server.createHandler({});// for local endpointURL is /graphql and for prod it is /stage/graphqlexport const playgroundHandler = (event, context, callback) => {context.callbackWaitsForEmptyEventLoop = false;return lambdaPlayground({endpoint: process.env.REACT_APP_GRAPHQL_ENDPOINT,})(event, context, callback);};