Question

下午好！

我遇到了一个有趣的挑战（对于像我这样的javascript新手）。

情景：

我有一个带有3个选项元素的HTML select元素（实验1，实验2，实验3）。如果我点击实验1，我想在select元素的addEventListener函数中调用Node.js文件dataHandler.js中的getPatientDataFromExperiment（）函数。事件监听器工作正常。但我无法访问该功能。在我的研究期间，我遇到了可能解决我的问题的主题，但说实话 - 我不太了解它们（尤其是套接字解决方案）。我正在使用Node.js（v8.9.4）和Visual Studio Code。

到目前为止我做了什么：

我试图通过XmlHttpRequest加载包含该函数的脚本。但是在相应的响应中，我只是将我的脚本作为字符串返回。

问题：

是否有一个或多或少的简单解决方案从客户端事件监听器函数调用Node.js文件的服务器端函数（特别是不刷新站点）？

我非常感谢您的宝贵帮助和演示示例。非常感谢你！

研究：

node.js executing server side function from client side

How to call a server side function from client side (e.g. html button onclick) in Node.js?

代码（Client-side，eventHandler.js）：

document.getElementById("experiment").addEventListener("change", function()
{
    var request = new XMLHttpRequest();
    request.onreadystatechange = function()
    {
        if (this.readyState == 4 && this.status == 200) 
        {
            document.getElementById("target3").innerHTML =
            this.responseText;
        }
    }

    request.open("GET","javascript/dataHandler.js",true);
    request.send();
});

代码（Node，dataHandler.js）：

function getPatientDataFromExperiment()
{
    alert("Function call worked");
}

结果：getPatientDataFromExperiment函数全部为纯文本

Answer 1

1）您需要托管dataHandler.js
2）不要在NodeJS项目中使用警报
如果我是你，我会使用ExpressJS。在某个地方创建一个新文件夹，但不在您的前端项目内。然后运行

npm init
npm install --save-dev express

然后使用以下内容创建名为server.js的文件：

const express = require('express')
const app = express()

app.get('/', (req, res) => res.send('Function call worked'))

app.listen(3000, () => console.log('Example app listening on port 3000!'))

然后，您可以使用以下命令将其托管在localhost中：

node server.js

然后你需要修改你的前端代码中的这一行

request.open("GET","javascript/dataHandler.js",true);

到此：

request.open("GET","http://localhost:3000",true);

如何从客户端事件侦听器函数调用Node.js函数？

1 个答案: