前提・実現したいこと
expressを使って、DBにある温度/湿度のデータからグラフを作成しようとしています。
また、温度/湿度のグラフに加えて、「最新 温度:20℃/湿度:40%」 というようにグラフとは別に最新の温度/湿度がひとめで分かるようにページ内に表示したいです。
/selectにpostして
sqlを実行し、グラフをindex.ejsで表示することはできました。
最新のデータを取得して表示しようと思ったときに、
app.jsのconnection.query()のなかに、もうひとつconnection.query()を書いてsqlを実行したいと考えました。このとき、console.log(results_graph);とconsole.log(results_new);では値は取れています。
しかし、index.ejsではエラーが出てブラウザが表示されなくなります。
(エラーは以下参照)
connection.query()のなかに、もうひとつconnection.query()を書くにはどうすればよいのでしょうか?
もしくは、それ以外の方法で実現可能な方法があればご教示いただきたいです。
よろしくお願いします。
※deviceを選択して/selectへpostするようになっています。
該当のソースコード
app.js
index.ejsにて、newsまわりの処理を書かないとき、(下記のindex.ejsコード参照)
console.log(results_graph);とconsole.log(results_new);では値は表示できます。
javascript
1const express = require('express'); 2const mysql = require('mysql'); 3const app = express(); 4 5app.use(express.static('public')); 6app.use(express.urlencoded({extended: false})); 7 8app.use(express.static('statics')); 9 10const connection = mysql.createConnection({ 11 host: 'localhost', 12 user: 'root', 13 password: '-------', 14 database: '********' 15}); 16 17app.get('/', (req, res) => { 18 res.render('top.ejs'); 19}); 20 21//これだけだとうまくいきます 22// app.post('/select', (req, res) => { 23// connection.query( 24// 'SELECT date, temperature, humidity FROM data WHERE device = ? ORDER BY date ASC;', 25// [req.body.device], 26// (error, results) => { 27// res.render('index.ejs', {items: results}); 28// } 29// ); 30// }); 31 32//selectに来たときに2つのSQLを実行したい 33app.post('/select', (req, res) => { 34 connection.query( 35 'SELECT date, temperature, humidity FROM data WHERE device = ? ORDER BY date ASC;', 36 [req.body.device], 37 (error_graph, results_graph) => { 38 console.log(results_graph); 39 40 connection.query( 41 'SELECT * FROM data where date=(select max(date) from data where device = ?);', 42 [req.body.device], 43 (error_new, results_new) => { 44 console.log(results_new); 45 res.render('index.ejs', {items: results_graph, news: results_new}); 46 } 47 ); 48 } 49 ); 50}); 51 52app.listen(3000); 53
index.ejs(<body>の一部を抜粋)うまくいく
ejs
1<% items.forEach((item) => { %> 2 <span class="id-column"><%= item.id %></span> 3 <span class="dt-column"><%= item.date %></span> 4 <span class="temp-column"><%= item.temperature %></span> 5 <span class="humi-column"><%= item.humidity %></span> 6<% }); %> 7
index.ejs(<body>の一部を抜粋)newsの中身を表示したくてもエラーが出る
ejs
1<% news.forEach((new) => { %> 2 <span class="id-column"><%= new.id %></span> 3 <span class="dt-column"><%= new.date %></span> 4 <span class="temp-column"><%= new.temperature %></span> 5 <span class="humi-column"><%= new.humidity %></span> 6<% }); %> 7<% items.forEach((item) => { %> 8 <span class="id-column"><%= item.id %></span> 9 <span class="dt-column"><%= item.date %></span> 10 <span class="temp-column"><%= item.temperature %></span> 11 <span class="humi-column"><%= item.humidity %></span> 12<% }); %> 13
エラー内容
ターミナルとchrome上に以下のエラーが表示されます。
SyntaxError: Unexpected token ')' in /Users/pass/views/index.ejs while compiling ejs If the above error is not helpful, you may want to try EJS-Lint: https://github.com/RyanZim/EJS-Lint Or, if you meant to create an async function, pass `async: true` as an option. at new Function (<anonymous>) at Template.compile (/Users/pass/node_modules/ejs/lib/ejs.js:662:12) at Object.compile (/Users/pass/node_modules/ejs/lib/ejs.js:396:16) at handleCache (/Users/pass/node_modules/ejs/lib/ejs.js:233:18) at tryHandleCache (/Users/pass/node_modules/ejs/lib/ejs.js:272:16) at View.exports.renderFile [as engine] (/Users/pass/node_modules/ejs/lib/ejs.js:489:10) at View.render (/Users/pass/node_modules/express/lib/view.js:135:8) at tryRender (/Users/pass/node_modules/express/lib/application.js:640:10) at Function.render (/Users/pass/node_modules/express/lib/application.js:592:3) at ServerResponse.render (/Users/passh/node_modules/express/lib/response.js:1012:7)
試したこと
async/awaitなどが必要なのかなと考え、似たようなことを解決しようとしているサイトをみてみましたが、javascriptの経験が浅く、修正方法がわかりませんでした。
以下のようにすると、/selectに行こうとしたときに、止まって先に進めなくなってしまいます。
javascript
1app.post('/select', (req, res) => { 2 ( async () => { 3 await connection.query( 4 'SELECT date, temperature, humidity FROM data WHERE device = ? ORDER BY date ASC;', 5 [req.body.device], 6 (error_graph, results_graph) => { 7 console.log(results_graph); 8 9 connection.query( 10 'SELECT * FROM data where date=(select max(date) from data where device = ?);', 11 [req.body.device], 12 (error_new, results_new) => { 13 console.log(results_new); 14 res.render('index.ejs', {items: results_graph, news: results_new}); 15 } 16 ); 17 } 18 ); 19 }); 20});
よろしくお願いします。
※編集・追記依頼をいただきました
SyntaxError: Unexpected token ')' in /Users/pass/views/index.ejs while compiling ejs
質問時に提示した上記のエラーに関しては、
index.ejs内で「new」を使用していたのが原因でした。
「new」の使用をやめ、その他のエラーを修正したところ、acync/awaitを用いて要件を実現することができました!
ありがとうございます。
回答1件
あなたの回答
tips
プレビュー