Angular 角度嵌套JS Grapgql订阅失败

我使用apollo server开发了一个实时应用程序，angular作为前端，nestjs作为后端。我从angular那里得到了这个错误

到“ws://localhost:3000/graphql”的WebSocket连接失败：WebSocket在建立连接之前已关闭

在操场上订阅工作很好

我在操场上尝试我的代码和订阅工作

subscription noti($repoFullName: String!) {
  notificationAdded(repoFullName: $repoFullName) {
    id
  }
}

mutation createNotification($data: NotificationCreateInput!) {
  createNotification(data: $data) {
    id
  }
}

这是我的密码： 内分解器

 @Subscription('notificationAdded')
    notificationAdded(repoFullName: string) {
         return this.pubSub.asyncIterator('notificationAdded');
    }

 @Mutation('createNotification')
    async createNotification(@Args('data') data: NotificationCreateInput) {
        const noti = await this.prisma.prisma.createNotification(data);
        this.pubSub.publish('notificationAdded', {notificationAdded: noti}).then(succ => {
            console.log(succ);
        }).catch(error => {
            console.log(error);
        });
        return noti;
    }

我的AppModule（NestJs）

我的图形模块（角度）

const uri=environment.backend\u graph\u url；//{
console.log（'connectionCallback'）
}
}
});
导出函数createApollo（httpLink:httpLink）{
常量链接=拆分(
//按操作类型拆分
（{query}）=>{
const{kind，operation}=getMainDefinition（查询）；
返回种类=='OperationDefinition'&&operation=='subscription'；
},
ws，
创建（{uri}），
);
返回{
链接
缓存：新的InMemoryCache（），
};
}
@NGD模块({
导出：[Apollo模块，HttpLinkModule]，
供应商：[
{
提供：APOLLO_选项，
useFactory:createApollo，
deps:[HttpLink]，
},
],
})
导出类GraphQLModule{}

我想得到这份工作。 请帮忙

---

关于

您是否希望在后端使用带有graphql的WebSocket？graphql游乐场使用http/s和GET/POST请求。我在同一点上苦苦挣扎。你在这期间有什么成功吗？

@Module({
  imports: [
    GraphQLModule.forRoot({
      typeDefs: [typeDefs,notificationTypeDefs, pushSubscriptionTypeDefs,accountTypeDefs],
      resolverValidationOptions: {
        requireResolversForResolveType: false,
      },
      installSubscriptionHandlers: true,
      subscriptions: {
        onConnect : connectionParams => {
          console.log(connectionParams);
        }
      },
      context: ({ req }) => {
        return {
          request: req,
        };
      },
      playground: true,
      debug: false,
    }),
    PrismaModule,
    AccountModule,
    PushSubscriptionModule,
    NotificationModule,
    CardModule,
  ],
  controllers: [AppController],
  providers: [
    AppService,
  ],
})
export class AppModule {}

const uri = environment.backend_graph_url; // <-- add the URL of the GraphQL server here
const ws = new WebSocketLink({
  uri: `ws://localhost:3000/graphql`,
  options: {
    reconnect: true,
    timeout: 45000,
    connectionCallback : (error) => {
      console.log('connectionCallback')
    }
  }
});

export function createApollo(httpLink: HttpLink) {


  const link = split(
    // split based on operation type
    ({ query }) => {
      const { kind, operation } = getMainDefinition(query);
      return kind === 'OperationDefinition' && operation === 'subscription';
    },
    ws,
    httpLink.create({uri}),
  );
  return {
    link,
    cache: new InMemoryCache(),
  };
}

@NgModule({
  exports: [ApolloModule, HttpLinkModule],
  providers: [
    {
      provide: APOLLO_OPTIONS,
      useFactory: createApollo,
      deps: [HttpLink],
    },
  ],
})
export class GraphQLModule {}