Shopify Admin Graphql API in a Vue Appolication

Shopify Partner
15 0 0

Hi All,

So I am creating my own reporting system in Vue.
n order to get the relvant details, I need to use the admin API.

However, when I add in the details for API in my config, I keep on getting cors errors and I am not sure why.
The same details are used in INSOMNIA when I run my queries and they work absolutly fine with the details below, but not sure why I keep on gettgin cors error in my Vue App.
I am using nuxt to do this.

Any ideas on how to fix this?

Thanks

 apollo: {
    clientConfigs: {
      default: {
        httpEndpoint: 'https://{{ STORE_NAME }}.myshopify.com/admin/api/2020-04/graphql.json',
        getAuth:() => 'Bearer {{ API_PASSWORD }}',
        httpLinkOptions: {
          headers: {
            'Content-Type': 'application/graphql',
            'Accept': 'application/json',
            'X-Shopify-Access-Token': '{{ API_PASSWORD }}'
          },
          fetchOptions: {
            mode: 'cors', //Cors Needed for external Cross origins, need to allow headers from server
          },
          credentials: "include", //must be omit to support application/json content type
        }
      }
    }
  },
0 Likes
Highlighted
Shopify Staff
Shopify Staff
1041 140 167

Hey @kapilgohil 

 

These requests will need to come from the server side. Sending them from the browser will hit CORS issues.

 

Vue -> Your API -> Shopify's API.

Notice; Out of office, replies will be delayed until my return. Thanks!
0 Likes