无法读取 null 的属性'executeQuery'

Question

谁能帮我理解为什么我得到这个错误:

我的设置:

新的sveltekit项目。ASP.net核心后端为graphql。在我修改它以包含订阅之前，查询是正常的。

错误味精:

Cannot read property 'executeQuery' of null
TypeError: Cannot read property 'executeQuery' of null
at C:[e-mail]:234:11
at C:ReposAGScadanode_moduleswonkadistwonka.js:254:18
at Object.next (C:ReposAGScadanode_moduleswonkadistwonka.js:1161:14)
at C:[e-mail]:173:11
at Object.subscribe (C:ReposAGScadanode_modulessveltestoreindex.js:53:9)
at Object.subscribe (C:[e-mail]:96:14)
at C:[e-mail]:168:14
at C:ReposAGScadanode_moduleswonkadistwonka.js:1159:9
at C:ReposAGScadanode_moduleswonkadistwonka.js:247:7
at C:ReposAGScadanode_moduleswonkadistwonka.js:590:18

源代码index.svelte:

import { setClient, query, operationStore, subscription } from '@urql/svelte';
import { createClient, defaultExchanges, subscriptionExchange } from '@urql/svelte';
import { createClient as createWSClient } from 'graphql-ws';
const wsClient = process.browser ? createWSClient({url: 'ws://localhost:5000/graphql',}):null;  
const client = process.browser ? createClient({
url: 'http://localhost:5000/graphql',
exchanges: [
...defaultExchanges,
subscriptionExchange({
forwardSubscription: (operation) => ({
subscribe: (sink) => ({
unsubscribe: wsClient.subscribe(operation, sink),
}),
}),
}),
],
}): null;
let tags = operationStore(`query {tags{tagName value}}`);
let onTagUpdated = operationStore(`subscription {onTagUpdated{tagName value}}`);
query(tags);
subscription(onTagUpdated);
setClient(client);
if($tags.fetching)
{
console.log("loading");
}    
else
{
console.log($tags.data);
}

谢谢你的帮助。

Answer 1

我得到了sveltekit和URQL与订阅支持。

来源可以在这里找到:https://github.com/ruban258/sveltekit_urql_test

import { Client, setClient, operationStore, subscription, defaultExchanges, subscriptionExchange, query, createClient } from '@urql/svelte';
import {SubscriptionClient} from 'subscriptions-transport-ws';
import { browser } from '$app/env';
import { createClient as createWSClient } from 'graphql-ws'; 

const subscriptionClient = browser ? new SubscriptionClient('ws://localhost:5000/graphql', { reconnect: true }): null;
const wsClient = browser? createWSClient({
url: 'ws://localhost:5000/graphql',
}):null;
const client = browser ? new Client({
url: 'http://localhost:5000/graphql',
exchanges: [
...defaultExchanges,
subscriptionExchange({
forwardSubscription: (operation) => subscriptionClient.request(operation)
}),
],
}): null;

const messages = operationStore(`
subscription onTagUpdated{
onTagUpdated{
tagName
value
}
}
`);
const tags = operationStore(`
query{
tags{
tagName
value
}
}
`);  
const handleSubscription = (messages = [], data) => {
return [data.newMessages, ...messages];
};

setClient(client);