3
votes

Chrome 'Cross-Origin Read Blocking (CORB) bloqué la réponse d'origine croisée' ionique

J'essaie d'authentifier l'utilisateur mais je ne parviens pas à appeler une API en raison de Blocage de lecture cross-origin (CORB) bloqué problème mon login.ts Le code est

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;
    }

this.auth.login function

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());
        }


0 commentaires

3 Réponses :


3
votes

Autoriser-Contrôle-Autoriser-Origine: Vous permet de demander n'importe quel site avec ajax à partir de n'importe quelle source. Ajoute à l'en-tête de la réponse "Allow-Control-Allow-Origin: *"

Ajoutez cette extension dans votre navigateur: Allow-Control-Allow-Origin


0 commentaires

0
votes

Vous pouvez faire plusieurs choses. La première consiste à ajouter une stratégie CORS à votre backend de connexion. Si vous utilisez Node pour le backend, il existe un package npm appelé cors qui fera l'affaire . Si ce n'est pas le cas, il devrait y avoir un moyen simple d'ajouter la stratégie dans la langue / structure que vous utilisez. Si vous vous authentifiez via un fournisseur de services comme Firebase ou Auth0 , vous pouvez ajouter votre URL ( localhost ou quoi que ce soit) à leurs paramètres et cela résoudra le problème.

L'autre chose que vous pouvez faire est d'ajouter une extension à votre navigateur afin qu'il envoie la demande de contrôle en amont cors pour vous. J'en ai un que j'utilise avec Chrome et il s'appelle simplement CORS . Cela fonctionne très bien, mais faites attention. Je ne l'utilise que lorsque je développe sur localhost, donc je l'ai configuré pour ajouter uniquement la demande de contrôle en amont lorsque l'URL est localhost, juste pour être sûr.

En fin de compte, il vous faut peut-être une combinaison de ces deux approches.


0 commentaires

1
votes

Vous devez ajouter un en-tête CORS dans votre réponse API.

Mon backend est en PHP, je viens donc d'ajouter ces chaînes:

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


0 commentaires