问题描述
我试图在Node.js服务器上使用Apollo客户端使用以下代码与另一个GraphQL API进行接口:
import fetch from 'node-fetch' import { createHttpLink } from 'apollo-link-http' import ApolloClient from 'apollo-boost' import { API_URL } from '...' const client = new ApolloClient({ link: createHttpLink({ uri: API_URL, fetch: fetch, }), })
它会产生以下错误:
module initialization error: Error fetch is not found globally and no fetcher passed, to fix pass a fetch for your environment like https://www.npmjs.com/package/node-fetch. For example: import fetch from 'node-fetch'; import { createHttpLink } from 'apollo-link-http'; const link = createHttpLink({ uri: '/graphql', fetch: fetch }); at Object.checkFetcher (/var/task/node_modules/apollo-link-http-common/lib/bundle.umd.js:78:19) at createHttpLink (/var/task/node_modules/apollo-link-http/lib/bundle.umd.js:32:30) at new HttpLink (/var/task/node_modules/apollo-link-http/lib/bundle.umd.js:203:38) at new DefaultClient (/var/task/node_modules/apollo-boost/lib/index.js:80:24)
我明白默认情况下,apollo客户端预计将在浏览器上下文中运行,其中fetch方法可用,并且在我需要聚填充或以其他方式提供fetch方法的节点.但我难以弄清楚如何做到这一点.
在 https://www.apollographqql.com/docs/下面链接/#apollo-client 它似乎应该能够使用link选项来传递此信息,并读取apollo-boost源代码似乎建议您可以使用
可以任何人提供一些示例代码,用于使用fetcher初始化Node.js中的Apollo客户端?
参考这里是我的package.json
{ "name": "API-Service", "version": "1.0.0", "description": "", "private": true, "scripts": {}, "dependencies": { "apollo-boost": "^0.1.6", "apollo-link-http": "^1.5.4", "graphql": "^0.13.2", "babel-polyfill": "^6.26.0", "json-rules-engine": "^2.1.0", "node-fetch": "^2.1.2", "mysql": "^2.15.0" } }
推荐答案
结果证明apollo-boost库提供的ApolloClient不接受link选项.切换到使用vanilla apollo-client允许您指定您的获取机制.
虽然apollo-boost和apollo-client在文档中导出ApolloClient,但它们采用异常不同的选项.
import fetch from 'node-fetch' import { createHttpLink } from 'apollo-link-http' import { InMemoryCache } from 'apollo-cache-inmemory' import ApolloClient from 'apollo-client' import { API_URL } from '...' const client = new ApolloClient({ link: createHttpLink({ uri: API_URL, fetch: fetch, }), cache: new InMemoryCache(), })
其他推荐答案
如果仍然希望在Node.js中使用Apollo Boost,但需要多填充浏览器的本机获取API,请尝试 Cross-fetch .我用它来实现我的最小示例,而不是这里.这就是安装它之后可以使用的方式:
import 'cross-fetch/polyfill'; import ApolloClient from 'apollo-boost'; const client = new ApolloClient({ uri: 'https://api.domain.com/graphql', });
其他推荐答案
您可以将fetch选项直接添加到apollo-boost中的ApolloClient.这是示例代码
参考. https://www.apolrographqql.com/docs/react/Essentials/Get-install/#配置 - 选项
import ApolloClient from 'apollo-boost'; import fetch from 'node-fetch'; const client = new ApolloClient({ fetch: fetch });
用apollo-boost版本0.4.3
进行测试问题描述
I am attempting to use an Apollo Client on a node.js server to interface with another GraphQL API using the following code:
import fetch from 'node-fetch' import { createHttpLink } from 'apollo-link-http' import ApolloClient from 'apollo-boost' import { API_URL } from '...' const client = new ApolloClient({ link: createHttpLink({ uri: API_URL, fetch: fetch, }), })
Which yields the following error:
module initialization error: Error fetch is not found globally and no fetcher passed, to fix pass a fetch for your environment like https://www.npmjs.com/package/node-fetch. For example: import fetch from 'node-fetch'; import { createHttpLink } from 'apollo-link-http'; const link = createHttpLink({ uri: '/graphql', fetch: fetch }); at Object.checkFetcher (/var/task/node_modules/apollo-link-http-common/lib/bundle.umd.js:78:19) at createHttpLink (/var/task/node_modules/apollo-link-http/lib/bundle.umd.js:32:30) at new HttpLink (/var/task/node_modules/apollo-link-http/lib/bundle.umd.js:203:38) at new DefaultClient (/var/task/node_modules/apollo-boost/lib/index.js:80:24)
I understand that the Apollo Client by default is expecting to be run in a browser context where a fetch method will be available, and that in a node.js I need to polyfill or otherwise provide a fetch method, but I having trouble figuring out exactly how to do this.
Following the example code at https://www.apollographql.com/docs/link/#apollo-client it appears that I should be able to pass this information in using the link option, and reading the apollo-boost source code seems to suggest that you can pass this information in using fetcherOptions, but neither of these solutions seem to work.
Can anyone provide some example code for initializing an Apollo Client in node.js with a fetcher?
For reference here is my package.json
{ "name": "API-Service", "version": "1.0.0", "description": "", "private": true, "scripts": {}, "dependencies": { "apollo-boost": "^0.1.6", "apollo-link-http": "^1.5.4", "graphql": "^0.13.2", "babel-polyfill": "^6.26.0", "json-rules-engine": "^2.1.0", "node-fetch": "^2.1.2", "mysql": "^2.15.0" } }
推荐答案
It turns out that the ApolloClient provided by the apollo-boost library does not accept a link option. Switching to use the vanilla apollo-client allows you to specify your fetching mechanism.
Although apollo-boost and apollo-client both export an ApolloClient in the docs, they take wildly different options.
import fetch from 'node-fetch' import { createHttpLink } from 'apollo-link-http' import { InMemoryCache } from 'apollo-cache-inmemory' import ApolloClient from 'apollo-client' import { API_URL } from '...' const client = new ApolloClient({ link: createHttpLink({ uri: API_URL, fetch: fetch, }), cache: new InMemoryCache(), })
其他推荐答案
If you still want to use Apollo Boost in Node.js but need to polyfill the native fetch API of the browser, try out cross-fetch. I used it for my minimal example over here. And that's how it can be used after installing it:
import 'cross-fetch/polyfill'; import ApolloClient from 'apollo-boost'; const client = new ApolloClient({ uri: 'https://api.domain.com/graphql', });
其他推荐答案
You can add fetch option directly to the ApolloClient from apollo-boost. Here is the example code
Ref. https://www.apollographql.com/docs/react/essentials/get-started/#configuration-options
import ApolloClient from 'apollo-boost'; import fetch from 'node-fetch'; const client = new ApolloClient({ fetch: fetch });
Tested with apollo-boost version 0.4.3