teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

6

タグの追加

2020/04/26 06:24

投稿

HoroHoro0316
HoroHoro0316

スコア8

title CHANGED
File without changes
body CHANGED
File without changes

5

タグの追加

2020/04/26 06:23

投稿

HoroHoro0316
HoroHoro0316

スコア8

title CHANGED
File without changes
body CHANGED
File without changes

4

文章訂正

2020/04/25 06:59

投稿

HoroHoro0316
HoroHoro0316

スコア8

title CHANGED
File without changes
body CHANGED
@@ -12,11 +12,11 @@
12
12
  これは正常に表示されます。
13
13
  ![top](a698ce21728f3b5237842730c2273d7e.png)
14
14
 
15
- 下記に`sqlSample`へのリンクを書いてますので、押しますと、
15
+ 下記に`sqlSample.ejs`へのリンクを書いてますので、押しますと、
16
16
  ![sqlSample](027cb2afe531f3030a76850ca211ad2b.png)
17
17
 
18
18
  こうなります。
19
- 私なりに調べてみましたが、変数contentがDBを参照したデータを引っ張ってこれてないのだと思います。
19
+ 私なりに少し調べたのですが、変数contentがDBを参照したデータを引っ張ってこれてないのだと思います。
20
20
 
21
21
  本題
22
22
  ---

3

情報追加

2020/04/25 06:54

投稿

HoroHoro0316
HoroHoro0316

スコア8

title CHANGED
File without changes
body CHANGED
@@ -135,6 +135,37 @@
135
135
  app.use('/sqlSample', sqlSample);
136
136
  ```
137
137
 
138
+ - views/sqlSample.ejs
139
+ ```ejs
140
+ <!DOCTYPE html>
141
+ <html lang="ja">
142
+ <head>
143
+ <meta http-equiv="content-type" content="text/html; charset=UTF-8">
144
+ <title><%= title %></title>
145
+ <link rel='stylesheet' href='/stylesheets/style.css' />
146
+ </head>
147
+ <body>
148
+ <h1><%= title %></h1>
149
+ <div role="main">
150
+ <table>
151
+ <tr>
152
+ <th>製品コード</th>
153
+ <th>製品名</th>
154
+ <th>単価</th>
155
+ </tr>
156
+ <% content.forEach(function (value, key) { %>
157
+ <tr>
158
+ <td><%= value.ProductsCode %></td>
159
+ <td><%= value.ProductsName %></td>
160
+ <td><%= value.UnitPrice %></td>
161
+ </tr>
162
+ <% }); %>
163
+ </table>
164
+ </div>
165
+ </body>
166
+ </html>
167
+ ```
168
+
138
169
  ...すみません、この辺りにつきましては他サイトの情報を参考にして記述させていただきました。
139
170
  一応、そちらのURLもここに乗せます。
140
171
 

2

個人情報部分の修正

2020/04/25 06:43

投稿

HoroHoro0316
HoroHoro0316

スコア8

title CHANGED
File without changes
body CHANGED
@@ -7,7 +7,7 @@
7
7
  ---
8
8
 
9
9
  VScodeのターミナルで`npm start`してlocalhostを起動すると、
10
- !![npm start](9b8b8286ab8062c8b96f09223acd13b6.png)
10
+ ![npm start](e8861115199a890712abfe5225d1e157.png)
11
11
 
12
12
  これは正常に表示されます。
13
13
  ![top](a698ce21728f3b5237842730c2273d7e.png)

1

情報追加

2020/04/25 06:40

投稿

HoroHoro0316
HoroHoro0316

スコア8

title CHANGED
File without changes
body CHANGED
@@ -1,67 +1,92 @@
1
- ###はじめに
1
+ はじめに
2
+ ---
2
3
 
3
- `Node.js` + `Express` + `SQL Server`を使って、DBのものを一覧表示するページを作成したかったのですが、なにやらエラが出い、自分では原因が全く分からなかたため質問させ頂き
4
+ Node.js + Express + SQL Serverによってデータベースに接続しそこに登録されているデータを一覧表示するようなページを作成したかったのですが、上手くデタを引っ張っこれずに詰まっていました
4
5
 
6
+ 現状
5
- ###起きている問題
7
+ ---
6
8
 
7
- `npm start`によってlocalhostを起動させて表示すると、このような感じになってしまいます。
9
+ VScodeのターミナルで`npm start`てlocalhostを起動すると、
10
+ !![npm start](9b8b8286ab8062c8b96f09223acd13b6.png)
8
11
 
12
+ これは正常に表示されます。
9
- ![image](4d10d05138fa732eba69239a44d38f6a.png)
13
+ ![top](a698ce21728f3b5237842730c2273d7e.png)
10
14
 
11
- ※一部は故意塗りつぶます
15
+ 下記に`sqlSample`へのリンクを書いてますの、押しますと、
16
+ ![sqlSample](027cb2afe531f3030a76850ca211ad2b.png)
12
17
 
13
- ###現状
18
+ こうなります。
19
+ 私なりに調べてみましたが、変数contentがDBを参照したデータを引っ張ってこれてないのだと思います。
14
20
 
21
+ 本題
15
- 一応、現状はこのようになっております
22
+ ---
16
23
 
24
+ すみません、ここからが本題になります。
17
- ![image](913fdb4b271aad4c36e85cc8bd119db5.png)
25
+ フォルダ構成等を下記に示していきます。長くなりますが宜しくお願いします。
18
26
 
19
- 基本的には`Express generator`コマンドで生成した感じです。
27
+ どうなっているか
28
+ ---
20
29
 
30
+ - フォルダ構成
31
+ 基本的には`Express generator`コマンドによって生成してます。こんな感じです。
32
+ ![folder](f42334fc2467fc7785218c797627229f.png)
21
33
 
22
- `sqlSample.js`
34
+ - routes/index.js
23
35
  ```js
