узел всегда "" ожидает локального хоста "в браузере - PullRequest
Новая
       8

узел всегда "" ожидает локального хоста "в браузере

1 голос
/ 02 ноября 2019

У меня есть простое приложение RESTAPI crud, где сообщения и комментарии должны отправляться на маршруты nodeJS. Все работает как надо, только то, что в браузере написано: «В ожидании локального хоста» навсегда, когда я нажимаю одну из кнопок формы. Может ли это быть из-за распространения событий в html / ejs? Заранее спасибо!

app.js: 

var methodOverride = require("method-override");
var express = require("express");
var express = require("express");
var bodyParser = require("body-parser");
var app = express();

app.use(methodOverride("_method"));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

let myDB = [{ post: "hello", comment: "hello1" }];

//Read
app.get("/", function(req, res) {
  res.render("index.ejs", { posts: myDB });
});

//Create
app.post("/addPost", function(req, res) {
  let newComment = { post: req.body.createP, comment: req.body.createC };
  myDB.push(newComment);
});

//Update
app.put("/updatePost", function(req, res) {
  let index = Number(req.body.updateI) - 1;
  // res.send("you have reached the update route " + index);
  let updatedComment = { post: req.body.updateP, comment: req.body.updateC };

  myDB.splice(index, 0, updatedComment);
});

//Delete
app.delete("/deletePost", (req, res) => {
  //res.send("you have reached the delete route " + req.body.del);
  let index = Number(req.body.updateI) - 1;
  myDB.splice(index, 1);
});

app.listen(3000, function() {
  console.log("server is running");
});

index.ejs: 

<h1>Index page</h1>

<P>Read posts</P>
<% posts.forEach(function(post){ %>

<li><%=post.post %></li>
<li><%=post.comment %></li>

<%})%>

<P>Create post</P>

<form action="/addPost" method="POST">
  <input type="text" placeholder="post" name="createP" />
  <input type="text" placeholder="comment" name="createC" />
  <button>Create a new post</button>
</form>

<P>Update post</P>

<form action="/updatePost?_method=PUT" method="POST">
  <input type="text" placeholder="ID" name="updateI" />
  <input type="text" placeholder="post" name="updateP" />
  <input type="text" placeholder="comment" name="updateC" />
  <button>Create a new post</button>
</form>

<P>Delete post</P>

<form action="/deletePost?_method=DELETE" method="POST">
  <input type="text" placeholder="sequence number" name="delI" />
  <button>Delete a post</button>
</form>

<form action="http://localhost:3000/">
  <input type="submit" value="Refresh" />
</form>

1 Ответ

1 голос
/ 03 ноября 2019

Я думаю, что вы новичок в разработке API. Вы не отправляете ответ обратно в браузер после выполнения какой-либо операции с БД. Таким образом, браузер ожидает ответа до истечения времени ожидания запроса. после каждой отправки формы вы должны отправлять ответ примерно так: 

app.post("/addPost", function(req, res) {
  // application logic goes here
  // once done send response as below
  res.render("index.ejs", { posts: updatedPosts });
})

Кроме того, выучите запрос ajax против действия формы submit

...