Question

我正在运行一个发送 ajax-start.html 文件的节点/快递服务器。 ajax-start.html 文件中包含一个向服务器发出ajax 请求的脚本。一切正常。但是，当服务器收到 ajax 请求时，我希望能够在发送之前修改文本文件。（我对此很陌生，并尝试修改 MDN 中的示例以满足我的需要。）

HTML (ajax-start.html)：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Ajax starting point</title>

    <style>
      html,
      pre {
        font-family: sans-serif;
      }

      body {
        width: 500px;
        margin: 0 auto;
        background-color: #ccc;
      }

      pre {
        line-height: 1.5;
        letter-spacing: 0.05rem;
        padding: 1rem;
        background-color: white;
      }

      label {
        width: 200px;
        margin-right: 33px;
      }

      select {
        width: 350px;
        padding: 5px;
      }
    </style>
    <!--[if lt IE 9]>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <![endif]-->
  </head>

  <body>
    <h1>Ajax starting point</h1>

    <form>
      <label for="verse-choose">Choose a verse</label>
      <select id="verse-choose" name="verse-choose">
        <option>Verse 1</option>
        <option>Verse 2</option>
        <option>Verse 3</option>
        <option>Verse 4</option>
      </select>
    </form>

    <h2>The Conqueror Worm, <em>Edgar Allen Poe, 1843</em></h2>

    <pre></pre>

    <script>
      const verseChoose = document.querySelector("select");
      const poemDisplay = document.querySelector("pre");

      verseChoose.onchange = function () {
        const verse = verseChoose.value;
        updateDisplay(verse);
      };

      function updateDisplay(verse) {
        verse = verse.replace(" ", "");
        verse = verse.toLowerCase();
        let fname = verse + ".txt";
        let url = `textFiles/${fname}`;

        let request = new XMLHttpRequest();
        request.open("GET", url);
        request.responseType = "text";

        request.onload = function () {
          poemDisplay.textContent = request.response;
        };
        request.send();
      }
    </script>
  </body>
</html>

节点/express(app.js)

const express = require("express");
const fs = require("fs");
const app = express();
app.use(express.static(`assets`));

app.get("/", (req, res) => {
  res.sendFile(__dirname + "/ajax-start.html");
});

app.listen(5000, () => {
  console.log(`listening`);
});

Answer 1

无法检测 Ajax 请求本身，但 HTTP 有许多选项可以提供不同版本的内容。

如果您想以不同的格式提供相同的数据（例如 HTML 用于直接请求，JSON 用于 Ajax 请求是很常见的），那么您可以使用 Accept header（与您的服务器-side 代码默认为 HTML，除非 Accept 标头（可通过 req.headers 获得）表达对 JSON 的偏好。

如果您想提供略有不同的内容，则可以在网址上使用查询字符串 (req.query)。

明显不同的内容通常最好使用完全不同的端点。

您还可以使用非标准的 X-Requested-With，但您可以添加它（如 Accept 标头）和 setRequestHeader，因为这是用于表达“这是阿贾克斯”。不过它确实避免了标准方法，所以我不推荐它。

有没有办法告诉我何时收到 node/express 的 ajax 请求？

1 个答案: