Errors when using fetch() in vanillajs, why?

Question

I have this error :

TypeError: NetworkError when attempting to fetch resource.

when I tried to fetch data from a server. and I don't know why...

My code :

getListApps: async function () {
             let url = `${SA_BASE_URL}/applications`;

            // Set headers
            let headers = new Headers();
            headers.append('Access-Control-Allow-Origin', '*');
            headers.append('Access-Control-Allow-Methods', 'GET');
            headers.append('Access-Control-Allow-Credentials', true);
            headers.append('Authorization', 'Basic ' + btoa(SA_LOGIN + ":" + SA_PASSWORD));

            try {
                // GET request
                const response = await fetch(url, { method: 'GET', headers: headers, mode: 'no-cors' });
                if (response.ok) {
                    const data = await response.json();
                    this.listApp = data;
                    this.listApp.forEach(app => {
                        if (app.status === "DISCONNECTED") {
                            this.listDecApp.push(app);
                        }
                    });
                    this.nbr = this.listDecApp.length;
                } else {
                    if (response.status === 400) this.errors = ['Invalid app_permissions value'];
                    if (response.status === 401) this.errors = ['Acces denied'];
                }
            } catch (error) {
                console.log(error);
                this.errors = ["Une erreur est survenue lors de la récupération des informations sur le serveur."]
            }
}

On Firefox and chrome and I don't have any cors plugin anywhere.

YOU are not allowed to set CORS headers on your client. It is the TARGET that sets those headers. These are not yours to set `headers.append('Access-Control-Allow-Origin', '*'); headers.append('Access-Control-Allow-Methods', 'GET'); headers.append('Access-Control-Allow-Credentials', true);` — mplungjan, Dec 08 '20 at 12:32
I'm sure the uri is valid. Normally it's supposed to return a 401 @VLAZ — Jo Le Belge, Dec 08 '20 at 12:35
@mplungjan ok I change it. But that's change anything if they are present, no ? — Jo Le Belge, Dec 08 '20 at 12:57
You will need to load the URL in the browser and see if it allows CORS. If not you are SOL. — mplungjan, Dec 08 '20 at 13:17
@mplungjan it's only my customer who can try in his browser because the remote server is private... Usually, he use Postman for doing his request and he can get the data — Jo Le Belge, Dec 08 '20 at 13:43
@mplungjan exactly... My custemr can send request with postman and he get the right data without problem. But with this function, that doesn't work... — Jo Le Belge, Dec 08 '20 at 13:47
If I understand correctly, it is the remote server that must be configured to accept browser requests ? — Jo Le Belge, Dec 08 '20 at 13:58
So the answer: You canot use a browser to access that server since they are not setting the access control — mplungjan, Dec 08 '20 at 14:08

Errors when using fetch() in vanillajs, why?

0 Answers0