Repository navigation
jQuery.ajax doesn’t send headers when ‘dataType‘ is ‘script’ and ‘crossDomain’ is true #5142
Description
In the following example, while the same headers setting is used for all four requests, the header is only sent in the first three requests, it is not sent in the fourth request:
const page =
`<html>
<head>
<script src='/?url=https%3A%2F%2Fcode.jquery.com%2Fjquery-3.6.1.min.js'></script>
</head>
<body>
<script>
var headers = { 'X-Test-Header': 'Test-Header-Value' };
$.ajax('Request_1', { dataType: 'html', headers: headers });
$.ajax('Request_2', { dataType: 'html', crossDomain: true, headers: headers });
$.ajax('Request_3', { dataType: 'script', headers: headers });
$.ajax('Request_4', { dataType: 'script', crossDomain: true, headers: headers });
</script>
</body>
</html>`;
const express = require('express')();
express.get('/', (request, response) => { response.send(page); });
express.get(/^\/Request_[1-4]$/, (request, response) => {
console.log(`${request.path}: ${request.get('X-Test-Header')}`);
response.send(''); });
express.listen(9000);The server logs:
/Request_1: Test-Header-Value
/Request_2: Test-Header-Value
/Request_3: Test-Header-Value
/Request_4: undefined
Shouldn’t the header also be sent in the fourth request?
Activity
mgol commentedon Nov 18, 2022
Thanks for the report. The
scripttransport has two modes - using a script tag withsrcor fetching the contents and inserting an inline script (viajQuery.globalEval). The second one requires CORS so the first one is preferred when cross domain. Here are the current conditions:https://github.com/jquery/jquery/blob/3.6.1/src/ajax/script.js#L47
The code on
main(future jQuery 4.0) is a bit more involved:jquery/src/ajax/script.js
Lines 6 to 20 in f62d8e2
We should investigate adding
headersto the list.I wonder if this would be a breaking change for 3.x? We'll discuss this at the team's meeting.
Ajax: Support `headers` for script transport even when crossDomain
Ajax: Support `headers` for script transport even when cross-domain
mgol commentedon Jan 12, 2023
PR: #5193
Ajax: Support `headers` for script transport even when cross-domain
mgol commentedon Feb 1, 2023
For jQuery 4.0, this will be fixed via #5193. For jQuery 3.x, you can workaround by setting
crossDomaintofalse, even if the request is cross-domain.idiamant commentedon Jan 23, 2024
Trying with jQuery 3.7.1 to use $.ajax with dataType: jsonp (since it's a crossdomain request), and I need to authenticate with some header. I add the headers parameter, and it's not being passed with the request, and therefore my request fails on authentication.
When I disable crossDomain / jsonp, the request is failing on CORS, but the header IS being sent.
Why is that? How can I force it to send the headers with the request using jsonp datatype?
mgol commentedon Jan 23, 2024
@idiamant JSONP is generally meant to be used via script tags where you have no control over special headers. If the server supports cross-domain XHR, it has to have a working CORS setup. In that case, why even use JSONP which is a hacky insecure workaround for infrastructure without CORS?
This looks to me like a question better suited for Stack Overflow. Otherwise, please submit a new detailed issue with a test case. I don’t think we’re likely to be looking at a jQuery issue here, though.
idiamant commentedon Jan 24, 2024
@mgol The issue I was facing is building some web interface which queries a 3rd party service for some data.
Since this is a 3rd party, I don't control it's CORS settings.
For now I've implemented a backend "proxy" solution, which will perform the query on the backend side, and provide me with results locally to my server's frontend.
Tried to avoid using a backend solution for this implementation I'm doing, and only use frontend (allowing me a cheaper hosting of the solution, through some static files bucket).
If you think this is not relevant, then you may ignore this issue.