question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

axios vs fetch - no-cors mode...

See original GitHub issue

Axios - fails

	axios('https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js', {
		method: 'HEAD',
		mode: 'no-cors',
		headers: {
			'Access-Control-Allow-Origin': '*',
			Accept: 'application/json',
			'Content-Type': 'application/json',
		},
		withCredentials: true,
		credentials: 'same-origin',
		crossdomain: true,
	}).then((response) => {
		console.log(response);
	}).catch((e) => {
		console.log(e);
	});

Fetch - works

	const testURL = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
	const myInit = {
		method: 'HEAD',
		mode: 'no-cors',
	};

	const myRequest = new Request(testURL, myInit);

	fetch(myRequest).then(function(response) {
		return response;
	}).then(function(response) {
		console.log(response);
	}).catch(function(e){
		console.log(e);
	});

Summary

in Axios I get the following cors error but if I replace with standard fetch it works fine. I’ve tried a few different configurations with axios and must be missing something?

Error:

Failed to load https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

Context

  • axios version: * axios v0.17.1
  • Environment: * Chrome 63.0.3239.132 (Official Build) (64-bit)

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:35
  • Comments:17 (2 by maintainers)

github_iconTop GitHub Comments

39reactions
emilyemorehousecommented, Feb 11, 2018

Hi @JohnRSim,

It’s important to note is that mode, credentials, and crossdomain aren’t supported for configuring Axios. The reason why your example works when using fetch is because those options are part of the Request API (docs for mode are here).

Probably TMI, but Axios uses a XMLHttpRequest under the hood, not Request.

I believe that your request using Axios fails because CORS is still being enforced, though I’m not sure why you’re getting a Network Error. I’ll try to duplicate this locally as well.

11reactions
b4dnewzcommented, Mar 21, 2019

so there is no way to make axios bypassing cors errors?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Axios vs. fetch(): Which is best for making HTTP requests?
To send data, fetch() uses the body property for a post request to send data to the endpoint, while Axios uses the data...
Read more >
mode: 'no-cors' working with fetch but fails for axios
Whereas fetch is based on Request API, which allows specifying mode: "no-cors", axios is based on XHR, which has no support for specifying ......
Read more >
JavaScript Guide: Axios vs. Fetch - Pluralsight
The Fetch API provides a JavaScript interface for accessing and manipulating ... 3 mode: 'cors', // no-cors, *cors, same-origin 4 cache: ...
Read more >
Request to api from axios (cross domain) (CORS) error
I'm try to fetch data from bank api with AXIOS and heve an error. I suffer 3 days with this error. I already...
Read more >
Http Requests using Fetch API and Axios | by Reem Shaikh
Fetch and Axios are very similar in functionality. Some developers prefer Axios over built-in APIs for its ease of use. However, Fetch API...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found