質問編集履歴
10
getMelodyの修正
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
### 実現したいこと
|
|
2
|
-
`fetch`を使用してサーバサイドのエンドポイント`/getMelody`から，`melody.txt`の内容を非同期で取得したいと考えております．
|
|
2
|
+
~~`fetch`を使用してサーバサイドのエンドポイント`/getMelody`から，`melody.txt`の内容を非同期で取得したいと考えております．~~
|
|
3
|
+
`fetch`を使用してサーバサイドのエンドポイント`/docs`から，`melody.txt`の内容を非同期で取得したいと考えております．
|
|
3
4
|
サーバサイドのコードを`server.js`に記述しています．
|
|
4
5
|
ひとまずはページ上の`Run`ボタンを押下した際に，この取得を行い，デベロッパツールのコンソールに`melody.txt`の内容を出力しようと考えております．
|
|
5
6
|
|
9
getMelodyをdocsに変更
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -54,7 +54,12 @@
|
|
|
54
54
|
また他に効率的なファイルの読み取り方法はあったりしますでしょうか．
|
|
55
55
|
|
|
56
56
|
### 追記1
|
|
57
|
+
##### "/getMelody"のとき
|
|
57
58
|
|
|
59
|
+
|
|
60
|
+
##### "/docs"のとき
|
|
61
|
+
|
|
62
|
+
|
|
58
63
|
|
|
59
64
|
### 追記2
|
|
60
65
|
##### express install 前
|
|
@@ -165,4 +170,30 @@
|
|
|
165
170
|
https://kinsta.com/jp/knowledgebase/install-express/
|
|
166
171
|
この記事を見て，`npm install -g express-generator`を行ったので`-g`のものも反応してしまっているかもしれません
|
|
167
172
|
これは不都合でしょうか？
|
|
168
|
-
`node server.js`を行った後`http-server`を実行しましたが，エラーは同じものが出力されました．
|
|
173
|
+
~~`node server.js`を行った後`http-server`を実行しましたが，エラーは同じものが出力されました．~~
|
|
174
|
+
`/getMelody`を`/docs/melody.txt`に変更したところ，404エラーはなくなりました．
|
|
175
|
+
しかし，`melody.txt`の中身の出力を期待しているのに対して，異なったものが出力されてしまいました．
|
|
176
|
+
|
|
177
|
+
##### getMelodyを変更した後のコンソール(冒頭のみ抜粋)
|
|
178
|
+
```
|
|
179
|
+
Melody: <!doctype html>
|
|
180
|
+
<html>
|
|
181
|
+
<head>
|
|
182
|
+
<meta charset="utf-8">
|
|
183
|
+
<meta name="viewport" content="width=device-width">
|
|
184
|
+
<title>Index of /docs/</title>
|
|
185
|
+
<style type="text/css">i.icon { display: block; height: 16px; width: 16px; }
|
|
186
|
+
table tr { white-space: nowrap; }
|
|
187
|
+
td.perms {}
|
|
188
|
+
td.file-size { text-align: right; padding-left: 1em; }
|
|
189
|
+
td.display-name { padding-left: 1em; }
|
|
190
|
+
i.icon-_blank {
|
|
191
|
+
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAWBJREFUeNqEUj1LxEAQnd1MVA4lyIEWx6UIKEGUExGsbC3tLfwJ/hT/g7VlCnubqxXBwg/Q4hQP/LhKL5nZuBsvuGfW5MGyuzM7jzdvVuR5DgYnZ+f99ai7Vt5t9K9unu4HLweI3qWYxI6PDosdy0fhcntxO44CcOBzPA7mfEyuHwf7ntQk4jcnywOxIlfxOCNYaLVgb6cXbkTdhJXq2SIlNMC0xIqhHczDbi8OVzpLSUa0WebRfmigLHqj1EcPZnwf7gbDIrYVRyEinurj6jTBHyI7pqVrFQqEbt6TEmZ9v1NRAJNC1xTYxIQh/MmRUlmFQE3qWOW1nqB2TWk1/3tgJV0waVvkFIEeZbHq4ElyKzAmEXOx6gnEVJuWBzmkRJBRPYGZBDsVaOlpSgVJE2yVaAe/0kx/3azBRO0VsbMFZE3CDSZKweZfYIVg+DZ6v7h9GDVOwZPw/PoxKu/fAgwALbDAXf7DdQkAAAAASUVORK5CYII=");
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
i.icon-_page {
|
|
195
|
+
```
|
|
196
|
+
|
|
197
|
+
```txt:melody.txt
|
|
198
|
+
play(60, 0.500000)
|
|
199
|
+
```
|
8
画像差し替え
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -54,8 +54,7 @@
|
|
|
54
54
|
また他に効率的なファイルの読み取り方法はあったりしますでしょうか．
|
|
55
55
|
|
|
56
56
|
### 追記1
|
|
57
|
-
|
|
58
|
-
|
|
59
58
|
|
|
60
59
|
### 追記2
|
|
61
60
|
##### express install 前
|
7
express 確認
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -58,6 +58,7 @@
|
|
|
58
58
|
|
|
59
59
|
|
|
60
60
|
### 追記2
|
|
61
|
+
##### express install 前
|
|
61
62
|
```bash
|
|
62
63
|
VisualPMusic % npm --version
|
|
63
64
|
10.1.0
|
|
@@ -89,12 +90,12 @@
|
|
|
89
90
|
|
|
90
91
|
Node.js v20.8.0
|
|
91
92
|
```
|
|
92
|
-
|
|
93
|
+
##### nodeのバージョン確認
|
|
93
94
|
```bash
|
|
94
95
|
VisualPMusic % Node --version
|
|
95
96
|
v20.8.0
|
|
96
97
|
```
|
|
97
|
-
|
|
98
|
+
##### npm install express 結果
|
|
98
99
|
```bash
|
|
99
100
|
VisualPMusic % npm install express
|
|
100
101
|
|
|
@@ -104,6 +105,7 @@
|
|
|
104
105
|
run `npm fund` for details
|
|
105
106
|
```
|
|
106
107
|
|
|
108
|
+
##### npm init 結果
|
|
107
109
|
```bash
|
|
108
110
|
VisualPMusic % npm init
|
|
109
111
|
This utility will walk you through creating a package.json file.
|
|
@@ -149,3 +151,19 @@
|
|
|
149
151
|
VisualPMusic % express --version
|
|
150
152
|
4.16.1
|
|
151
153
|
```
|
|
154
|
+
|
|
155
|
+
##### express install 後
|
|
156
|
+
```bash
|
|
157
|
+
VisualPMusic % express --version
|
|
158
|
+
4.16.1
|
|
159
|
+
VisualPMusic % npm ls | grep express
|
|
160
|
+
└── express@4.18.2
|
|
161
|
+
VisualPMusic % npm ls -g | grep express
|
|
162
|
+
├── express-generator@4.16.1
|
|
163
|
+
VisualPMusic % node server.js
|
|
164
|
+
Server is running on http://localhost:8080
|
|
165
|
+
```
|
|
166
|
+
https://kinsta.com/jp/knowledgebase/install-express/
|
|
167
|
+
この記事を見て，`npm install -g express-generator`を行ったので`-g`のものも反応してしまっているかもしれません
|
|
168
|
+
これは不都合でしょうか？
|
|
169
|
+
`node server.js`を行った後`http-server`を実行しましたが，エラーは同じものが出力されました．
|
6
npm init, express --versionの追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -103,3 +103,49 @@
|
|
|
103
103
|
11 packages are looking for funding
|
|
104
104
|
run `npm fund` for details
|
|
105
105
|
```
|
|
106
|
+
|
|
107
|
+
```bash
|
|
108
|
+
VisualPMusic % npm init
|
|
109
|
+
This utility will walk you through creating a package.json file.
|
|
110
|
+
It only covers the most common items, and tries to guess sensible defaults.
|
|
111
|
+
|
|
112
|
+
See `npm help init` for definitive documentation on these fields
|
|
113
|
+
and exactly what they do.
|
|
114
|
+
|
|
115
|
+
Use `npm install <pkg>` afterwards to install a package and
|
|
116
|
+
save it as a dependency in the package.json file.
|
|
117
|
+
|
|
118
|
+
Press ^C at any time to quit.
|
|
119
|
+
package name: (visualpmusic)
|
|
120
|
+
version: (1.0.0)
|
|
121
|
+
entry point: (script.js)
|
|
122
|
+
git repository:
|
|
123
|
+
keywords:
|
|
124
|
+
author:
|
|
125
|
+
license: (ISC)
|
|
126
|
+
About to write to /VisualPMusic/package.json:
|
|
127
|
+
|
|
128
|
+
{
|
|
129
|
+
"dependencies": {
|
|
130
|
+
"express": "^4.18.2"
|
|
131
|
+
},
|
|
132
|
+
"scripts": {
|
|
133
|
+
"start": "node server.js"
|
|
134
|
+
},
|
|
135
|
+
"name": "visualpmusic",
|
|
136
|
+
"description": "## Purpose PMusicをビジュアルプログラミングにする．",
|
|
137
|
+
"version": "1.0.0",
|
|
138
|
+
"main": "script.js",
|
|
139
|
+
"directories": {
|
|
140
|
+
"doc": "docs"
|
|
141
|
+
},
|
|
142
|
+
"devDependencies": {},
|
|
143
|
+
"author": "",
|
|
144
|
+
"license": "ISC"
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
|
|
148
|
+
Is this OK? (yes)
|
|
149
|
+
VisualPMusic % express --version
|
|
150
|
+
4.16.1
|
|
151
|
+
```
|
5
Nodeのバージョン確認
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
|
|
59
59
|
|
|
60
60
|
### 追記2
|
|
61
|
-
```
|
|
61
|
+
```bash
|
|
62
62
|
VisualPMusic % npm --version
|
|
63
63
|
10.1.0
|
|
64
64
|
VisualPMusic % express --version
|
|
@@ -89,6 +89,12 @@
|
|
|
89
89
|
|
|
90
90
|
Node.js v20.8.0
|
|
91
91
|
```
|
|
92
|
+
|
|
93
|
+
```bash
|
|
94
|
+
VisualPMusic % Node --version
|
|
95
|
+
v20.8.0
|
|
96
|
+
```
|
|
97
|
+
|
|
92
98
|
```bash
|
|
93
99
|
VisualPMusic % npm install express
|
|
94
100
|
|
4
npm install
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -89,3 +89,11 @@
|
|
|
89
89
|
|
|
90
90
|
Node.js v20.8.0
|
|
91
91
|
```
|
|
92
|
+
```bash
|
|
93
|
+
VisualPMusic % npm install express
|
|
94
|
+
|
|
95
|
+
added 62 packages in 996ms
|
|
96
|
+
|
|
97
|
+
11 packages are looking for funding
|
|
98
|
+
run `npm fund` for details
|
|
99
|
+
```
|
3
ネットワークタブの画像追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -55,6 +55,7 @@
|
|
|
55
55
|
|
|
56
56
|
### 追記1
|
|
57
57
|
|
|
58
|
+
|
|
58
59
|
|
|
59
60
|
### 追記2
|
|
60
61
|
```
|
2
コマンドの実行結果を追記
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -53,6 +53,38 @@
|
|
|
53
53
|
他にどのようなことを確認すればよろしいでしょうか，
|
|
54
54
|
また他に効率的なファイルの読み取り方法はあったりしますでしょうか．
|
|
55
55
|
|
|
56
|
-
### 追記
|
|
56
|
+
### 追記1
|
|
57
57
|
|
|
58
58
|
|
|
59
|
+
### 追記2
|
|
60
|
+
```
|
|
61
|
+
VisualPMusic % npm --version
|
|
62
|
+
10.1.0
|
|
63
|
+
VisualPMusic % express --version
|
|
64
|
+
zsh: command not found: express
|
|
65
|
+
VisualPMusic % npm ls | grep express
|
|
66
|
+
VisualPMusic % npm ls -g | grep express
|
|
67
|
+
VisualPMusic % node server.js
|
|
68
|
+
node:internal/modules/cjs/loader:1051
|
|
69
|
+
throw err;
|
|
70
|
+
^
|
|
71
|
+
|
|
72
|
+
Error: Cannot find module 'express'
|
|
73
|
+
Require stack:
|
|
74
|
+
- VisualPMusic/server.js
|
|
75
|
+
at Module._resolveFilename (node:internal/modules/cjs/loader:1048:15)
|
|
76
|
+
at Module._load (node:internal/modules/cjs/loader:901:27)
|
|
77
|
+
at Module.require (node:internal/modules/cjs/loader:1115:19)
|
|
78
|
+
at require (node:internal/modules/helpers:130:18)
|
|
79
|
+
at Object.<anonymous> (VisualPMusic/server.js:1:17)
|
|
80
|
+
at Module._compile (node:internal/modules/cjs/loader:1241:14)
|
|
81
|
+
at Module._extensions..js (node:internal/modules/cjs/loader:1295:10)
|
|
82
|
+
at Module.load (node:internal/modules/cjs/loader:1091:32)
|
|
83
|
+
at Module._load (node:internal/modules/cjs/loader:938:12)
|
|
84
|
+
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12) {
|
|
85
|
+
code: 'MODULE_NOT_FOUND',
|
|
86
|
+
requireStack: [ 'VisualPMusic/server.js' ]
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
Node.js v20.8.0
|
|
90
|
+
```
|
1
デベロッパツールのネットワークタブ画像を追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -53,5 +53,6 @@
|
|
|
53
53
|
他にどのようなことを確認すればよろしいでしょうか，
|
|
54
54
|
また他に効率的なファイルの読み取り方法はあったりしますでしょうか．
|
|
55
55
|
|
|
56
|
+
### 追記
|
|
57
|
+
|
|
56
58
|
|
|
57
|
-
|