【发布时间】：2020-10-01 07:46:42
【问题描述】：
我有一个快速服务器，我正在向其呈现我的 payj.html 文件，该文件包含 clyint.js 文件的脚本标记。但是当我这样做时，我会从浏览器的控制台收到此错误：
GET https://iovyb.sse.codesandbox.io/views/clyint.js net::ERR_ABORTED 404
我也尝试将我所有的 JS 包含在 HTML 文件本身中，但由于某种原因，这也不起作用。
ecspres.js
// stop node prawsesiz: pkill -f node
var engines = require("consolidate");
var express = require("express");
var app = express();
app.engine("html", engines.mustache);
app.set("view engine", "html");
// app.use(express.static("src"));
// app.set("port", process.env.PORT || 8080);
var http = require("http");
var server = http.createServer(app);
server.listen(8080, function () {
console.log("Server Up"); //now??
});
app.get("/", function (req, res) {
res.render("payj.html");
});
var io = require("socket.io").listen(server);
io.on("connection", (socket) => {
console.log(socket.id + " joind");
socket.on("Name", (name) => {
console.log(name + " cunectid");
});
});
// //create a server object:
// http
// .createServer(function (req, res) {
// res.write("Hello Server!"); //write a response to the client
// res.end(); //end the response
// })
// .listen(8080); //the server object listens on port 8080
payj.html
<!DOCTYPE html>
<html>
<head>
<style>
td {
border: 3px solid gray;
width: 179px;
}
tr {
height: 179px;
}
table {
margin-top: 9.9%;
}
</style>
<title>TTT!</title>
<!-- <link rel="stylesheet" type="text/css" href="src/styl.css" /> -->
<!-- <script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"
type="text/javascript"
></script> -->
<script src="views/clyint.js"></script>
</head>
<body>
<table align="center">
<tr>
<td align="center"><img src="#" style="display: none;" /></td>
<td align="center"><img src="#" style="display: none;" /></td>
<td align="center"><img src="#" style="display: none;" /></td>
</tr>
<tr>
<td align="center"><img src="#" style="display: none;" /></td>
<td align="center"><img src="#" style="display: none;" /></td>
<td align="center"><img src="#" style="display: none;" /></td>
</tr>
<tr>
<td align="center"><img src="#" style="display: none;" /></td>
<td align="center"><img src="#" style="display: none;" /></td>
<td align="center"><img src="#" style="display: none;" /></td>
</tr>
</table>
<button>PLAY AGAIN</button>
</body>
</html>
clyint.js
// var name = window.prompt("hoo aar yoo");
var io = require("socket.io-client");
var soc = io("https://iovyb.sse.codesandbox.io/");
soc.emit("Name", "Dhroov");
function reset() {
console.log("gei");
var x = document.querySelectorAll("img");
a = 0;
while (a < x.length) {
x[a].setAttribute("src", "");
a++;
}
}
var aTurn = true;
// $(window).load(function () {
var buts = document.querySelectorAll("td");
var a = 0;
console.log(buts.length);
while (a < buts.length) {
// buts[a].addEventListener("click", clic);
buts[a].setAttribute("id", a.toString());
buts[a].addEventListener("click", function clic() {
a = this.id;
if (aTurn) {
var t = document.querySelectorAll("td")[a];
console.log(t);
var td = t.querySelector("img");
td.setAttribute("style", "");
td.setAttribute("which", "cros");
td.setAttribute("width", "79px");
td.setAttribute(
"src",
"https://cdn.pixabay.com/photo/2012/04/12/20/12/x-30465_640.png"
);
t.style.marginLeft = "10px";
} else {
var t = document.querySelectorAll("td")[a];
var td = t.querySelector("img");
td.setAttribute("width", "99px");
td.setAttribute("src", "https://otranscribe.com/favicon.png");
td.setAttribute("which", "not");
td.setAttribute("style", "");
t.style.marginLeft = "10px";
}
aTurn = !aTurn;
var but = document.querySelector("button");
but.addEventListener("click", reset.bind());
});
a++;
}
// checking for win:
// a=0
// var num=0
// function checStrayt(hoo, from, to, dir){
// var t = document.querySelectorAll("td")
// while(true){
// if(t[a].which==hoo)
// num++;
// else
// break
// if(dir==1)
// a+=3
// else if(dir==2)
// a++
// else
// }
另外，如果有帮助，这是我的文件夹结构：
我该怎么办？
【问题讨论】：
-
您必须通过
express.static提供express提供的中间件来提供static文件，看看这个网页expressjs.com/en/starter/static-files.html
标签： javascript html node.js express