Q&A
そうそう、PHPはWebサーバが実行し始めて返す作りになっているので、
PHPファイルを更新したらすぐF5でリロードしても良いですが、
Node.jsはWebサーバというプロセス実行を内包していますので、
index.jsファイルを更新しただけでは挙動が変化しません。
index.jsファイルを変更する度に実行を中断して立ち上げ直してくださいね。
ドットインストールでnode.jsを勉強中です。＃12からのフォームを表示、1行掲示板を作ろうで最終動作がうまくいきません。
・読み込んだejsがすでに<li></li>が一つある。（先頭文字「・」が表示されている。
・フォームから入力して送信しても、「・」が増えるだけで文字が表示されない。
おそらく書き出しの部分ではなく、postsという配列に入れられていないのではないかと思っていますが、間違っている部分がわかりません。デベロッパーツール等でもエラーは出ていません。
どなたかご教授ください。
node.js・・・最新安定板
ドットインストール・・・https://dotinstall.com/lessons/basic_nodejs/26212から
bbs.ejs
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <tittle>BBS</tittle> 5 <meta charset = "utf-8"> 6</head> 7<body> 8 <form method="POST"> 9 <input type="text" name="name"> 10 <input type="submit" value="送信"> 11 <ul> 12 <% for (var i =0; i< posts.length; i++) { %> 13 <li><% posts[i] %></li> 14 <% } %> 15 </ul> 16</body> 17</html>
server.js
1var http = require('http') 2 fs = require('fs'), 3 ejs = require('ejs'), 4 qs = require('querystring'); 5var settings = require('./settings.js'); 6var server = http.createServer(); 7var template = fs.readFileSync(__dirname + '/public_html/bbs.ejs' , 'utf-8'); 8var posts = []; 9 10function renderForm(posts, res){ 11 var data = ejs.render(template,{ 12 posts : posts 13 }); 14 res.writeHead(200,{'Content-Type':'text/html'}); 15 res.write(data); 16 res.end(); 17} 18 19console.log(settings); 20 21 22 23server.on('request',function(req,res){ 24 if (req.method === 'POST'){ 25 req.date=""; 26 req.on("readable" , function(){ 27 req.data += req.read(); 28 }); 29 req.on("end" ,function(){ 30 var query = qs.parse(req.data); 31 posts.push(query.name); 32 renderForm(posts, res); 33 }); 34 }else{ 35 renderForm(posts, res); 36 } 37}); 38 39server.listen(settings.port, settings.host); 40console.log("Server lintening ...");
回答2件
0
ベストアンサー
サーバーのデータがとれているなら、
以下の部分で表示がうまくいっていないわけですね。
html
1 <li><% posts[i] %></li>
ならばEJSの構文を確認して、何が問題なのか考えてみましょう。
https://qiita.com/miwashutaro0611/items/36910f2d784ff70a527d
投稿2019/04/23 13:25
総合スコア448
0
postsという配列に入れられていないのではないかと思っていますが、間違っている部分がわかりません。
つまり、Node.jsで実行中のデータが何であるかを確認出来れば
何処が間違っているかわかるわけですよね。
でしたらconsole.logを使いましょう。
Node.jsもconsole.logを仕込んで出力出来るので、
あちこちに仕込んで出力させましょう。
JavaScript
1 req.on("end" ,function(){ 2 var query = qs.parse(req.data); 3 posts.push(query.name); 4 renderForm(posts, res); 5 });
ここの部分を…こうじゃ！！
JavaScript
1 req.on("end" ,function(){ 2 var query = qs.parse(req.data); 3 console.log(query); // 追加されたconsole.log 4 posts.push(query.name); 5 console.log(posts); // 追加されたconsole.log 6 renderForm(posts, res); 7 });
サーバーの方を再起動してみましょう。
ブラウザで訪問する度に、コンソールで起動しているNode.jsの画面の方にconsole.logの結果が表示されるのが確認出来るはずです。
まずはこのような感じでNode.js側で実際に出力してデバッグしていきましょう。
投稿2019/04/23 09:59
総合スコア21158
ご回答ありがとうございます。
[Object: null prototype] { name: 'いいいいnull' }
[ 'null', 'いいいいnull' ]
と出力されます。もうちょっと自分で試行錯誤しろよ、と言われそうですが、これはつまりフォームからポストした際に、postsという配列にしっかり入っておらずしたがって書き出しもできていない、と認識すればよろしいでしょうか。
もしよければヒントをいただければと思います。
少し考えていきましょうか。
画面で送信した内容はブラウザが持っているform要素のPOST通信です。
これが不正な情報を送信しているとは到底思えませんので省きます。
次に着目すべきなのは「{ name: 'いいいいnull' }」です。
なんで文字列で`null`が尻に入ってるねん。
まぁいいや、
これで再起動掛けたことで、「なんか入力した文字列の尻にnullとかいう変なワードが入ってるんだが？」という不満はあるものの、
1行掲示板自体はうまく動いているんじゃないですか？
だったら直接の原因はindex.jsファイルの書き換え時に
Node.jsの実行を再起動してなかったためです。
ありがとうございます。
コマンドでのサーバー停止→サーバー起動はもちろん、ブラウザ自体も更新ではなく再起動をかけてやっていますが、うまくいきません。
おっしゃる通り掲示板機能は動いているようで、送信を押すたびに項目は増えていきますが、実際に文字列の表示はされません。
1回目、「1111」2回目「ああああ」3回目「！！！！」とすると、3回目にはコマンドのコンソールで
[Object: null prototype] { name: '！！！！null' }
[ '1111null', 'ああああnull', '！！！！null' ]
と吐きますので、配列には入っているがwriteできない、といった感じでしょうか。
記述中に「data」をdateと書いているところを見つけ修正しましたがここではありませんでした。
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/04/23 13:43
2019/04/23 13:47