单击html按钮时无法调用node.js？答案

【问题标题】：Unable to invoke node.js when html button is clicked?单击html按钮时无法调用node.js？
【发布时间】：2019-12-24 10:15:35
【问题描述】：

我创建了一个带有 2 个按钮的 html 页面。当我单击这些按钮时，我想调用一个 node.js 文件。当前，当我单击此按钮时，什么都没有发生。当我检查 chrome 中的页面时，它显示了

加载资源失败：服务器响应状态为 404（未找到）

我已经使用命令npm install -g express 安装了 express。我在 ubuntu 上的 apache2 服务器上运行它。我已将 html 和 nodejs 文件复制到 var/www/html 目录。

我使用了 express 框架，并且正在使用 ajax 请求与 nodejs 文件进行通信。

web.html

<!DOCTYPE html> 
<html> 
<h3>Example of a Deploy And Decommission Button</h3> 
<body> 
<button onclick="myFunction()" >Deploy</button>
<button onclick="myFunction()">Decommission</button>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script >
function myFunction() {
  $.post("/createContainer").done(() => {
   console.log("container created")
  });
}
</script>        


</body> 
</html>

node.js 文件

const app = require("express")();
    const process = require('child_process');
    app.post("/createContainer", (req, res) => {
     process.exec('kubectl apply -f tomcat.yaml',function (err,stdout,stderr) {
      if (err) {
        console.log("\n"+stderr);
      } else {
        console.log(stdout);
      }
    });
   });
   app.list(80);

如果有的话，我必须对我的代码进行哪些更改。我听说 node.js 将在它自己的节点服务器上运行，这让我想到了如何在同一台服务器上同时运行 html 页面和 nodejs 的下一个问题.

我的意思是我真的很困惑我将如何运行这个应用程序。请帮忙。

【问题讨论】：

标签： html node.js ajax

【解决方案1】：

如果您运行的是 localhost，那么您需要完整的 url：

http://localhost:{port}/createContainer

【讨论】：

OP 无法运行 node js 服务器，这意味着他没有可以调用的端点。

【解决方案2】：

首先 apache2 和 express.js 是两个独立的服务器。所以你可以同时使用它们，但最好只选择其中一个。

在您的示例中，您将做两件事，提供您的 html 文件并将您的应用程序与端点连接。

在 express.js 中，您可以提供您的 html 文件。

无需运行任何 apache2 服务器，您就可以运行与 express.js 服务器配合使用的 nodejs 应用程序。

public/index.html

<!DOCTYPE html>
<html>
  <h3>Example of a Deploy And Decommission Button</h3>
  <body>
    <button onclick="myFunction()">Deploy</button>
    <button onclick="myFunction()">Decommission</button>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
    <script>
      function myFunction() {
        $.post("/createContainer").done(data => {
          console.log("container created");
          console.log(data);
        });
      }
    </script>
  </body>
</html>

index.js

const express = require("express");
const app = express();
const process = require("child_process");
const path = require("path");

app.get("/", function(req, res) {
  res.sendFile(path.join(__dirname + "/public/index.html"));
});
app.post("/createContainer", (req, res) => {
  process.exec("kubectl apply -f tomcat.yaml", function(err, stdout, stderr) {
    if (err) {
      console.log("\n" + stderr);
      res.send(err);
    } else {
      console.log(stdout);
      res.send(stdout);
    }
  });
});
app.listen(8080, function() {
  console.log("Listening on port 8080!");
});

你需要运行你的应用程序

node src/index.js

您可以通过https://codesandbox.io/s/happy-forest-4dvcy查看

【讨论】：

检查此示例 codesandbox.io/s/happy-forest-4dvcy 并导出为 ZIP。你需要你的 package.json 和 express.js 依赖。
嗨，部署按钮现在正在工作，但我希望停用按钮运行命令'kubectl delete pods,services,deployments,pvc,pv --all' 所以我相应地更改了代码，但停用按钮显示加载资源失败：net::ERR_CONNECTION_REFUSED 或连接被拒绝