How to add additional information in User-agent in jQuery ajax?

Question

I read about this here and here, but still I couldn't figure out how to do it in jQuery ajax. I tried the code from one of the answers of the questions I linked, but it discarded the user agent override:

$.ajax({ 
    url: "http://blablabla.com/",
    dataType:'html', 
    beforeSend: function (req) {
        req.setRequestHeader('User-Agent', 'https://graphicdesign.stackexchange.com/users/69916/vikas');
    },
    error: function() { alert("No data found");},
    success: parseResult
});

My current User-agent string that is being sent is this:

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.40 Safari/537.36 Edg/92.0.902.9

And I want to add my other SE profile URL too, in this which is https://graphicdesign.stackexchange.com/users/69916/vikas

I want to do this because it has been suggested here in case you're involved in chatbots.

A simple example about how to put additional information, i.e., my profile URL in existing User-agent and send it using ajax to any api, would help.

1. Do not assume posts are closed "without reason", it only serves to alienate people. 2. What did you not figure out from the Q&A on changing user-agent with jQuery? — 0Valt
– 0Valt, Commented Jun 12, 2021 at 17:09
@OlegValter they talked about replacing the user-agent string with custom one, whereas I'm interested in appending some extra string to existing user-agent string. — Vikas
– Vikas, Commented Jun 12, 2021 at 17:26
@OlegValter that's the problem. Earlier I thought it's just replacing and not appending, but when I cross checked my console, it says you're not allowed to change it — Vikas
– Vikas, Commented Jun 12, 2021 at 17:36
ah, your actual problem is the "unable to set an unsafe header" right? Well, that's a bit complicated. The explanation might take a while but in the meantime, you can use the native fetch (set the UA to whatever): (async () => { const res = await fetch(location.href, { method: "GET", headers: { "User-Agent": navigator.userAgent } }); console.log(res); })(); — 0Valt
– 0Valt, Commented Jun 12, 2021 at 17:48
continuing on: the problem with setting the header with jQuery is browser-specific (in particular to those using Chromium - Chrome, Edge at least). When the User-Agent header was removed from the list of forbidden headers, the paths diverged - it seems like Chromium-based ones still thinks it is an unsafe header, while Firefox has no problems with it. Since jQuery uses XMLHttpRequest under the hood, you won't be able to override in those browsers (at least now). As for the MSE post of Jeff, I think they did not even think of someone requesting from JS back then, it was 2009 after all — 0Valt
– 0Valt, Commented Jun 12, 2021 at 18:06

0Valt · Accepted Answer · 2021-06-12 19:55:38Z

jQuery uses XMLHttpRequest to send the request and is therefore subject to the same limitations and issues it has. In particular, when you call the setRequestHeader or provide a headers configuration option, a corresponding XMLHttpRequest method is used to set the headers.

This is what jQuery does under the hood in case of the configuration object:

// Set headers
for ( i in headers ) {
    xhr.setRequestHeader( i, headers[ i ] );
}

As you might know, step 5 of the algorithm from the spec of the setRequestHeader method says that it should return if the header is in the "forbidden headers" list:

If name is a forbidden header name, then return.

This is important as the User-Agent header used to be in that list (the draft that made it forbidden is the one from September 2008). This is no longer the case (see the issue #37 on the Fetch repo), however, Chromium-based browsers (meaning you are out of luck with at least Chrome and Edge) will either silently drop it (in case of the Fetch API or throw an error:

Refused to set unsafe header "User-Agent"

See the following note from the MDN reference:

The User-Agent header is no longer forbidden, as per spec — see forbidden header name list (this was implemented in Firefox 43) — it can now be set in a Fetch Headers object, or via XHR setRequestHeader(). However, Chrome will silently drop the header from Fetch requests (see Chromium bug 571722).

MDN refers to the bug 571722 which is considered to be worked on, so things are likely to change in the near future.

Collectives™ on Stack Overflow

How to add additional information in User-agent in jQuery ajax?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related