是否可以在 express POST / GET 处理程序中使用 jQuery？答案

【问题标题】：Is it possible to use jQuery inside express POST / GET handlers?是否可以在 express POST / GET 处理程序中使用 jQuery？
【发布时间】：2023-01-24 22:10:22
【问题描述】：

我编写了这个小型 Express 服务器以从 HTML 表单获取数据并使用该数据查询 OpenWeatherMap：

const { OpenWeatherAPI } = require("openweather-api-node");
const express = require("express");
const bodyParser = require("body-parser");
const path = require("path");
const app = express();
const PORT = process.env.port || 3000;

app.use(bodyParser.urlencoded({ extended: true }));
app.listen(PORT, () => console.log(`Server listening on port ${PORT}.`));

app.get("/", (req, res) => {
  res.sendFile(path.join(__dirname, "/public/views/index.html"));
});

app.post("/weather/public", (req, res) => {
  let city = Number(req.body.city);
  let units = (req.body.units || "").trim().toUpperCase();
  if (!["IMPERIAL, METRIC, STANDARD"].includes(units)) {
    $("h1").innerText =
      "Please input Imperial, Metric or Standard for the units.";
    return;
  }

  let weather = new OpenWeatherAPI({
    key: MY_OPENWEATHERMAP_API_KEY,
    locationName: city,
    units: units,
  });
  weather.getCurrent().then((data) => {
    res.send(
      `<p>Current temperature in ${city} is: ${data.weather.temp.cur}</p>`
    );
  });
});

HTML 本身非常简单：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Weather query</title>
  </head>
  <body>
    <h1>Input a city and your units!</h1>
    <form action="/weather/public" method="post">
      <input name="city" placeholder="Your city here" type="text" />
      <input
        name="units"
        placeholder="Units of Measurement (imperial, metric, standard)"
        type="text"
      />
      <button name="submit" type="submit">Calculate!</button>
    </form>
  </body>
  <script
    crossorigin="anonymous"
    integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ="
    src="https://code.jquery.com/jquery-3.6.1.min.js"
  ></script>
  <script charset="utf-8" src="../../app.js"></script>
</html>

当运行服务器并在表单中输入一些项目时，我得到：

ReferenceError: $ is not defined
    at C:\Users\jason\code\Web-Development\weather\app.js:19:5
    at Layer.handle [as handle_request] (C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\route.js:144:13)
    at Route.dispatch (C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\route.js:114:3)
    at Layer.handle [as handle_request] (C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\layer.js:95:5)
    at C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\index.js:284:15
    at Function.process_params (C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\index.js:346:12)
    at next (C:\Users\jason\code\Web-Development\weather\node_modules\express\lib\router\index.js:280:10)
    at C:\Users\jason\code\Web-Development\weather\node_modules\body-parser\lib\read.js:137:5
    at AsyncResource.runInAsyncScope (node:async_hooks:204:9)

第 19 行是 .js 文件中唯一使用 jquery 的位置：

$("h1").innerText = "Please input Imperial, Metric or Standard for the units.";

我将 jquery 的 <script> 标记的位置更改为 <head> 块内，但这没有帮助。我想知道我是否有可能在 Express 的处理程序中使用 jquery，或者这是否不可能，我应该发送一个错误的 HTML 文件作为响应。

【问题讨论】：

你试图做的事情没有意义。您的 Express 代码在您的 Node 中运行服务器;没有要操作的 DOM。
这与我的想法一致。谢谢@Pointy！

标签： javascript jquery node.js express openweathermap

【解决方案1】：

在评论中由Pointy回复；实际上，我不能混淆从服务器端 Express 代码对客户端 jquery 的调用。

【讨论】：

仅供参考，除非您打算提醒他们，否则不要在用户名上使用 @ 运算符。这不是他们名字的一部分。