Questions tagged [fetch-api]

The Fetch API is an improved replacement for XHR, for making asynchronous HTTP requests while better managing redirects and interaction with CORS and Service Workers.

The core of the Fetch API is a JavaScript method simply called fetch, for making asynchronous HTTP requests and for handling the responses from those requests.

For more information about the Fetch API, see:

2287 questions
738
votes
18 answers

No 'Access-Control-Allow-Origin' header is present on the requested resource—when trying to get data from a REST API

I'm trying to fetch some data from the REST API of HP Alm. It works pretty well with a small curl script - I get my data. Now doing that with JavaScript, fetch and ES6 (more or less) seems to be a bigger issue. I keep getting this error…
daniel.lozynski
  • 9,181
  • 6
  • 16
  • 21
696
votes
16 answers

Fetch: POST JSON data

I'm trying to POST a JSON object using fetch. From what I can understand, I need to attach a stringified object to the body of the request, e.g.: fetch("/echo/json/", { headers: { 'Accept': 'application/json', 'Content-Type':…
Razor
  • 19,590
  • 7
  • 50
  • 73
245
votes
6 answers

Trying to use fetch and pass in mode: no-cors

I can hit this endpoint, http://catfacts-api.appspot.com/api/facts?number=99 via Postman and it returns JSON Additionally I am using create-react-app and would like to avoid setting up any server config. In my client code I am trying to use fetch to…
dwww
  • 2,708
  • 3
  • 10
  • 12
241
votes
6 answers

Fetch API with Cookie

I am trying out the new Fetch API but is having trouble with Cookies. Specifically, after a successful login, there is a Cookie header in future requests, but Fetch seems to ignore that headers, and all my requests made with Fetch is…
Khanetor
  • 9,495
  • 8
  • 31
  • 67
238
votes
7 answers

How do I cancel an HTTP fetch() request?

There is a new API for making requests from JavaScript: fetch(). Is there any built in mechanism for canceling these requests in-flight?
Sam Lee
  • 8,493
  • 15
  • 44
  • 54
222
votes
10 answers

How do I upload a file with the JS fetch API?

I am still trying to wrap my head around it. I can have the user select the file (or even multiple) with the file input:
deitch
  • 12,171
  • 13
  • 59
  • 87
209
votes
12 answers

Setting query string using Fetch GET request

I'm trying to use the new Fetch API: I am making a GET request like this: var request = new Request({ url: 'http://myapi.com/orders', method: 'GET' }); fetch(request); However, I'm unsure how to add a query string to the GET request. Ideally,…
mylescc
  • 3,192
  • 3
  • 14
  • 22
193
votes
3 answers

Fetch API vs XMLHttpRequest

I know that Fetch API uses Promises and both of them allow you to do AJAX requests to a server. I have read that Fetch API has some extra features, which aren't available in XMLHttpRequest (and in the Fetch API polyfill, since it's based on…
ilyabasiuk
  • 3,170
  • 2
  • 17
  • 31
188
votes
4 answers

What is an opaque response, and what purpose does it serve?

I tried to fetch the URL of an old website, and an error happened: Fetch API cannot load http://xyz. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://abc' is therefore not allowed access. If an opaque…
Miguel Angelo
  • 22,641
  • 14
  • 53
  • 80
174
votes
27 answers

React Native fetch() Network Request Failed

When I create a brand new project using react-native init (RN version 0.29.1) and put a fetch in the render method to the public facebook demo movie API, it throws a Network Request Failed. There is a very useless stack trace and I can't debug…
Alek Hurst
  • 3,661
  • 5
  • 14
  • 22
170
votes
9 answers

How do I post form data with fetch api?

My code: fetch("api/xxx", { body: new FormData(document.getElementById("form")), headers: { "Content-Type": "application/x-www-form-urlencoded", // "Content-Type": "multipart/form-data", }, method: "post", } I tried…
Zack
  • 1,879
  • 2
  • 9
  • 11
164
votes
4 answers

Using an authorization header with Fetch in React Native

I'm trying to use fetch in React Native to grab information from the Product Hunt API. I've obtained the proper Access Token and have saved it to State, but don't seem to be able to pass it along within the Authorization header for a GET…
Richard Kho
  • 4,306
  • 3
  • 18
  • 34
160
votes
6 answers

Why does .json() return a promise?

I've been messing around with the fetch() api recently, and noticed something which was a bit quirky. let url = "http://jsonplaceholder.typicode.com/posts/6"; let iterator = fetch(url); iterator .then(response => { return { …
haveacigaro
  • 1,741
  • 2
  • 11
  • 8
158
votes
8 answers

Basic authentication with fetch?

I want to write a simple basic authentication with fetch, but I keep getting a 401 error. It would be awesome if someone tells me what's wrong with the code: let base64 = require('base-64'); let url =…
daniel.lozynski
  • 9,181
  • 6
  • 16
  • 21
147
votes
15 answers

What does it mean when an HTTP request returns status code 0?

What does it mean when JavaScript network calls such as fetch or XMLHttpRequest, or any other type of HTTP network request, fail with an HTTP status code of 0? This doesn't seem to be a valid HTTP status code as other codes are three digits in HTTP…
mike nelson
  • 18,814
  • 13
  • 59
  • 66
1
2 3
99 100