你能发送一个状态码和一个html网页吗？

Question

我在节点中使用 express 框架，我不知道什么是最佳实践，或者这是否是错误的做法，但我想发送一个状态码，例如res.status(200).send("Success");表单输入是否与服务器匹配，如果它不匹配然后发送类似res.status(403).send("Forbidden"); Then 在网页中的内容，我可以使用发送的响应更新段落元素。所以用户知道它是否成功。这可能吗？如果是我该怎么做？还有更好的方法吗？

Answer 1

肯定有可能！

取自 express api 参考：

res.status(code)

设置响应的 HTTP 状态。它是 Node 的 response.statusCode 的可链接别名。

    res.status(403).end()

    res.status(400).send('Bad Request')

    res.status(404).sendFile('/absolute/path/to/404.png')

通常发送状态代码是要走的路。如果您发送的数据没有状态码，express 会自动添加 200 状态码，您无需手动添加。

在客户端，您必须在请求的响应对象中检查非 2xx 状态代码。这是一个使用 fetch api 的示例。

    fetch('/your/api')

      .then((response) => {

        if (!response.ok) { // Check for a non 2xx status code

          throw new Error('Network response was not ok');

        }

        // Do something with the response data

      })

      .catch((error) => {

        // This is only reached when a network error is encountered or CORS is misconfigured on the server-side

        console.error('There has been a problem with your fetch operation:', error);

      });

示例：凭据用例

如果您想编写一个网页，该网页具有输入用户凭据以访问更多内容的表单，我建议您按照以下方式进行操作：

客户端：

    // Function is listening to the submit event of your login form

    function submitLoginForm() {

      let username = document.getElementById("username").value;

      let password = document.getElementById("password").value;

      const options = {

        method: 'POST',

        body: JSON.stringify({ username, password }),

        headers: {

          'Content-Type': 'application/json'

        }

      };

      return fetch('/api/login', options)

        .then((response) => {

          // Check for a non 2xx status code

          if (!response.ok) {

            // Show a failed login hint

            showMessageBox('Login was not granted by the server. Please check you user name or password and try again.', 'error');

          }

          // Your login was successfull, manually redirect to user's dashboard, or whatever content...

        })

        .catch((error) => {

          // This is only reached when a network error is encountered or CORS is misconfigured on the server-side

          console.error('There has been a problem with your fetch operation:', error);

        });

    }

服务器端：

    app.post('/api/login', (req, res, next) => {

      let username = req.body.username;

      let password = req.body.password;

      checkCredentials(username, password, (err) => {

        if (err) {

          return res.status(400).send('Wrong user name or password.');

        }

        // Consider adding a token or a cookie to the response object, so that the user keeps logged in.

        return res.send('Access granted.');

      });

    });