如何在每次调用时更改 ejs(Node.js) 函数的返回值？ [复制]答案

【问题标题】：How do I make the return value of an ejs(Node.js) function change at every call? [duplicate]如何在每次调用时更改 ejs(Node.js) 函数的返回值？ [复制]
【发布时间】：2021-04-16 21:39:33
【问题描述】：

我制作了一个 html(ejs) 按钮，每当点击该按钮时，它都会与 node.js 文件通信并返回一个随机选择的数字。第一次单击有效并返回一个随机数（例如 1）。问题是，在下一次单击中，按钮返回相同的数字 (1)，并在所有后续单击中继续这样做。请问如何让这个ejs函数的返回值在每次点击时改变？

index.ejs

   <div style="width: 400px;height:80px;display:inline-block;">
        <div onclick="calculateResult()">
            Button           //// Button is actually a div
        </div>      
   </div>
   <script type="text/javascript" >
        alert('<%= calculateResult() %>')
   </script>

app.js(node.js)

app.locals.calculateResult = function(){
    randomPick = Math.floor(Math.random() * 4)
    return randomPick
}

【问题讨论】：

次要问题：不要使用警报，它是一个古老的函数，除了在显示 .toString() 调用的结果时阻塞线程之外不能做任何事情。使用控制台 API 进行调试，或使用带有适当 CSS 的普通 HTML 向您的用户呈现信息。也不要使用onclick，我们不再使用 HTML4.01，有一个单独的 .js 文件（可以像其他所有内容一样生成 EJS），您可以使用<script src="..."></script>（无类型属性。脚本是 JS 除非您覆盖 HTML5 中的类型）并查询您的 DOM，以便您可以添加EventListener
AFAIK ejs 是一个模板引擎：<%= calculateResult() =%> 实际上是在服务器上计算，即在将 HTML 发送到客户。如果您在浏览器中检查您的 HTML，您应该会看到 静态编写的 alert('1')。如果您需要服务器为客户端计算一个值，您需要编写以下代码： 1/ 服务器上的一个端点，它根据请求提供随机数； 2/ 客户端上的一些 AJAX/XmlHttpRequest 逻辑命中该端点并使用接收到的数字。
您的评论帮助我理解了更多内容。谢谢。

标签： javascript html node.js ejs

【解决方案1】：

正如@stock-overflaw 所说，您的<%= calculateResult() %> 正在服务器上计算，然后发送到已编译的客户端

这意味着alert('<%= calculateResult() %>')始终是alert('1')，无论在页面呈现后单击按钮多少次

更好的方法是减少来自服务器的计算压力并在客户端实现它就这样

       <div onclick="calculateResult()">
            Button 
        </div> 

   <script type="text/javascript" >
 const calculateResult = () =>{
    randomPick = Math.floor(Math.random() * 4);
   alert('randomPick')
}
  
   </script>

但如果您仍然需要从服务器发送新值，则必须编写另一条路由来处理它

【讨论】：