如何修复 404 错误 Node JS Express POST 请求

Question

我正在尝试将以下 html 表单提交到 js 文件：

                        <form action="/submit-form" method="POST">


                             <input type="text" name="username">

                             <button> Click Here Now </button>


                        </form>

这是我要提交到的文件。我试过移动文件夹，更改端口，但似乎没有任何效果。

          var express = require('express');

          var app = express();
          
          app.listen(80, function(){ 

           console.log("Hello whatsup");

         })
         app.post('/submit-form', function(req,response){

              console.log("All great");
    
          })

这两个文件都在我的 Xampp htdocs 文件夹中，特别是位于包含为这个特定项目制作的文件夹中。它包含 package.json 文件、node_modules 文件夹、js 文件和 html 表单。

Answer 1

如果您只是在本地运行表单而没有任何托管/渲染，那么您需要指定它的 url 以了解如何访问您的本地服务器。

示例 1：

使用您的代码示例，但稍作修改以使用非相对路径

假设您在您的机器中创建了一个文件index.html，并根据上面的示例使用以下内容通过浏览器打开它

<form action="http://localhost:8080/submit-form" method="POST">
  <input type="text" name="username">
  <button> Click Here Now </button>
</form>

以上假设您的服务器设置如下，端口为 8080。我所做的只是修改代码中的端口

假设您有一个以 node server.js 开头的 server.js 文件。注意：这假设您的 node_modules 中已经有 express

      var express = require('express');

      var app = express();
      
      app.listen(8080, function(){ 

       console.log("Hello whatsup");

      })
      app.post('/submit-form', function(req,response){
          console.log("All great");

      })

示例 2：

使用您的代码示例解释相对路径

如果您将服务器和客户端都托管在同一台服务器上，那么用于 index.html 的 url 与用于服务器的 url 相同。然后你可以使用你拥有的相对路径

<form action="/submit-form" method="POST">
  <input type="text" name="username">
  <button> Click Here Now </button>
</form>

因为这将寻找您正在渲染的域。假设您正在渲染并最终得到一个域 http://awesomeurl.com，然后当您的表单点击 /submit-form 时，它将使用 POST 请求调用 http://awesomeurl.com/submit-form。如果您的服务器也托管并使用相同的 url 公开，那么一切正常。