首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >404运行节点服务器时

404运行节点服务器时
EN

Stack Overflow用户
提问于 2019-11-21 19:11:12
回答 2查看 93关注 0票数 0

Hi学习使用node和其他后端组件,并在运行简单的输入表单时遇到这个404:

代码语言:javascript
运行
复制
Not Found
404

NotFoundError: Not Found
    at /Users/samgniel/Desktop/saas-tutorial/app.js:25:8
    at Layer.handle [as handle_request] (/Users/samgniel/Desktop/saas- 
tutorial/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/samgniel/Desktop/saas- 
tutorial/node_modules/express/lib/router/index.js:317:13)
    at /Users/samgniel/Desktop/saas-tutorial/node_modules/express/lib/router/index.js:284:7
    at Function.process_params (/Users/samgniel/Desktop/saas- 
tutorial/node_modules/express/lib/router/index.js:335:12)
    at next (/Users/samgniel/Desktop/saas- 
tutorial/node_modules/express/lib/router/index.js:275:10)
    at SendStream.error (/Users/samgniel/Desktop/saas-tutorial/node_modules/serve- 
static/index.js:121:7)
    at SendStream.emit (events.js:210:5)
    at SendStream.error (/Users/samgniel/Desktop/saas- 
tutorial/node_modules/send/index.js:270:17)
    at SendStream.onStatError (/Users/samgniel/Desktop/saas- 
tutorial/node_modules/send/index.js:421:12)

输入表单的代码为:

代码语言:javascript
运行
复制
<form action="/signup" method="post">
  <input required type="email" name="email" id="emailForm" placeholder="Your Email">
  <input type="password" name="password" id="passwordForm" placeholder="Password">
  <input type="submit" name="" id="" value="Signup!">
</form>

.js调用函数为:

代码语言:javascript
运行
复制
app.post('/signup', function(req, res, next) {
console.log(req.body);
});

如能帮助解决此错误,我们将不胜感激:)

EN

回答 2

Stack Overflow用户

发布于 2019-11-21 19:23:12

您似乎没有向客户端返回任何响应。纠正这种情况的一种方法是在express提供的res对象中使用send函数。

代码语言:javascript
运行
复制
app.post('/signup', function(req, res, next) {
    console.log(req.body);
    res.send('Hello World') // this can also take an object as response. res.send({ msg: 'hello world' })
});

这也可能有助于改进这一行ok comment out this line app.use(function(req, res, next) { next(createError(404)); });

希望这能有所帮助。

票数 0
EN

Stack Overflow用户

发布于 2019-11-21 19:59:52

抱歉让您久等了..。我试着把它放在codesandbox上...

你可以像这样制作你的Node侧

代码语言:javascript
运行
复制
const express = require("express");
const bodyParser = require("body-parser");
const cors = require("cors");
const path = require("path");

const app = express();
const router = express.Router();
const PORT = process.env.PORT || 5000;

app.use(cors());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

router.get("/", function(req, res) {
  res.sendFile(path.join(__dirname + "/index.html"));
});

router.post("/signup", (req, res) => {
  console.log(req.body);
});

app.use(router);

app.listen(PORT, () => {
  console.log(`Server started at PORT:${PORT}`);
});

并创建一个HTML文件,您将在其中使用fetch API使用API

像这样的东西

代码语言:javascript
运行
复制
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
  </head>
  <body>
    <form action="/signup" method="post">
      <input
        required
        type="email"
        name="email"
        id="emailForm"
        placeholder="Your Email"
      />
      <input
        type="password"
        name="password"
        id="passwordForm"
        placeholder="Password"
      />
      <input type="submit" name="" id="submit" value="Signup!" />
    </form>

    <script>
      const emailForm = document.querySelector('#emailForm');
      const passwordForm = document.querySelector('#passwordForm');
      const submit = document.querySelector('#submit');

      const submitFetch = (url, data) => {
        fetch(url, {
          method: 'POST',
          mode: 'cors',
          cache: 'no-cache',
          credentials: 'same-origin',
          headers: {
            'Content-Type': 'application/json'
          },
          redirect: 'follow',
          referrer: 'no-referrer',
          body: JSON.stringify(data)
        }).then(response => response.json());
      };

      submit.addEventListener('click', e => {
        e.preventDefault();
        const data = {
          email: emailForm.value,
          password: emailForm.value
        };
        submitFetch('http://localhost:5000/signup', data);
      });
    </script>
  </body>
</html>

如果你想看现场直播...我把它放在codesandbox上

https://codesandbox.io/s/lucid-cannon-x1wu1

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58973588

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档