My APIs using JavaScript fetch()

Chris Coppenbarger

• February 16, 2022 16:38

I set up a My API and am needing to call it's endpoint via JavaScript fetch(), but running into a CORS issue. Querying the endpoint from PostMan works fine, but I have a Vue app that I really need to query the endpoint from. 

1. Is localhost blocked?

2. Sample code (with bearer token blocked out):

const headers = {

        "Authorization": "Bearer <token>",

        "Content-Type": "application/json"

      };

      const myInit = {

        method: "POST",

        headers: headers,

        mode: "no-cors",

        body: celigoItem

      }

      fetch("<URL>", myInit)

      .then(response => console.log(response));

0

• 

  Chris Coppenbarger

  • February 16, 2022 16:44

  

  

  I just tried it from a ngrok url, and it's also returning an "unauthorized" response.

  0
• 

  Scott Henderson CTO

  • February 16, 2022 17:33

  

  

  

  Invoking integrator.io APIs directly from a browser is currently unsupported (due to CORS).  This is a known enhancement request, but it is not trivial to expose this capability securely (i.e. where API tokens in the browser layer need to be secured, else limited in scope, etc...).

  The only way to work around the CORS issue right now is to call the integrator.io API directly from your backend servers.  This is not always possible of course, but hopefully this guidance can unblock you.

  0
• 

  Chris Coppenbarger

  • February 16, 2022 17:38

  

  

  Thanks Scott. I figured this was the case, since I have the same issue with Shopify and accessing their Admin API via the same Vue app. I'll see what I can do to make it work from a "backend" server. I'll probably just add a route via my Koa server I'm using to serve up the app in Shopify.

  0

Please sign in to leave a comment.