Q&A
静的な js (に限らず) ファイルを返す場合は express.static とかを使うのでは。
https://qiita.com/tky529/items/515aa38b6f667f6808f8
node.jsでhtmlを表示させて、そのhtmlにリンクとしてコードの記載しているjavascriptファイルを実行したいのですが、エラーが出てうまくいきません。
解決方法がわかる人がいたら教えてください。
コードが見にくくてすみません。
node.jsでhtmlを表示しているところ(文字数の関係で、htmlを表示する部分だけを記入しています）
javascript
1app.get("/game",(req,res)=>{ 2 res.sendFile("/node_apps/node_app_5/views/game.html"); 3})
html
1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <title>Document</title> 8 <script src="/route/index.js"></script>///////ここのリンクで示したコード。 9</head> 10<body> 11 <h1>game</h1> 12 <script src="/socket.io/socket.io.js"></script> 13 <script> 14 let socket = io(); 15 let user_id = ""; 16 let room_id = null; 17 let global_user = null; 18 socket.on("user_data",(data)=>{ 19 if (user_id = ""){ 20 user_id = data[0]; 21 } 22 if (room_id == null){ 23 room_id = data[1]; 24 } 25 }) 26 socket.on("user_name",(name)=>{ 27 console.log("1"+global_user); 28 if (global_user == null){ 29 global_user = name; 30 console.log("2"+global_user); 31 } 32 }) 33 console.log(user_id); 34 </script> 35 36</body> 37</html>
index.js
javascript
1console.log("test");
エラー
環境
windows10 64bit
ブラウザ edge
node.js v16.13.2
やってみたらうまくいきました！ありがとうございます。
回答2件
1
ベストアンサー
app.getが何なのか説明が無いので推測になりますが、
恐らくExpress.jsなどで作られたエンドポイントでしょう。
Webブラウザは受け取ったHTMLを解析してロードしていきますが、
scriptやlink、imgタグを見つけた時は「追加のHTTPリクエストを送信して別のデータを受け取ろうとする」挙動を行います。
その/routes/index.jsファイルを渡す記述をapp.getなどで宣言してやらねばなりません。
js
1app.get("/route/index.js", (req,res)=>{ 2 res.sendFile("/pathToDirectory/route/index.js"); 3})
【おまけ】もしExpress.jsなら
公式ドキュメントの上メニュー「解説→静的ファイル」にこの目的に合致したやり方が載っています。
参考サイト: Express での静的ファイルの提供
投稿2022/05/16 03:15
総合スコア21099
1
エラーメッセージのとおりです。ブラウザから/route/index.jsにアクセスできるようにする必要があります。
投稿2022/05/15 10:47
総合スコア142258
