'apollo explorer say "isTrusted": true when i try use Subscription

guys, I have a problem when I want to use a Subscription I'm facing this issue I don't find a solution in any place, I'm a GQL user and i decide to use Subscription to make real-time website but I'm facing a a this issue , hare is code

I'm trying to show apollo docs but I'm facing another issue(graphql doesn't find my resolver), so I try to use this pace of code in my mind it's work but the issue is it says Unable to connect wss://localhost:4001 also I'm trying to use Unable to connect wss://localhost:4001/graphql and Unable to connect wss://localhost:4001/subscription, also i try this three way with using ws

// my resolver
const somethingChanged = () => {
  // subscribe: () => {
  console.log("subscribe")
  pubsub.asyncIterator(SOMETHING_CHANGED_TOPIC)
  // }
}

const makeId = () => {
  // make id generator 36 symbols
  let id = Math.random().toString(36).split(".")[1]
  pubsub.publish(SOMETHING_CHANGED_TOPIC, {
    somethingChanged: {
      id,
    },
  })
  return id
}

const resolvers = {
  Subscription: {
    somethingChanged,
  },
  Query: {
    hello: () => "Hello world!",
  },
  Mutation: {
    makeId,
  },
}
// app.ts
import { createServer } from "http"
import express from "express"
import { ApolloServer, gql } from "apollo-server-express"
import { typeDefs } from "./graphql/schema"
import "colors"
import resolvers from "./graphql/root"
import connect from "./db/connect"
import { PubSub } from "graphql-subscriptions"

const SOMETHING_CHANGED_TOPIC = "something_changed"

require("dotenv").config()
export const pubsub = new PubSub()

// 1  creating  one function for app
const startServer = async () => {
  // 2 // declaring app as express
  const app = express()
  const httpServer = createServer(app)

  setInterval(() => {
    console.log(`Server was work ${Math.random().toString()}`.green)
  }, 2000)

  // middleware's
  connect()

  // 5
  const apolloServer = new ApolloServer({
    typeDefs,
    resolvers,
    context: ({ req }) => req,
  })

  // 6
  await apolloServer.start()

  // 7
  apolloServer.applyMiddleware({
    app,
    path: "/graphql",
  })

  // 8
  httpServer.listen({ port: process.env.PORT || 4001 }, () =>
    console.log(
      `Server listening on localhost:4001${apolloServer.graphqlPath}`.blue
    )
  )
}

startServer()


I just want to test in apollo explorer but it doesn't work



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source