24
36
  var express = require('express');
25
37
  var router = express.Router();
26
38
 
39
+ /* GET home page. */
40
+ router.get('/', function(req, res, next) {
41
+ res.render('index', { title: 'Express' });
42
+ });
43
+
44
+ router.get('/sqlSample', function(req, res, next) {
45
+ res.render('sqlSample', { title: 'sqlSample', content: content});
46
+ });
47
+
48
+ module.exports = router;
49
+ ```
50
+
51
+ - routes/sqlSample.js
52
+
53
+ ```js
54
+ var express = require('express');
55
+ var router = express.Router();
56
+
27
57
  // Connectionを定義する
28
58
  var Connection = require('tedious').Connection;
29
59
 
30
60
  // SQLServerの接続定義を記載する。
31
61
  var config = {
32
- server: 'localhost', // IPアドレスかサーバー名を指定する。
62
+ server: 'localhost',
33
63
  authentication: {
34
64
  type: 'default',
35
65
  options: {
36
- userName: 'admin', // 接続ユーザー名を指定する。
37
- password: 'xxxxx'
66
+ userName: 'admin',
67
+ password: 'xxxxx' // 伏せてます
38
68
  }
39
69
  },
40
70
  options: {
41
71
  encrypt: true,
42
- database: 'Training01' // データベース名を指定する。
72
+ database: 'Training01'
43
73
  }
44
74
  };
45
75
 
46
76
  /* GET users listing. */
