Nuxt Apollo Shopify Graphql

huangapple go评论84阅读模式
英文:

Nuxt Apollo Shopify Graphql

问题

Here's the translated content:

我正在使用 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>

任何帮助将不胜感激。

谢谢

英文:

So I am using the https://github.com/nuxt-community/apollo-module
I am trying to set this up to connect to my shopify graphql API

On nuxt.config.js:

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

on index.vue, i have the following:

  &lt;script&gt;
    import gql from &#39;graphql-tag&#39;
    
    export default {
      apollo: {
        data: {
          query: gql`
            query {
              shop {
                name
              }
            }
          `,
        }
      }
    }
  &lt;/script&gt;

Any help would be much appreciated.

Thanks

答案1

得分: 2

这是我们在Nuxt配置中的工作方式。

    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/

英文:

This is how we have it working in our Nuxt Config.

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

We also built a lot of useful Shopify components for Nuxt, maybe this helps you: https://github.com/funkhaus/shophaus/

huangapple
  • 本文由 发表于 2020年1月4日 00:37:02
  • 转载请务必保留本文链接:https://go.coder-hub.com/59582129.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定