Thé*_*o.B 5 html javascript node.js embedded-javascript
我正在openclassroom上做 NodeJS 教程。\n我使用模板引擎ejs。我尝试运行一个简单的 JS 脚本,但我不能。
这是我的应用程序结构:
\n\nApp_toDoList/\n\xe2\x94\x82\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80app.js\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80package-lock.json\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80package.json\n\xe2\x94\x82\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 js/\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 node_modules/\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 views/\n \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 modify.ejs\n \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 todo.ejs\nRun Code Online (Sandbox Code Playgroud)\n\n我运行我的服务器app.js:
var express = require(\'express\');\nvar session = require(\'cookie-session\'); // Charge le middleware de sessions\nvar bodyParser = require(\'body-parser\'); // Charge le middleware de gestion des param\xc3\xa8tres\nvar urlencodedParser = bodyParser.urlencoded({ extended: false });\n\nvar app = express();\n\n\n/* On utilise les sessions */\napp.use(session({secret: \'todotopsecret\'}))\n\n\n/* S\'il n\'y a pas de todolist dans la session,\non en cr\xc3\xa9e une vide sous forme d\'array avant la suite */\n.use(function(req, res, next){\n if (typeof(req.session.todolist) == \'undefined\') {\n req.session.todolist = [];\n }\n next();\n})\n\n/* On affiche la todolist et le formulaire */\n.get(\'/todo\', function(req, res) {\n res.render(\'todo.ejs\', {todolist: req.session.todolist});\n})\n\n/* On ajoute un \xc3\xa9l\xc3\xa9ment \xc3\xa0 la todolist */\n.post(\'/todo/add/\', urlencodedParser, function(req, res) {\n if (req.body.newtodo != \'\') {\n req.session.todolist.push(req.body.newtodo);\n }\n res.redirect(\'/todo\');\n})\n\n/* Supprime un \xc3\xa9l\xc3\xa9ment de la todolist */\n.get(\'/todo/delete/:id(\\\\d+)\', function(req, res) {\n if (req.params.id != \'\') {\n req.session.todolist.splice(req.params.id, 1);\n }\n res.redirect(\'/todo\');\n})\n\n.get(\'/todo/modify/:id(\\\\d+)\',function(req,res){\n if (req.params.id != \'\') {\n res.render(\'modify.ejs\', {index: req.params.id, toModify: req.session.todolist[req.params.id]})\n }\n})\n\n.post(\'/todo/modified/:id(\\\\d+)\', urlencodedParser, function(req, res) {\n if (req.body.modifytodo != \'\') {\n req.session.todolist[req.params.id]=req.body.modifytodo;\n }\n res.redirect(\'/todo\');\n})\n/* On redirige vers la todolist si la page demand\xc3\xa9e n\'est pas trouv\xc3\xa9e */\n.use(function(req, res, next){\n res.redirect(\'/todo\');\n})\n\n.listen(8080);\nRun Code Online (Sandbox Code Playgroud)\n\n你可以看到我调用渲染 todo.ejs :
\n\n<!DOCTYPE html>\n\n<html>\n\n<head>\n <title>Ma todolist</title>\n <style>\n a {\n text-decoration: none;\n color: black;\n }\n </style>\n <script src="/js/myJS.js"></script>\n</head>\n\n<body>\n <h1>Ma todolist</h1>\n\n <ul>\n <% todolist.forEach(function(todo, index) { %>\n <li>\n <a href="/todo/delete/<%= index %>">\xe2\x9c\x98</a>\n <%= todo %>\n <a href="/todo/modify/<%= index %>">\xef\xb8\x8f</a>\n </li>\n <% }); %>\n </ul>\n\n <form action="/todo/add/" method="post">\n <p>\n <label for="newtodo">Que dois-je faire ?</label>\n <input type="text" name="newtodo" id="newtodo" autofocus />\n <input type="submit" />\n </p>\n </form>\n\n <input type="text" name="date" id="date">\n\n\n\n</body>\n\n</html>\nRun Code Online (Sandbox Code Playgroud)\n\n我的问题是 myJS.js 脚本无法运行。其中只有一个alert(\'hello\'),我的浏览器(Firefox)上没有任何警报
问题是,如果我将 todo.ejs 保存在 todo.html 中(我删除了 ejs 部分),则会出现警报。
\n\n我担心问题来自我的节点服务器处理目录的方式。我发现了这个,但它对我没有多大帮助。
\n\n如果您有任何想法或问题,请随时告诉我。我是 JS、节点等方面的初学者,所以解决方案可能很简单。
\n\n谢谢
\n好吧,我发现我的错误了。我从未向我的节点服务器说明静态文件在哪里。我app.use(express.static('public'));在会话行上方添加了这一行。我'/public'在旁边创建一个文件夹app.js
这样,当ejs模板需要图像、CSS 或 JS时,我的服务器会发送文件