axios gives me a CORS error, fetch doesn't. Why is that?

NODE

import axios from 'axios';
let res = await axios('https://example-29544e.webflow.io').catch((err) => {
  console.error(err);
});
console.log(res);

import axios from 'axios';
let res = await axios('https://example-29544e.webflow.io').catch((err) => {
  console.error(err);
});
console.log(res);

Access to fetch at 'https://example-29544e.webflow.io/' from origin 'http://127.0.0.1:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. fetcher.js?v=36de8185:44 GET https://example-29544e.webflow.io/ net::ERR_FAILED 200

DENO

try {
  const res = await fetch('https://example-29544e.webflow.io');
  console.log(await res.text());
} catch (error) {
  console.log(error);
}

try {
  const res = await fetch('https://example-29544e.webflow.io');
  console.log(await res.text());
} catch (error) {
  console.log(error);
}

This seems to fetch the data just fine. Interestingly, using the above approach in Node produces another CORS error. I'm confused

try {
  const res = await fetch('https://example-29544e.webflow.io');
  console.log(await res.text());
} catch (error) {
  console.log(error);
}

try {
  const res = await fetch('https://example-29544e.webflow.io');
  console.log(await res.text());
} catch (error) {
  console.log(error);
}

44 Replies

Unknown User•2y ago

Message Not Public

beerman•2y ago

Is there any way to ignore cors in node fetch?

Unknown User•2y ago

Message Not Public

beerman•2y ago

Then how do people usually fetch the data in those sort of scenarios?

Unknown User•2y ago

Message Not Public

beerman•2y ago

I will try the sveltekit deno adapter and see if I can get it to work there Quick question, I just created a demo project with deno init added index.html and added the main.ts to the html head via <script src="main.ts"></script> but I can't seem to get it to work. I keep getting Refused to execute script from 'http://127.0.0.1:5500/main.ts' because its MIME type ('video/mp2t') is not executable. in console. What am I doing wrong? the dev server was started using the vsc extension live server

Unknown User•2y ago

Message Not Public

beerman•2y ago

It keeps telling me that document is not defined

error: Uncaught (in promise) ReferenceError: document is not defined const el = (document.querySelector('body').innerHTML = bodyContent)

import * as cheerio from 'https://esm.sh/v97/cheerio@1.0.0-rc.12/es2022/cheerio.js'

const res = await fetch('https://example-29544e.webflow.io')
const html = await res.text()

const $ = cheerio.load(html)
const headContent = $(`head`).html()
const bodyContent = $(`body`).html()

const el = (document.querySelector('body').innerHTML = bodyContent)

import * as cheerio from 'https://esm.sh/v97/cheerio@1.0.0-rc.12/es2022/cheerio.js'

const res = await fetch('https://example-29544e.webflow.io')
const html = await res.text()

const $ = cheerio.load(html)
const headContent = $(`head`).html()
const bodyContent = $(`body`).html()

const el = (document.querySelector('body').innerHTML = bodyContent)

and in console

Uncaught SyntaxError: Cannot use import statement outside a module (at main.js:1:1)

Doctor 🤖•2y ago

Put type="module" on your script tag.

beerman•2y ago

Thanks, that has gotten of the import error, but document is still undefined

Doctor 🤖•2y ago

This is in the browser yes?

beerman•2y ago

no, when I run deno run --allow-write --allow-net main.js

Doctor 🤖•2y ago

Document isn’t defined in deno. It gives you type information but there is no document in deno. Unlike a html page which is a document.

beerman•2y ago

beerman•2y ago

So how does one interact with the dom?