47
77
  router.get('/', function (req, res, next) {
48
78
  var connection = new Connection(config);
49
- var content = []; // DBからselectした結果を格納する変数
79
+ var content = [];
50
80
 
51
- // DB接続した際のイベントハンドラ
52
81
  connection.on('connect', function (err) {
53
82
  if (err) {
54
- // ERROR - SQL Serer connect error.
55
83
  console.log('SQL Serer connect error.(' + err + ')');
56
- // 終了
57
84
  process.exit();
58
85
  }
59
86
  console.log("connected");
60
87
  executeStatement();
61
88
  });
62
89
 
63
- // DB接続を終了した際のイベントハンドラ
64
- // DB接続を切断した後に画面を描写する
65
90
  connection.on('end', function () {
66
91
  console.log("disconnected");
67
92
  res.render('sqlSample', { title: '製品一覧', content: content });
@@ -69,17 +94,14 @@
69
94
 
70
95
  var Request = require('tedious').Request;
71
96
 
72
- // SQLを発行する関数
73
97
  function executeStatement() {
74
- // 発行するSQLを記載する
75
98
  request = new Request("SELECT * FROM ProductsMaster with (NOLOCK)", function (err) {
76
99
  if (err) {
77
100
  console.log(err);
78
101
  }
79
102
  });
80
103
 
81
- var result = {}; // SQLの結果を行ごとにオブジェクトに格納する。
104
+ var result = {};
82
- // SQLの行ごとに実行するイベントハンドラ
83
105
  request.on('row', function (columns) {
84
106
  columns.forEach(function (column) {
85
107
  if (column.value === null) {
@@ -92,14 +114,12 @@
92
114
  result = {};
93
115
  });
94
116
 
95
- // SQLのリクエスト完了時のイベントハンドラ。
96
- // コネクションをクローズしないとDBにいらないプロセスが残るので、コネクションをクローズする。
97
117
  request.on('requestCompleted', function () {
98
118
  console.log('requestCompleted');
99
119
  connection.close();
100
120
  });
101
121
 
102
- // DBへSQLを発行する。
122
+
103
123
  connection.execSql(request);
104
124
  }
105
125
  });
@@ -108,60 +128,27 @@
108
128
 
109
129
  ```
110
130
 
111
- `sqlSample.ejs`
131
+ - routes/app.js
112
- ```ejs
132
+ ```js
113
- <!DOCTYPE html>
114
- <html lang="ja">
115
- <head>
116
- <meta http-equiv="content-type" content="text/html; charset=UTF-8">
117
- <title><%= title %></title>
118
- <link rel='stylesheet' href='/stylesheets/style.css' />
133
+ var sqlSample = require('./routes/sqlSample');
119
- </head>
120
- <body>
121
- <h1><%= title %></h1>
122
- <div role="main">
123
- <table>
124
- <tr>
125
- <th>製品コード</th>
126
- <th>製品名</th>
127
- <th>単価</th>
128
- </tr>
129
- <% content.forEach(function (value, key) { %>
130
- <tr>
131
- <td><%= value.ProductsCode %></td>
132
- <td><%= value.ProductsName %></td>
133
- <td><%= value.UnitPrice %></td>
134
- </tr>
135
- <% }); %>
136
- </table>
137
- </div>
138
- </body>
139
- </html>
140
134
 
141
- ```
142
-
143
- `routes/app.js`
144
- ```
145
- const sqlSample = require('./routes/sqlSample');
146
-
147
135
  app.use('/sqlSample', sqlSample);
148
-
149
136
  ```
150
137
 
138
+ ...すみません、この辺りにつきましては他サイトの情報を参考にして記述させていただきました。
151
- ###参考にしたも
139
+ 一応、そちらURLもここに乗せます。
152
140
 
153
- - Node.js Expressフレームワークを使用してSQL Serverに接続する(ページ作成)
154
- `https://qiita.com/t_skri/items/2742dc7603c5c39156bf`
141
+ [Node.js Expressフレームワークを使用してSQL Serverに接続する(ページ作成)](https://qiita.com/t_skri/items/2742dc7603c5c39156bf#)
155
142
 
143
+ 環境
144
+ ---
145
+ - Windows10 Home 64bit
156
- - Node.js Expressフレームワークを使用してSQL Serverに接続する(準備作業)
146
+ - Microsoft SQL Server 2019
157
- `https://qiita.com/t_skri/items/8d69c423042e310434d0`
147
+ - Node.js - v12.16.1
148
+ - npm - 6.13.4
149
+ - Express - 4.16.1
158
150
 
159
- すみません、一応、私が参考にしたものも記載しておきます。
160
-
161
-
162
- ###最後に
151
+ 最後に
163
-
152
+ ---
164
- 上手情報載せられているか不安ですが、質問に答えて頂けると非常に助かります。
153
+ ご回答ださ方にはご面倒おけいたしますが、答えくださると助かります。
165
- 情報等が足りてなかった場合はお教えしていただけると助かります。
166
-
167
- お手数おかけしますが宜しくお願いします。
154
+ お手数おかけします。よろしくお願いいたします。