web-dev-qa-db-fra.com

XMLHttpRequest lançant InvalidSateError disant "l'état de l'objet doit être ouvert"

Le code -

"use strict";

var AJAX = function (params) {
    this.server ={};
    this.url = params.url;
    this.method = params.method;
    this.dataType = params.dataType;
    this.formData = params.formData;

    this.init = function(){
        if(typeof XMLHttpRequest != 'undefined'){
            this.server = new XMLHttpRequest();
            this.server.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
            this.server.setRequestHeader('Content-length', this.formData.length);
            this.server.setRequestHeader('Connection', 'close');
            console.log("XMLHttpRequest created.");
            return true;
        }
    };

    this.send = function(){
        if(this.init()){
            this.server.open(this.method, this.url, true);
            this.server.send(this.formData);
        }
    };

};

Il lance l'erreur suivante:

Error in event handler for contextMenus: InvalidStateError: Failed to execute 'setRequestHeader' on 'XMLHttpRequest': The object's state must be OPENED.

Comment il est utilisé -

var data = new FormData();

data.append('user', 'sachin');
var params = {
    url : 'example.com',
    method : 'post',
    dataType: 'json',
    formData : data
};

var backgroundWindow = chrome.extension.getBackgroundPage();

var ajax = new backgroundWindow.AJAX(params);

ajax.send();

Je n'arrive pas à comprendre quelle est la raison derrière.

javascriptajaxxmlhttprequest
18
SachinGutte

L'erreur est simple:

Erreur dans le gestionnaire d'événements pour contextMenus: InvalidStateError: échec de l'exécution de 'setRequestHeader' sur 'XMLHttpRequest': l'état de l'objet doit être OUVERT.

Vous devez appeler .open(..) avant de définir les en-têtes de demande.

Compte tenu de votre code, je pense que la meilleure façon serait de déplacer l'appel pour l'ouvrir dans la fonction init(..).

var AJAX = function (params) {
    this.server ={};
    this.url = params.url;
    this.method = params.method;
    this.dataType = params.dataType;
    this.formData = params.formData;

    this.init = function(){
        if(typeof XMLHttpRequest != 'undefined'){
            this.server = new XMLHttpRequest();

            //Open first, before setting the request headers.
            this.server.open(this.method, this.url, true);

            //Now set the request headers.
            this.server.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
            //this.server.setRequestHeader('Content-length', this.formData.length);
            //this.server.setRequestHeader('Connection', 'close');
            console.log("XMLHttpRequest created.");
            return true;
        }
    };

    this.send = function(){
        if(this.init()){
            this.server.send(this.formData);
        }
    };

};
40
UltraInstinct

Vous devrez probablement ouvrir la connexion après l'appel XMLHttpRequest et avant l'appel setRequestHeader Au lieu de:

        this.server = new XMLHttpRequest();
        this.server.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

je pense que vous devez faire:

        this.server = new XMLHttpRequest();
        this.server.open(this.method, this.url, true);
        this.server.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

assurez-vous également de supprimer cette ligne dans la init(), comme vous l'avez fait ci-dessus.

3
Ganesh Kamath - 'Code Frenzy'