POST-запрос не работает - отправляются пустые объекты [NodeJS] - PullRequest
Новая
       64

POST-запрос не работает - отправляются пустые объекты [NodeJS]

0 голосов
/ 05 августа 2020

Я создаю этот школьный проект, в котором мы должны создать собственный API в NodeJs и интерфейс со свободным выбором. Я написал следующий код: [In publi c map] app. js

function getAll() {
    console.log("Get all")
    makeRequest("/poems", "GET")
} 

async function getRandomPoem() {
    const ids = [1, 2, 3, 4, 5, 6, 7]
    const randomId = ids[Math.floor(Math.random() * ids.length)]
    const arrayofPoems = await fetch("/poems/" + randomId, {method: "GET"})
    const data = await arrayofPoems.json()

    const titleBox = document.getElementById("title")
    const authorBox  = document.getElementById("author")
    const textBox = document.getElementById("text")

    titleBox.innerText = data.title
    authorBox.innerText = data.author
    textBox.innerText = data.text
}

function addPoem() {
    event.preventDefault();
    let title = document.getElementById("titleInput").value
    let author = document.getElementById("authorInput").value
    let text = document.getElementById("textInput").value

    let newPoem = [{
        id: 8,
        title: "Aaa",
        author: "Ccc",
        text: "Ddd"
    }]
    makeRequest("/poems/", "post", newPoem)
}


async function makeRequest(url, reqMethod, body) {
    
    const response = await fetch(url, {
      //  headers = { "Content-Type": "application/json" },
        method: reqMethod,
        body:JSON.stringify(body)
    })
    console.log(response)
    const data = await response.json()
    console.log(data)
}

[Здесь запросы к локальному серверу] server. js

const express = require('express');
const { poems } = require('./Poems/poemsArray');
const app = express();
const port = 8080;
const allPoems = require('./Poems/poemsArray')

app.use(express.json())
app.use("/", express.static('public'))


app.listen(port, console.log(`App listening on port ${port}`)) 


//  ----------------   POEMS RESOURCE, All endpoints ------------------ //

// Get all
app.get('/poems', (req, res, next) => {
   res.json(allPoems)
})

// Get specific
app.get('/poems/:id', (req, res, next) => {
   const id = req.params.id
   const onePoem = allPoems.find((poem) => poem.id == id)

   if(onePoem) {
       res.json(onePoem)
   } else {
       res.status(404).json({ status: "Poem not found! "})
   }
})

// Post a poem
app.post('/poems', (req, res, next) => {
   allPoems.push(req.body)
   res.json({ status: "A new poem has been posted!"})
})

[И, наконец, HTML с полями ввода, где значения должны быть отправлены с индексом POST req]. html

image

В функции addPoem () let newPoem предназначена для тестирования целей. Название, автор и текст должны быть взяты из формы. Кто-нибудь может увидеть, что я сделал не так?

EDIT: в функции makeRequest заголовок закомментирован, потому что, если я оставлю его в своем коде, внезапно ни один из запросов больше не будет работать?

Всем спасибо!

1 Ответ

0 голосов
/ 05 августа 2020

вы используете заголовки =, что недопустимо. попробуйте заголовки: {}. Когда вы получите пустой объект, попробуйте зарегистрировать запрос. Также возможно, что тело будет отправлено как строка, которая express. json () не может проанализировать данные. В результате вы получите пустой объект. 

async function makeRequest(url, reqMethod, body) {
    
    const response = await fetch(url, {
        headers : { "Content-Type": "application/json" },
        method: reqMethod,
        body:JSON.stringify(body)
    })
    console.log(response)
    const data = await response.json()
    console.log(data)
}
...