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

时间:2015-12-24 20:02:14

标签: javascript node.js

我写了一个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");

在节点中编写的另一个服务器端js是my_code.js。以下是代码: -

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

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

myFunction(myParam)应该从客户端javascript调用,它将传递myParam。但客户端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的最佳方式 在此先感谢。

1 个答案:

答案 0 :(得分:0)

显然,正如您所知,您无法在客户端上调用此功能,因为它在那里不可用。所以你的客户必须打电话给服务器,对吗?

因此客户端代码必须将$('#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);
            }
        }
    });
});