当我从另一个文件调用函数时，Ejs 不加载

Question

基本上我想在单击按钮时运行一个函数，但是当我启动服务器并一次转到本地主机时它起作用了，这是应该发生的事情，在本地主机页面没有加载。（无法连接错误）

如果我删除该功能就没有问题。我怎样才能让它在我点击按钮时才工作？

非常感谢。

我的func.js

const mongoose = require("mongoose");
const axios = require('axios');
async function func() {
//MyCodes
}

module.exports = {
  func: func
}

我的index.ejs

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title></title>
</head>

<body>
  <button type="button" onClick= <%=  func.func()  %> >Click</button>

//Other codes are independent the button

</body>
</html>

我的 res.render 代码块在 app.js

var func = require('./func');
app.get("/", (req, res) => {
res.render('index', {
            cName: name,
            symbol: symbol,
            len: finds[0].result.length,
            cPrice: price,
            cDate: date,
            func:func
        });
    });
});
})

Answer 1

你误会了。您不能从 html （前端）调用内部 nodejs 函数（后端）。如果你的前端需要执行一些后端操作，比如查询 mongo，你有这些选择：

#1 客户端呈现（现代）

This is the most used in the modern world: Ajax & Api

您的后端公开了一个休息端点，例如 /products/search 接收到 json 和 return 另一个 json
这个端点应该在你前端的一些 js 文件上与 javascript 一起使用：

html

<html lang="en">
<head>
  <script src="./controller.js"></script>
</head>
<body>
  <button type="button" onClick="search();" >Click</button>
</body>
</html>

controller.js

function search(){
$.ajax({
  url:"./api/products/search",
  type:"POST",
  data:JSON.stringify(fooObject),
  contentType:"application/json; charset=utf-8",
  dataType:"json",
  success: function(response){
    ...
  }
})
}

注意 1：controller.js 包含 javascript 用于 浏览器 不适用于后端：nodejs
注2：ejs只用于return初始html，所以最好使用其他框架like:react、angular、vue

#2 服务器端呈现（旧版）

在这种情况下，ajax和浏览器的js并不是严格要求的。

您 html 上的任何事件都应使用 <form> 触发整个页面重新加载
您的后端从接收任何参数，使用 [= 进行一些操作，例如 mongo 查询和 returns html 而不是 json 69=] 你的情况

备注

Ejs 用于 SSR = 服务器端渲染，因此添加 ajax 对于新手来说可能比较复杂。在这种情况下，使用选项 #2
您不能在客户端（javascript 用于浏览器）使用 nodejs 函数（javascript 用于服务器）。也许一些解决方法能够做到这一点，但不要混合不同的东西。

当我从另一个文件调用函数时，Ejs 不加载

Ejs doesn't load when I call a function from another file

ejs

node.js

express

#1 客户端呈现（现代）

#2 服务器端呈现（旧版）

备注