【问题标题】:How do you use a Node.js variable on the client-side?如何在客户端使用 Node.js 变量?
【发布时间】:2016-06-23 23:15:31
【问题描述】:

我对 NODEJS 比较陌生,我正在努力解决一个基本问题,即正确使用全局变量,我阅读了很多关于它的内容,但似乎我无法使其正常工作,我会发布一些代码以便更好地了解问题。

我有这个简单的 js 作为服务器运行:

myapi.js

var http = require('http');
var express = require('express');
var app = express();
var exec = require('child_process').exec, child;
var fs = require('fs');
var jUptime;
var ipExp = require('./getDown');
var filesD = [];
var path = "/media/pi/01D16F03D7563070/movies";

app.use(express['static'](__dirname ));

exec("sudo /sbin/ifconfig eth0 | grep 'inet addr:' | cut -d: -f2 | awk '{print $1}'", function(error, stdout, stderr){
            ip = stdout;
            exports.ipAdd = ip;
            console.log(ip);
});

app.get('/files', function(req, res) {
    fs.readdir(path, function(err, files) {
        if (err){
            console.log("Non riesco a leggere i files");
        }

        filesD=files;
        console.log(filesD);

    });
    res.status(200).send(filesD);
});

app.get('/up', function(req, res) {
    child = exec("uptime -p", function(error, stdout, stderr){
                    jUptime = [{uptime: stdout}];
                });
    res.status(200).send(jUptime);
});

app.get('*', function(req, res) {
    res.status(404).send('Richiesta non riconosciuta');
});

app.use(function(err, req, res, next) {
    if (req.xhr) {
        res.status(500).send('Qualcosa è andato storto');
    } else {
        next(err);
    }
});
app.listen(3000);
console.log('Server attivo sulla porta 3000');

然后我在一个简单的网页中使用了这个 JS:

getDown.js

var ip = require('./myapi').ipAdd;
function gDownloads() {
    var url;
    var jqxhr;
    var dat;

        url = 'http://' + ip + '/files';
        jqxhr = $.getJSON(url, function(dat) {
        for(i=0; i<dat.length; i++){
                    $('#downLoad').append('<p>' + dat[i] + '</p>');
        }
        $('#bId').append(dat.length);
        })
     .done(function() {
        console.log("OK");
     })
     .fail(function(data) {
        console.log("Fallito: "+data);
     })
};

问题是,当我导航到使用 getDown.js 的 html 页面时,我在 getDown.js 上收到以下错误

require is not defined

我需要在 myapi.js 中传递包含 IP 地址的变量才能在 getDown.js 中使用它,我希望我能解释清楚,提前谢谢。

【问题讨论】:

  • 你不能从浏览器require你的节点脚本,除非你使用类似browserify的东西
  • 这里的基本误解:您的 NodeJS 代码正在在服务器上运行。您的网页代码正在在客户端上运行。你得到的错误(“require is not defined”)是因为require不是浏览器当前提供的,除非你使用AMD插件,即使你不想包含你的客户端网页中的>服务器端代码。
  • @T.J.Crowder 这是有道理的,那么我怎样才能完成我想做的事情呢?我想进行 REST 调用并获取带有 IP 的 json,但我真的很想避免为此使用调用。

标签: javascript jquery node.js html


【解决方案1】:

require 是全局存在的,存在于 Node.js 代码中,即在服务器中执行的 javascript 代码中。

您的服务器将响应客户端并给它一个 HTML 页面来呈现。该 HTML 页面可以告诉浏览器也从服务器请求一个 javascript 文件。当它接收到该文件时,客户端将执行它。客户端确实没有有一个require 全局(您可以通过打开控制台并输入require 来测试它)

使用 Browserify

​​>

或者你可以编写 Node 风格的代码,像你正在做的那样需要你的全局,然后通过 browserify 运行代码。这将创建一个可由客户端执行的新 javascript 包,因此您应该告诉您的 html 页面使用该包而不是 getDown.js

这是一个像这样使用 browserify 的基本示例。

module.js

function getIp() {
  return 123456;
}

module.exports = {
  getIp: getIp
};

main.js

var module = require('./module');

function getIp() {
  var ip = module.getIp();
  return ip;
};

console.log(getIp());

编译包

$ browserify main.js -o public/bundle.js

index.html

<script type="text/javascript" src="public/bundle.js"></script>

客户端的全局变量

要在客户端使用服务器已知的全局变量,您可以将该变量传递给您的渲染引擎(如果您使用 Express,则可能是 Jade)并将该变量插入到 &lt;script&gt; 标记中定义了一些全局变量。如果这是您喜欢的方法,请发表评论,我可以添加更多细节。

如果您还有其他问题,请告诉我!

【讨论】:

  • 嗨,谢谢,我更喜欢使用 browserify,我通过 npm 安装它并尝试使用它,但我正在“努力”以使其正常工作,请您修改我的上面的代码,所以我可以理解吗?我按照教程中的确切过程从包含在 HTML 文件 bundle.js 中的 Browserify 主页进行操作,但是在 html 解析器到达我的
  • 我认为我无法调试为什么您的代码在无法运行和调试的情况下抛出该错误。如果你愿意,你可以在 github 上发布它并发布一个链接,但我现在可以做的是发布一个使用 browserify 的基本示例。
猜你喜欢
  • 2019-07-20
  • 2011-06-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2022-11-20
  • 2018-01-05
  • 2018-11-02
相关资源
最近更新 更多