Menu
I have a simple index.html file. This html is loading from localhost:3000
<body>
<h1>Some app</h1>
<script src="http://localhost:3005/script.js"></script>
</body>
The script.js is set to load from another origin: localhost:3005.
From my understanding, The browser should intercept the request and add the origin header to it - and make a preflight request to localhost:3005 server to check if localhost:3000 is allowed.
But i'm getting no origin. The browser doesn't seem to add the origin header.
This is the server responsible for serving the script.js file (localhost:3005). I'm using the cors module.
const app = express()
const whitelist = ["http://localhost:3001"]
const corsOptions = {
origin: function(origin, callback) {
console.log("origin is: ", origin); //undefined -- why is undefined??
if (whitelist.indexOf(origin) !== -1) {
callback(null, true)
}
else {
callback(new Error('Not allowed by CORS'))
}
}
}
app.use(cors(corsOptions), express.static(__dirname))
app.listen(3005, () => {
console.log("server listening on port 3005")
})
My actual goal is to white-list only localhost:3000 for asking for my script.js
And i put localhost:3001 just to test if i'm actually getting a cors error - as it should be.
But i'm not even getting the origin - what is causing this? I'm getting the same behavior in both Firefox and Chrome. Did i misunderstood this hole process? Thanks :)
EDIT: Maybe seeing the request helps
981
Simply activate the add-on and perform the request. CORS or Cross-Origin Resource Sharing is blocked in modern browsers by default (in JavaScript APIs). Installing this add-on will allow you to unblock this feature.
Also, for completeness here and to be clear: For navigations, browsers send no Origin header. That is, if a user navigates directly to a resource — by pasting a URL into a browser address bar, or by following a link from another web document — then browsers send no Origin header. Save this answer.
To get rid of a CORS error, you can download a browser extension like CORS Unblock ↗. The extension appends Access-Control-Allow-Origin: * to every HTTP response when it is enabled. It can also add custom Access-Control-Allow-Origin and Access-Control-Allow-Methods headers to the responses.
The browser adds the Origin header to the HTTP request before sending the request to the server. The browser is solely responsible for setting the Origin header. The Origin header is always present on cross-origin requests, and the client has no way of setting or overriding the value.
I think you might be misunderstanding the purpose of CORS. It gives servers the ability to opt-in to certain kinds of requests that would otherwise be disallowed under the browser's Same Origin Policy. It doesn't provide a mechanism to disallow requests that were previously allowed.
Executing scripts from foreign origins in the src of a <script> tag has always been allowed under the Same Origin Policy, and so CORS simply doesn't apply. That's why there's no header on the request.
My actual goal is to white-list only
localhost:3000for asking for myscript.js.
You can't use CORS for that. In fact, you probably can't do that at all. I would take a step back and ask why you want to do that. If you're trying to secure private data then some sort of authentication mechanism (tokens, cookies, whatever) is probably necessary.
57
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
