Nuxt Apollo Shopify Graphql

Question

所以我使用https://github.com/nuxt-community/apollo-module 我正在尝试将其设置为连接到我的 shopify graphql API

在 nuxt.config.js 上：

  apollo: {
    clientConfigs: {
      default: {
        httpEndpoint: 'https://my-store.myshopify.com/admin/api/2020-01/graphql.json',
        getAuth: () => 'Bearer 26cfd63bbba75243b55fad2c8de0a12f'
      },
    }
  },

在 index.vue 上，我有以下内容：

  <script>
    import gql from 'graphql-tag'

    export default {
      apollo: {
        data: {
          query: gql`
            query {
              shop {
                name
              }
            }
          `,
        }
      }
    }
  </script>

• 这是正确的设置吗？
• 我似乎遇到了 cors 策略错误。我相信这与 Shopify 需要的缺少标题有关：https://help.shopify.com/en/api/graphql-admin-api/getting-started#authentication
  • 如何将“X-Shopify-Access-Token”添加到设置中？

任何帮助将不胜感激。

谢谢

Answer 1

这就是我们在 Nuxt Config 中的工作方式。

    apollo: {
        clientConfigs: {
            default: {
                httpEndpoint:
                    "http://api.another-backend-example.com/graphql",
                persisting: false
            },
            shopify: {
                httpEndpoint:
                    "https://my-store.myshopify.com/api/2019-07/graphql.json",
                httpLinkOptions: {
                    headers: {
                        "Content-Type": "application/json",
                        "X-Shopify-Storefront-Access-Token":
                            "123456789abcdefghi"
                    }
                },
                persisting: false
            }
        }
    }

我们还为 Nuxt 构建了很多有用的 Shopify 组件，也许这对您有帮助：https://github.com/funkhaus/shophaus/