Question

js申请。需要帮助来解决此问题。我有app.js这是节点，调用index.html。 index.html实习生调用main.js函数点击。当我使用脚本标记在index.html中嵌入'clicked（）'函数时，它工作正常。但是如果单击的函数位于单独的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：

ScreenShot of the Error

Answer 1

这是因为Node.js服务器无法正确提供main.js - 根据浏览器＆＃34;资源＆＃34;面板，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'))按the docs.提供静态文件然后您可以使用

提供索引

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

使用app.listen(3000);

启动服务器

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

2 个答案: