ReferenceError：找不到变量：在node.js中单击

Question

js应用程序。 需要帮助来解决此问题。 我有app.js这是节点，调用index.html。 index.html实习生调用main.js函数被单击。 当我使用脚本标记将功能'clicked（）'嵌入index.html中时，它可以正常工作。 但是，如果单击的函数在单独的js文件中，则无法正常工作。 我认为这与node.js有关，但无法弄清楚。 请在下面找到我的代码。

app.js

var http = require('http');
var fs = require('fs');
var express = require('express');
var path = require('path');
var app = express();

app.use(express.static(path.join(__dirname, 'public')));

var request = require('request');
request('http://localhost:8000/test', function (error, response, body)     {
if (!error && response.statusCode == 200) {
console.log(body);
}
});

var server = http.createServer(function(req,res){
console.log('Request was made:' + req.url);
res.writeHead(200,{'content-Type': 'text/html'});
var myReadStream = fs.createReadStream(__dirname + '/index.html','utf8');
myReadStream.pipe(res);
});
server.listen(3000,'127.0.0.1');
console.log('Listening on port 3000');

index.html

 <!DOCTYPE html>
 <html>
  <head>
<title> Login</title>
<script type="text/javascript" src="main.js"></script>
<center>
    <h1> Login </h1>
</center>
</head>
<body>
 <center>
<input type="text" id="username" placeholder="UserName"></br>
<input type="password" id="password" placeholder="PassWord"></br>
<input type="button" value="Login" onclick="clicked()">
</center>
</body>
</html>

main.js

function clicked() {
var user = document.getElementById('username');
var pass = document.getElementById('password');

var checkuser = "test";
var checkpass = "123"

if (user.value == checkuser) {
    if (pass.value == checkpass) {
        window.alert("You are logged in as "+ "'"+user.value+"'");
        open("http://www.yahoo.com");
    }
    else
    window.alert("Incorrect username or Password"); 
     }
    else
    window.alert("Incorrect username or Password");
  }

错误的ScreenShot：

错误的屏幕截图

Answer 1

这是因为Node.js服务器无法正确提供main.js服务-根据浏览器的“资源”面板， main.js可用，但其路径不是/main.js 。

低级Node.js服务器代码和Express框架代码共存，这不是一个好主意。

要使用低级Node.js代码解决问题，请执行以下操作：

var server = http.createServer(function(req,res){
  console.log('Request was made:' + req.url);

  if (req.url === '/main.js') {
    res.writeHead(200,{'content-Type': 'application/javascript'});
    var jsReadStream = fs.createReadStream(__dirname + '/main.js','utf8');
    jsReadStream.pipe(res);
    return;
  }

  res.writeHead(200,{'content-Type': 'text/html'});
  var myReadStream = fs.createReadStream(__dirname + '/index.html','utf8');
  myReadStream.pipe(res);
});

要解决Express框架的问题：

var http = require('http');
var express = require('express');
var app = express();

app.get('/', function(req, res) {
  res.sendFile(path.join(__dirname + '/index.html'));
});
app.get('/main.js', function(req, res) {
  res.sendFile(path.join(__dirname + '/main.js')); // where main.js located.
});

app.set('port', 3000);
var server = http.createServer(app);
server.listen(port);

Answer 2

您同时使用http和express ，这可能是不必要的。 我会根据文档使用app.use(express.static('public'))提供静态文件。 然后，您可以使用

app.get('/', (req, res) => {
  res.sendFile(path.join(__dirname + '/index.html'))
});

并使用app.listen(3000);启动服务器app.listen(3000);

ReferenceError：找不到变量：在node.js中单击

问题描述

2 个解决方案

解决方案1
1 已采纳 2017-06-28 03:38:36

解决方案2
0 2017-06-28 04:26:56

ReferenceError：找不到变量：在node.js中单击

问题描述

2 个解决方案

解决方案1 1 已采纳 2017-06-28 03:38:36

解决方案2 0 2017-06-28 04:26:56

解决方案1
1 已采纳 2017-06-28 03:38:36

解决方案2
0 2017-06-28 04:26:56