Node JS - 从客户端javascript调用服务器上的函数答案

【问题标题】：Node JS - call function on server from client javascriptNode JS - 从客户端javascript调用服务器上的函数
【发布时间】：2020-07-12 15:01:32
【问题描述】：

我写了一个 server.js。下面是代码：-

var http = require('http');
var fs = require('fs');
var my_code = require('./my_code');

function send404Response (response) {
    response.writeHead(404, {"Context-Type" : "text\plain"});
    response.write("Error 404: Page not found");
    response.end();
}

function onRequest(request, response) {
    if (request.method == 'GET' && request.url == '/') {
        response.writeHead(200, {"Context-Type" : "text\plain"});
        fs.createReadStream ('./index.html').pipe(response);
    } else {
        send404Response(response);
    }
}

http.createServer(onRequest).listen(8888);
console.log("Server is now running");

另外一个用node写的服务端js是my_code.js。下面是代码：-

var https = require('https');
module.exports.func = myFunction;

function myFunction(myParam) {
    console.log (myParam);
}

myFunction(myParam) 应该从将传递 myParam 的客户端 javascript 调用。但是客户端 javascript 抛出错误，说 myFunction 没有找到。

请在下面找到包含客户端 javascript 的 HTML：-

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('#button').click(function() {
        $.ajax('/', function(list) {
            myFunction($('#myField').text()); //How to do it
        });
    });
});
</script>
</head>
<form>
    <div id="contactno">myField:<input type="text" name="myField">  </div>
    <div id="button"><input type="button" value="Submit"></div>       
</form>
</html>

在点击 html 页面之前，我正在运行 node server.js
请让我知道从客户端调用 myFunction 的最佳方式。
提前致谢。

【问题讨论】：

是的。因为它是服务器端。它不在客户端中。您希望能够从客户端 javascript 调用 PHP 函数吗？ HTTP 是一个超级简单的协议，只发送文本。因此它不会神奇地使服务器端功能出现在客户端中。
How to call node.js server side method from javascript?的可能重复
是的，你是对的。服务器端功能在客户端将不可用。所以，我不应该直接尝试从客户端访问 myFunction 。这就是我发表评论的原因 - 怎么做。
但是从客户端调用 nodeJs 中的服务器端函数的最佳方法是什么。

标签： javascript node.js

【解决方案1】：

显然，正如您所知道的，您不能在客户端调用此函数，因为它在客户端不可用。所以你的客户端必须调用服务器，对吧？

因此客户端代码必须将$('#myField').text() 传递给服务器，而服务器必须有另一个端点来接收它，调用myFunction 并返回结果。

您可以通过多种不同的方式进行操作，这是一个简单的示例。

用另一个端点扩展服务器

function onRequest(request, response) {

  if (request.method == 'GET' && request.url == '/') {
    response.writeHead(200, {"Context-Type" : "text\plain"});
    fs.createReadStream ('./index.html').pipe(response);
  } else if (request.method === 'POST' && request.url == '/do-work') {

    // asuming sync as in your example
    let result = my_code.func(request.body); 
    response.writeHead(200, {"Context-Type" : "application/json"});
    response.write(JSON.stringify({

      result: result
    });
    response.end();
  } else {
    send404Response(response);
  }
}

（我不会在这里讨论一些不太好的做法和代码，以使我的回答集中在您的问题上。）

您还必须扩展您的客户端代码。

$('#button').click(function() {
    $.ajax('/', function(list) {
        $.ajax({
            type: 'POST',
            url: '/do-work',
            data: $('#myField').text()
            success: function(result) {
              console.log('Response:', result);
            }
        }
    });
});

【讨论】：

用 SO markdown 改变了，我在格式化这个时遇到了很多问题！
是的，我知道，在手机上发帖并与格式化这件事作斗争！
嗨 Zlatko，感谢您的回复。但是，当我尝试进行上述 ajax 调用时，也在 server.js 上，它被检索为 type = GET 和 url = "/"。