Apollo-link-rest: Broken React-Apollo example

Created on 7 Jun 2018  ·  6Comments  ·  Source: apollographql/apollo-link-rest

Hello:

I'm just getting started with apollo-link-rest with the basic configuration in your react-apollo codesandbox.

Instead of displaying the tv show list, the interface shows the following error: : Network error: Failed to execute 'fetch' on 'Window': Invalid credentials mode.

When replicating that code in my own create-react-app environment, I also caught the following error when running a request on Apollo DevTools:

{
  "errors": [
    {
      "message": "forward is not a function",
      "locations": [
        "TypeError: forward is not a function\n    at RestLink../node_modules/apollo-link-rest/bundle.umd.js.RestLink.request (http://localhost:3000/static/js/bundle.js:21028:20)\n    at http://localhost:3000/static/js/bundle.js:19809:33\n    at ApolloLink.request (http://localhost:3000/static/js/bundle.js:17407:12)\n    at ApolloLink.request 
    }
  ]
}

Thanks a lot for your work on this link! It makes working with REST much more manageable by bringing GraphQL-like features for those of us stuck with REST APIs.

help wanted 🛠 question❔

Most helpful comment

Should be fixed in v0.3.1 -- now available!

All 6 comments

@sinisterra When we see forward is not a function in our app, it's usually because we forgot an @client or @rest(…) directive on one of the nodes. Is that the case for you?

In regards to your error with fetch -- what browser are you testing in?

@fbartho No, I'm running exactly the same query from the example, the @rest directive is being applied properly. I'm using Google Chrome 67.0.3396.62. When I tried to run the example in Firefox 60.0.1, it also failed but with a different error: Network error: 'credentials' member of RequestInit 'null' is not a valid value for enumeration RequestCredentials.

it's not only about the broken example! I think this issue is very critical.
I am also getting the same error right now, in my production environment which was working fine the last several months using apollo-link-rest. I guess this must be due to a browser update?
I am using chrome Version 67.0.3396.79 (Official Build) (64-bit)

The same issue is happening in safari and firefox.. I totally dont get it tbh.. the same version of my application was working fine since May24.

it is only happening with requests I do with apollo-link-rest, although I've configured my customFetch fn, which is working. ¯_(ツ)_/¯

I am also getting the same error when i remove my customFetch config.

I actually found the issue.
I am using a customFetch function, which is called by apollo-link-rest with the options parameter credentials: null. This is causing this error with alle the browsers including the new version of chrome.

my quick fix for my custom fetch function since I am not using credentials is the following:

export function fetchWithAuth(url, options = {}) {
  // this fixes apollo-link-rest providing credentials: null options
  const { credentials, ...opt } = options
  return fetch(url, getOptions(opt));
}

I was also banging my head against the wall, getting "Network Error: Failed to Fetch" preventing the query from even executing with apollo-link-rest. @JuHwon is right, this appears to be tied to the credentials option on the RestLink constructor. While formerly it worked as optional per the documentation, I now can only get it to work after including the option like so:

const restLink = new RestLink({  
  uri: ${process.env.REACT_APP_API_URL}/,  
  credentials: 'same-origin',  // eg. or credentials: 'omit', etc
});

Should be fixed in v0.3.1 -- now available!

Was this page helpful?
0 / 5 - 0 ratings