Javascript holen: nicht POST-Antwortdaten von Perl-Skript erhalten

Question

Ich versuche, eine Antwortdaten von einem Perl-CGI-Skript zurück zu bekommen:

Ich habe den folgenden JavaScript-Code:

fetch('/test.pl', { 
     method: 'POST', 
     headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json' 
     }, 
     body: JSON.stringify({ 
     name: this.state.msgName, 
     email: this.state.msgEmail 
     }) 
    }) 
    .then((response) => { 
     console.log("been here"); 
     console.log(response); 
    }) 
    .then((responseData) => { 
     console.log("been here 2"); 
     console.log(responseData); 
    }) 
    .then((data) => { 
     console.log("been here 3"); 
     console.log(data); 
    }) 
    .catch((error) => { 
     console.log("Failed!", error) 
    }); 

und der perl-Skript:

#/usr/bin/env perl 
use strict; 
use CGI; 
use JSON; 

my $q = new CGI; 
my $json = new JSON; 

if ($q->param) 
{ 
    print $q->header(); 
    my $hash = $json->decode($q->param('POSTDATA')); 
    print $q->header('application/json'); 
    my $msg = [ sprintf "data from %s received ok", $hash->{name} ]; 
    print $json->encode($msg); 
} 

aber ich bin nur das bekommen (ich verwende Chrome Web Developer tools) und keine Daten:

been here 
Response {type: "basic", url: "http://localhost/test.pl", status: 200, ok: true, statusText: "OK"…} 
been here 2 
undefined 
been here 3 
undefined 

Ich bin sicher, dass der Perl-Skript funktioniert ok, hier ist die Ausgabe, die es von der Kommandozeile zu testen:

# curl -H "Accept: application/json" -H "Content-Type: application/json" -X POST -d '{"name":"uvw","email":"xyz"}' http://localhost/test.pl 
Content-Type: application/json; charset=ISO-8859-1 

["data from uvw received ok"]% 

Wer weiß, wie die Daten Antwort zurück an dem js Skript zu bekommen? Vielen Dank im Voraus für jede Hilfe!

Answer 1

Ich habe das endlich gelöst, ich poste meine Lösung hier, da sie für andere Leute mit einem ähnlichen Problem relevant sein könnte.

Das Problem war eine doppelte:

1. Ich war Drucken eines zusätzlichen HTML-Header aus dem Perl-Skript, das die JSON-Daten machen falsch
2. Ich habe response.json nicht verwendet() innerhalb der Prämisse zu erhalten die JSON-Daten

Hier ist der feste Code:

JavaScript-Code:

fetch('/test.pl', { 
     method: 'POST', 
     headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json' 
     }, 
     body: JSON.stringify({ 
     name: this.state.msgName, 
     email: this.state.msgEmail 
     }) 
    }) 
    .then((response) => { 
     response.json().then((data) => { 
      console.log(data); 
     }); 

     return(response); 
     } 
    }) 

Perl-Code: Wenn ich

#/usr/bin/env perl 
use strict; 
use CGI; 
use JSON; 

my $q = new CGI; 
my $json = new JSON; 

if ($q->param) 
{ 
    print $q->header(); 
    my $hash = $json->decode($q->param('POSTDATA')); 
    # NEXT LINE REMOVED, IT WAS WRONG!! 
    #print $q->header('application/json'); 
    my $msg = [ sprintf "data from %s received ok", $hash->{name} ]; 
    print $json->encode($msg); 
} 

Answer 2

Sie geben die Daten nicht in der Rückrufkette weiter. Sie müssen return etwas von der then() Handler, wenn Sie es in der folgenden then() erwarten.

function promiseOne() { 
    return Promise.resolve(1) 
}  

promiseOne() 
    .then(one => { console.log(one) }) # 1 
    .then(one => { console.log(one) }) # undefined 

promiseOne() 
    .then(one => { console.log(one); return one }) # 1 
    .then(one => { console.log(one) })    # 1 

Da die ersten then() Handler keine return Anweisung haben, gibt sie implizit undefined, und das ist, was Sie in den nächsten Handler zu sehen.

Wenn Sie keine zusätzlichen asynchronen Arbeiten ausführen, müssen Sie normalerweise then() nicht mehrmals aufrufen.