8

I recently moved from using jQuery to using isomorphic-fetch with Redux. When running in IE, it manages to fetch fine. However I get the below when running in Chrome.

Failed to load resource: the server responded with a status of 401 (Unauthorized)

It may be worth noting that the web api does have windows authentication enabled.

Here's the code that executes the fetch:

export const fetchSearchResults = (name) => {
  return (dispatch) => {
    dispatch(requestSearchResults(name))
    return fetch(API URI HERE)
      .then(response => response.json())
      .then(json => {
        console.log('Fetch: ' + json.message.features.length)
        dispatch(receiveSearchResults(json))
      })
  }
}
Jacob Mason
  • 1,355
  • 5
  • 14
  • 28
  • http://stackoverflow.com/questions/29782222/jquery-ajax-call-results-in-401-unauthorized-response-when-in-chrome-or-firefo – Can Ürek Mar 10 '16 at 09:25
  • 1
    Questions seeking debugging help ("why isn't this code working?") must include the desired behavior, a specific problem or error and the shortest code necessary to reproduce it in the question itself. Questions without a clear problem statement are not useful to other readers. See: [How to create a Minimal, Complete, and Verifiable example](http://stackoverflow.com/help/mcve). – Marcos Pérez Gude Mar 10 '16 at 09:25
  • @CanÜrek My question relates to isomorphic-fetch, jQuery works fine cross-browser. – Jacob Mason Mar 10 '16 at 09:45
  • This question feels well-worded to me, FWIW. And the accepted answer appears to work, for the reasons the answerer describes. – ericsoco Nov 04 '16 at 20:49

1 Answers1

28

I suppose you have cookie-based authentication on server. In this case it could be related to credentials key for fetch. XHR requests, that used in jQuery always send your cookie, but using fetch you should pass credentials option with

  • same-origin if you make request to the same origin (domain)
  • include otherwise

Like this:

...
fetch(API_URI_HERE, {credentials: 'same-origin'})
...

I assume that it works in IE because fetch polyfill uses XHR requests under the hood.

ericsoco
  • 24,913
  • 29
  • 97
  • 127
Alexandr Subbotin
  • 1,714
  • 2
  • 17
  • 16