Express сервер не отправляет ответ клиенту (используя fetch) - PullRequest
Новая
       36

Express сервер не отправляет ответ клиенту (используя fetch)

0 голосов
/ 25 апреля 2020

Я использую express для своей серверной стороны и отправляю запрос на сервер от клиента, используя fetch.

Данные, которые я публикую на сервер отправляется и отображается. Данные из ответа сервера нигде не видны на клиенте.

Вот мой код на стороне сервера: 

app.post('/info',
ensureAuthenticated, function(req,res){
   console.log(req.body)
   var tryFetch = {myString: 'I am working fetch'};

   res.setHeader('Content-Type', 'application/json');
   res.end(JSON.stringify(tryFetch));
})

Сторона клиента выглядит следующим образом: 

fetch("/info", {
    method: "post",
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
    },

    body: JSON.stringify({
        name : e.target.parentElement.username,
        socketID : e.target.parentElement.socketID,
        id : e.target.parentElement.id,
    })
})
.then( (response) => { 
    console.log(response)
});

Когда я console.log() отвечает, консоль отображает: 

Response {type: "basic", url: "http://localhost:4000/info", redirected: false, status: 200, ok: true, …}

type: "basic"
url: "http://localhost:4000/info"
redirected: false
status: 200
ok: truestatusText: "OK"
headers: Headers
__proto__: Headersbody: (...)
bodyUsed: false
__proto__: Response

Я не знаю, чего мне здесь не хватает, и не могу отправить данные с сервера клиенту. Может ли кто-нибудь помочь мне с этим, пожалуйста? Это будет высоко ценится. Спасибо за ваше время

Ответы [ 2 ]

0 голосов
/ 25 апреля 2020

Итак, я наконец выяснил, что не так с этим делом.

Проблема не в сервере, а в клиенте и обещании получения. На самом деле, то, что заставило меня думать, что проблема была при получении, было, когда я console.log(res.body) и получил 

ReadableStream {locked: false}
locked: false
__proto__: ReadableStream

Вот то, что работало для меня. Я заменил 

.then( (response) => { 
    console.log(response)
});

на 

.then(response => response.json())
                .then((body) => {
                     console.log(body);
                });

Итак, в заключение выборка должна выглядеть следующим образом: 

fetch("/info", {
    method: "post",
    headers: {
        'Content-Type': 'application/json',
        'Accept': 'application/json'
    },

    //make sure to serialize your JSON body
    body: JSON.stringify({
        name : e.target.parentElement.username,
        socketID : e.target.parentElement.socketID,
        id : e.target.parentElement.id,
    })
})
.then(response => response.json())
.then((body) => {
        console.log(body);
});

Теперь ответ от сервера отображается, когда я console.log()

0 голосов
/ 25 апреля 2020

Предполагается, что res.send или res.json не res.end.

res.end() используется для быстрого завершения ответа без каких-либо данных. 

app.post('/info',
ensureAuthenticated, function(req,res){
   console.log(req.body)
   var tryFetch = {myString: 'I am working fetch'};

   res.setHeader('Content-Type', 'application/json');
   res.send(JSON.stringify(tryFetch));
})

ОБНОВЛЕНИЕ

Для возврата json

app.post('/info',
ensureAuthenticated, function(req,res){
   console.log(req.body)
   var tryFetch = {myString: 'I am working fetch'};
   res.json(tryFetch);
})
...