如何在没有 CORB 警告的情况下检查 URL 是否存在？

Question

Some cities in our country are blocked from accessing some websites (for example Twitter).

My website needs to hide some services for different users (for example hide login with Twitter for the user who can not access it).

I am about to check whether Twitter can be accessed in the front-end and hide the service or not.

Here is the code:

function urlExists(url, callback) {
    $.ajax({
        type: 'HEAD',
        url: url,
        dataType:"jsonp",
        timeout: "1000",
        statusCode: {
            404: function () {
                alert("404");
            },
            200: function () {
                alert("200");
            }
        }
    });
}
var a = urlExists("https://twitter.com/");

Actually, it works well while in Chrome it throws a warning:

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://twitter.com/?callback=jQuery35100680029209969133_1611985917654&_=1611985917655 with MIME type text/html. See https://www.chromestatus.com/feature/5629709824032768 for more details.

I don't want this warning to the user.

I have found a way in How can I remove the CORB warning? while it seems have to use an API of Chrome. However, there is CROB also in Firefox, I don't want to write a code for each browser only for this.

Is there any way to achieve this by js/jquery without this warning? Thank you.

Answer 1

Append xhrFields option for your ajax 's options.

The XMLHttpRequest.withCredentials property is a Boolean that indicates whether or not cross-site Access-Control requests should be made using credentials such as cookies, authorization headers or TLS client certificates. Setting withCredentials has no effect on same-site requests.

Ref link.

Your function will become like:

function urlExists(url, callback) {
    $.ajax({
        type: 'HEAD',
        url: url,
        dataType:"jsonp",
        timeout: "1000",
        xhrFields: { // this option
            withCredentials: true,
        },
        statusCode: {
            404: function () {
                alert("404");
            },
            200: function () {
                alert("200");
            }
        }
    });
}
var a = urlExists("https://twitter.com/");