Chrome' Cross-Origin Read Blocking (CORB) bloc

问题:

i am trying to authenticate user but i am unable to call an Api due to the Cross-Origin Read Blocking (CORB) blocked issue my login.ts Code is

if (this.plugins.isOnline()) {
            if (this.wait == true) {
                return;
            } else if (this.userLogin.email == '' || this.userLogin.password == '') {
                this.utility.doToast("Please don't leave any field blank.");
                return;
            } else {
                this.wait = true;
                this.auth.login(this.userLogin).subscribe((success) => {
                    this.wait = false;
                    console.log(success.successData);
                    this.credential.setUser(success.successData);
                    this.plugins.sendTags(success.successData.id)
                    this.rememberUsertype(success.successData.is_celebrity);
                    if(success.successData.is_celebrity == '0'){
                    this.app.getRootNav().setRoot("HomePage");
                    }
                    else if(success.successData.is_celebrity == '1'){
                    this.app.getRootNav().setRoot("DashboardPage");
                     }

                    }, (error) => {
                        console.log(error);
                    this.wait = false;
                    if (this.utility.timeOutResponse(error))
                        this.utility.doToast("The email or password you entered is incorrect.")
                })
            }
        } else {
            this.utility.doToast(this.utility.internetConnectionMessage());
        }

this.auth.login function

login(params) {
        console.log(params);
        var url = this.constants.API_ENDPOINT + 'login';
        var response = this.http.post(url, params, {}).map(res => res.json());
        return response;
    }

回答1:

Allow-Control-Allow-Origin: Allows to you request any site with ajax from any source. Adds to response 'Allow-Control-Allow-Origin: *' header

Add this extension in your browser: Allow-Control-Allow-Origin

回答2:

You need to add some CORS header in your API response.

My backend is in PHP, so I just added this strings:

    header('Access-Control-Allow-Origin: *');
    header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE');
    header('Access-Control-Allow-Headers: Content-Type');

回答3:

You can do a couple of things. One is to add a CORS policy to your login backend. If you are using Node for the backend there is an npm package called cors that will do the trick. If not there should be an easy way to add the policy in the language/framework you are using. If you are authenticating via a service provider like Firebase or Auth0 you can add your URL (localhost or whatever it is) to their settings and that will solve it.

The other thing you can do is add an extension to your browser so that it sends the cors preflight request for you. I have one that I use with Chrome and it's just called CORS. It works great, but be careful with it. I only use it when I am developing on localhost so I configured it to only add the preflight request when the URL is localhost just to be safe.

Ultimately maybe what you need is a combination of both of these approaches.