web-dev-qa-db-fra.com

Angular2 http.post est exécuté deux fois

Je suis tombé sur un problème étrange dans lequel le service HTTP de Angular2 (RC1) exécute l'appel http.post à deux reprises. J'ai débogué mon application et je sais pertinemment qu'il ne s'agit pas d'un problème lié aux événements liés aux clics. Tous les appels menant à l'appel de service principal

public create(json: Object, params?: Object): Observable<T> {
    let body = JSON.stringify([json]);
    let headers = this.getHeaders();
    let options = new RequestOptions({ headers: headers });

    return this._http.post(this.createURL(this.getCreateURL(), [], params), body, options)
    .map(res => this.handleObjectResponse(res));
}

sont exécutés une fois. Puis, lorsque j'ai commencé à rechercher le problème, j'ai découvert que mon gestionnaire this.handleObjectResponse était exécuté deux fois. J'ai donc approfondi et atteint @angular/http/src/backends/xhr_backend.ts où ils le font

constructor(req: Request, browserXHR: BrowserXhr, baseResponseOptions?: ResponseOptions) {
    this.request = req;
    this.response = new Observable<Response>((responseObserver: Observer<Response>) => {
        let _xhr: XMLHttpRequest = browserXHR.build();
        _xhr.open(RequestMethod[req.method].toUpperCase(), req.url);
        // load event handler
        ...
        ..

Donc, j'ai mis un point d'arrêt sur this.request = req;, puis un autre point d'arrêt sur let _xhr: XMLHttpRequest = browserXHR.build(); et j'ai découvert que je touchais le premier point d'arrêt une fois, mais ensuite, je frappais deux fois le deuxième point d'arrêt à partir du rappel.

Cela me rend fou alors je voulais vérifier si quelqu'un connaissant les composants internes d'angular2 pourrait nous éclairer pour savoir si cela ressemble à un bug ou à quelque chose que je n'ai pas bien fait.

Dans mon code, j'ai créé des classes de service génériques abstraites: GenericService et FullService, qui étend GenericService. Les deux sont des génériques et utilisent des génériques et les vraies classes de services injectées dans les différents composants s’étendent soit à GenericService, soit à FullService. Pensez-vous que cette configuration pourrait éventuellement être responsable des doubles exécutions?

Toutes les idées sont appréciées!

Merci d'avance!

P.S.

Cela ne se produit pas avec gets mais cela arrive aussi avec put.

angularhttppost
32
RVP

Le service http renvoie un observable à froid qui obtient exécuté sur chaque abonnement , vous voulez le convertir en un observable à chaud qui ne sera exécuté que sur le premier abonnement et partagera la même valeur pour les abonnements suivants.

Pour convertir tout ce que vous avez à faire est share it:

return this._http.post(this.createURL(this.getCreateURL(), [], params), body, options)
.map(res => this.handleObjectResponse(res))
.share();
63
teleaziz
its happening because HTTP OPTIONS executed first, and you have to restrict unwanted HTTP method before executing your Logic, always use isset method,see example below

 if(isset($_POST))
 {
    $name = $_POST["name"];
    $country = $_POST["country"];

    $sql = 'INSERT INTO user values("' . $name . '","' . $country . '")';

            if ( $conn->query($sql)=== TRUE) 
            {
                $outp =  "Inserted " .  $name . "  and  "  . $country;
                echo json_encode($outp);
            } else {
                echo json_encode("Error: " . $sql . "<br>" . $conn->error);
            }
        }


here it will insert row in table only when its POST METHOD.
0
Jayesh L

Cela m’arrivait car j’avais (key.enter)="someSubmitFunction()" dans l’un des champs de saisie d’un formulaire. Lorsque je tape sur ce champ, le formulaire est envoyé deux fois. Apparemment, ce n'était pas nécessaire. Lorsque je retirais cela, le formulaire était toujours envoyé lorsque je cliquais sur entrer, mais maintenant une seule fois.

0
mad_fox