cors
cors copied to clipboard
expressjs
No-Access-Control-Origin
Hello! I recently started using express on Windows 11 on NodeJS v17.7.2 and NPM v8.5.2. I installed the latest version of Express and am trying to send HTTP requests from my index.html file. However, I receive the error:
Access to XMLHttpRequest at 'https://privateurl.com' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I googled this and found that it was an issue with request headers. I tried everything, whether it be modifying my code, changing how I send requests, etc. But nothing seems to work. This is my code:
const express = require('express')
const cors = require('cors');
const { join } = require("path");
const app = express()
app.use(cors());
app.use(function (req, res, next) {
res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
res.setHeader('Access-Control-Allow-Credentials', true);
next();
});
app.use(express.static(join(__dirname)));
app.listen(3000, () => {
console.log('alive');
})
My index.html file:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Thing</h1>
<video id="source">
</video>
<script src="bundle.js"></script>
<script>
console.log(window);
const params = new Proxy(new URLSearchParams(window.location.search), {
get: (searchParams, prop) => searchParams.get(prop),
});
let query = params.url;
console.log("Queueing " + query + ".");
window.execute(query);
</script>
</body>
</html>
bundle.js uses this which throws the error:
axios.defaults.headers.post['Access-Control-Allow-Origin'] = '*';
const response = await axios.get(url);
This is because you have to you the option method of express.
import express from 'express'
import { searchClientOnDB } from "./controller/ClienteController";
import cookieParser from 'cookie-parser'
import { eMailController } from './controller/eMailController';
import cors from 'cors'
const corsOptions = cors({ credentials: true, origin: ["https://yourdomain.com", /\.yourdomain\.com$/] })
const app = express();
app.use(express.json());
app.use(cookieParser())
app.use(cors({credentials:true}))
app.options('*', corsOptions)
app.use('/temp', express.static('./temp'))
app.post('/', searchClientOnDB)
app.post('/logout', searchClientOnDB)
app.get('/',eMailController) //
export default app;
I'm experiment a similar issue, but is something more related to Typescript, but in javascript this works great!!
I totally forgot I had this open lol. I believe this was an issue with my code actually haha, but thank you for the help!