Question

我是网络开发的新手，请原谅我，如果以下内容可能不清楚...如果需要澄清，请告诉我...我也是stackoverflow的新手，所以尽量放轻松我： P

我的问题是，如何使用节点的“方法覆盖”包与ajax？我需要覆盖POST方法并将其设置为PUT方法...用于学校作业的用户注册和登录表单... 文档不是很有用，因为它没有显示如何使用ajax方法覆盖的示例... 此外，可能不重要...但我使用非关系数据库来存储用户信息（mongodb）...我也使用节点的“cookie-session”包，但出于这个问题的目的，我将省略cookie会话的内容......

到目前为止，在我的用户路线中，我有：

const express = require('express');
const userRoutes = express.Router();
const bodyParser = require('body-parser');
const methodOverride = require('method-override');

userRoutes.use(methodOverride('_method'));

userRoutes.put('/', (req, res) => {
  // ... user registration logic here
})

userRoutes.post('/', (req, res) => {
  // ... user login logic here
})

对于我的客户端，我有：

$(() => {
  let $registrationInfo = $('.registration form');
  let $loginInfo = $('.login form');

  $.ajax({
      method: POST,
      url: '/users',
      data: $registrationInfo.serialize();
      -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --HELP!!!
    })
    .then((new_user) => {
      // ... client side user registration logic here
      console.log('new user created');
    })

  $.ajax({
      method: POST,
      url: '/users',
      data: $loginInfo.serialize();
    })
    .then((user_login) => {
      // ... client side user login logic here
      console.log('user has logged in');
    })
})

对于我的HTML，我有：

<div class="registration">
  <form method="POST" action="/users/">
    <ol>
      <li>
        <label for="username">Username:</label>
        <input type="text" name="username" />
      </li>

      <li>
        <label for="password">Password:</label>
        <input type="password" name="password" />
      </li>

      <li>
        <label for="confirm-password">Confirm Password:</label>
        <input type="password" name="confirm-password" />
      </li>

      <li>
        <input type="submit" class="register" name="register" value="Register" />
      </li>
    </ol>
  </form>
</div>

<div class="login">
  <form method="POST" action="/users/">
    <ol>
      <li>
        <label for="username">Username:</label>
        <input type="text" name="username" />
      </li>

      <li>
        <label for="password">Password:</label>
        <input type="password" name="password" />
      </li>

      <li>
        <input type="submit" class="login" name="login" value="Login" />
      </li>
    </ol>
  </form>
</div>

不确定如何实施“_method”......请帮忙！

感谢ADV。！

编辑：P.S。我们需要在这个项目中使用上面的中间件，并且应该使用尽可能少的html ...

Answer 1

如方法覆盖包documentation

中所述

要使用查询字符串值覆盖方法，请指定查询 string key作为methodOverride函数的字符串参数。至然后拨打电话，发送POST请求到覆盖的URL method作为查询字符串键的值。这种使用方法查询值通常与纯HTML一起使用尝试支持旧版浏览器但仍然使用时的元素更新的方法。

您已将查询字符串指定为_method，因此如果要将http方法覆盖为PUT，请包含查询sting _method=PUT。

<form method="POST" action="/users?_method=PUT">
 ...
</form>

要解析服务器端的表单，您应该在用户路由上使用正文解析器。

userRoutes.use(bodyParser.urlencoded({ extended: false }));

如何使用node的方法覆盖包和ajax来覆盖要放置的方法？

1 个答案: