Angular 4 - Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience

user_4780298 0
Viewed 2505

I am getting warning in console like below. And this warning coming from zone.js

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

I was using Angular 2 and now I updated to Angular 4. I am also using kendo UI Angular controls. I want to know is this because of angular version update or because of my service implementation. below is service code snippet.

post(url: any, data: any) {


    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });

    try {

        return this.http.post((new RequestOptions({ headers: headers }))).do(data => {

            if (data != null && data.statusText != "No Content") {
                console.log("Response Data - ", data.json());

            }

        });
    }
    catch (e) {
        console.log(e);
        return null;
    }
}

I know this is caused by trying to do a synchronous AJAX call from the browser. but don't know how to fix it in angular 4.

angular2-services angular
1 Answers

I got this error (Synchronous XMLHttpRequest on the main thread is deprecated...) on my Angular 5 application due to my stupidity to try and serve the app from the source code folder instead of the dist folder. I make use of koa 2 on nodejs as a web server and my angular app source code is located in a folder called public, so I had (in index.js - the file run by nodejs): 

app.use(serve(__dirname + '/public'));

instead of: 

app.use(serve(__dirname + '/public/dist'));

Before starting the server I run ng build from the /public folder, which builds the Angular app in /public/dist. Point is that the cause of the error and the error message were totally unrelated.

user_49338280
Related