node.js - 在 Heroku 上开发时，使用 GraphQL 的 Shopify 应用程序无法运行

Question

我正在使用 Node.js 和 React 开发 Shopify 私有(private)应用程序，并使用 GraphQL api 发出请求。当我在本地运行它并使用 NGROK 发布它时一切正常，但是当我将代码推送到 Heroku 时，会发生错误。好像是ApolloClient有问题，但是想不通。

我这样设置 ApolloClient (基于本教程 https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react/fetch-data-with-apollo ):

import ApolloClient from 'apollo-boost';

const client = new ApolloClient({
    fetchOptions: {
        credentials: 'include'
    }
});

构建时，关于 fetch 的错误发生所以我修改了代码(基于 Using ApolloClient with node.js. "fetch is not found globally and no fetcher passed" ):

import ApolloClient from 'apollo-boost';
import { fetch } from 'node-fetch'

const client = new ApolloClient({
    fetch: fetch,
    fetchOptions: {
        credentials: 'include'
    }
});

构建成功，但我的 GraphQL 调用返回错误 graphql error only absolute urls are supported ，所以我尝试像这样修改代码:

import ApolloClient from 'apollo-boost';
import { fetch } from 'node-fetch'

const client = new ApolloClient({
    fetch: fetch,
    fetchOptions: {
        credentials: 'include'
    },
    uri: `https://${shopOrigin}/admin/api/2019-10/graphql.json`
});

现在发生的错误是 Network Error: Failed to Fetch有 CORS 问题。

谁能帮我解决这个问题？如果您需要更多信息，请告诉我。

Answer 1

Shopify 教程建议在服务器端使用 isomorphic-fetch。我尝试将它包含在 Next.js 端并且构建成功。

在我的 _app.js

require('isomorphic-fetch');
import ApolloClient from 'apollo-boost';

...

const client = new ApolloClient({
  fetchOptions: {
    credentials: 'include'
  },
});