常連

### 実現したいこと

- [ ] Lambda上でnode.js + expressを動かしたい（API gatewayを使って関数を実行する想定です）

### 前提

Lambda上でnode.js + expressを動かしたいのですが、`Runtime.ImportModuleError`というLambda上でテストをするとエラーが発生してしまい、動かすことができません。
アプリケーションの機能としては"Hello World"と出力するシンプルなものです。

### 発生している問題・エラーメッセージ
Lambda上でテスト実行時
```
{
  "errorType": "Runtime.ImportModuleError",
  "errorMessage": "Error: Cannot find module 'index'\nRequire stack:\n- /var/runtime/index.mjs",
  "trace": [
    "Runtime.ImportModuleError: Error: Cannot find module 'index'",
    "Require stack:",
    "- /var/runtime/index.mjs",
    "    at _loadUserApp (file:///var/runtime/index.mjs:997:17)",
    "    at async UserFunction.js.module.exports.load (file:///var/runtime/index.mjs:1032:21)",
    "    at async start (file:///var/runtime/index.mjs:1195:23)",
    "    at async file:///var/runtime/index.mjs:1201:1"
  ]
}
```

### 該当のソースコード
index.js
```js
const express = require("express");
const app = express();

app.get("/", (req, res) => {
  res.send("Hello World");
});

exports.handler = (event, context, callback) => {
  const server = app.listen(3000, () => {
    console.log("Server started");
  });
};

```
ローカルで作成したアプリケーションをzipにしてアップロードする形式を取っています。
ローカルで行ったことは以下です。
- 作業ディレクトリを作成
- `npm init -y`
- `npm install express`
- `node_modules` ディレクトリを含めて全てzip化

これをLambdaコンソールから上記のzipを取り込み、テストを実行しています。（テストはデフォルトのままです）

### 試したこと

node_modulesを外したりしましたが、同様にエラーでした。

### 補足情報（FW/ツールのバージョンなど）

node v16.17.1
express ^4.18.2


Lambda上でnode.js + expressを動かしたい

### 前提・実現したいこと

ここに質問の内容を詳しく書いてください。
https://reffect.co.jp/node-js/express-js-connect-mysql
上のサイトでmodemonをインストールし、express.jsからMySQLへの接続をしていました。
npx modemon app.js　ターミナルで左のコマンドを実行したら以下のエラーメッセージが発生しました。

### 発生している問題・エラーメッセージ

```
//ターミナル
  errno: 'ECONNREFUSED',
  code: 'ECONNREFUSED',
  syscall: 'connect',
  address: '127.0.0.1',
  port: 3306,
  fatal: true
```

### 該当のソースコード

```ここに言語名を入力
//app.js
const express = require('express')
const app = express()
const port = 3000;

const mysql = require('mysql');

const con = mysql.createConnection({
	host: 'localhost',
	user: 'root',
	password: '',
});

con.connect(function(err) {
	if (err) throw err;
	console.log('Connected');
});


app.get('/', (req,res) =>{
  res.send('hello world')
})

app.listen(port, () => console.log(`exaple app listening on port ${port}`))


```

### 試したこと

npm installをしてみましたがどう解決するのかわかりません。
教えて下さいお願いいたします

express.jsからMySQLへの接続でError: connect ECONNREFUSED 127.0.0.1:3306がわかないです

### 実現したいこと

- [ ] Webアプリにおいて、外部サービスのAPIに用いるトークンを安全に保管する

### 前提

現在、Node.js + Express + MySQL（Sequelizeを使用）でWebアプリを作成しています。
また、環境はパブリッククラウド（Azure）となります。
Webアプリの処理の中で、外部のサービスから情報を取ってくるため、そのサービスのAPIを叩くのですが、このトークンの悪用を防止したいです。

### 発生している問題・エラーメッセージ


### 該当のソースコード


### 試したこと

DBに保存する、ファイルに書き込んで保存するの2つを検討しましたが、いずれも不正アクセスで読み取られた場合どうしようもない、という結論になりました。
パスワードであれば暗号化して保存してしまえば良いのですが、トークンの場合は使用する際復号する必要があるためです。

Web開発自体初めてでして、情報が足りていない等ありましたらお手数ですがご指摘いただけると幸いです。
みなさんの知恵をお貸しください。
よろしくお願いいたします。

Webアプリにおけるトークンの安全な管理

### 前提

reactでtodoリストを作ろうとしています。
そこでhtmlないでのscriptのurlが見つからないというエラーメッセージが発生しました。

### 実現したいこと


net::ERR_ABORTED 404 (Not Found)というエラー文章を解決し、コンポーネントをレンダリングできる状態にしたい
### 発生している問題・エラーメッセージ

```
net::ERR_ABORTED 404 (Not Found)が解決できない

```

### 該当のソースコード

```html
<html>
<head>
    <meta charset="UTF-8">

    <title>Todo</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    
</head>
<body>
    <h1>こんにちは</h1>
    <div id="root"></div>
    
    <script type="module" src="../../dest/index.js"></script>
    
    

</body>
</html>
```
```js
const express= require("express");
const app = express();
const PORT = 3000;

// const userRouter =require("./routes/user");




app.use(express.static("public/js"))
app.get("/",(req,res) =>{
    res.send("ユーザーです");
});
// app.get('*', (req, res) => res.send('ページは存在しません。'));

// app.use("/user",userRouter); ///user共通で使う　それ以外userrouterに任せる

app.listen(PORT, ()=> console.log("かいし"))
```
```js
'use strict';
import 'core-js/stable';
import 'regenerator-runtime/runtime';



require('core-js/stable');

require('regenerator-runtime/runtime');

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _App = require('./App.js');

var _App2 = _interopRequireDefault(_App);

var _client = require('react-dom/client');

var ReactDOM = _interopRequireWildcard(_client);

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

console.log('test');


var root = ReactDOM.createRoot(document.getElementById("root"));

root.render(_react2.default.createElement(_App2.default, null));
```
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-12-31/16cecb69-7399-48c1-b40b-97cb4fe5fffb.png)
![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-12-31/32c30684-e16f-4c62-bb48-cb935722d8e3.png)

![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-12-31/20b16a40-61a5-4c34-bb62-4310fc5307c5.png)
### 試したこと

ここに問題に対して試したことを記載してください。

### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

net::ERR_ABORTED 404 (Not Found)が解決できない

現在、expressを用いて簡単なファイルアップロード機能の実装をしております。複数のファイルをformDataを用いて送信し、node.jsのmulterで受信するというものです。

```ここに言語を入力
var upload = multer({ dest: 'uploaded/' });
router.post('/', upload.array('files[]'), function(req, res){
  var filepath = req.body.filepath;
  var files = req.files;
  
  for(var i=0; i<filepath.length; i++){
    console.log(filepath[i]);
    console.log(files[i]);
  }
  
  res.send("ok");
});
```

このlengthに対して「Cannot read property 'length' of undefined」がブラウザで表示されます。しかしサーバサイドではファイル数であるlengthが数字として確認できており正常に動いております。

なぜブラウザ側ではエラー表示されてしまうのでしょうか？
わかる方よろしくお願いします。

なぜ「Cannot read property 'length' of undefined」が表示されるかわからない

### パッケージをインストールしたい
現在、node.js、expressを使って学習を進めているなかで新しいパッケージを導入しようとしていました。

```
npm install express-session --save
```
パッケージを導入しようとするのですがエラーがでます。
### 発生している問題・エラーメッセージ

```
npm ERR! code ENOTFOUND
npm ERR! errno ENOTFOUND
npm ERR! network request to https://registry.npmjs.org/express-session failed, reason: getaddrinfo ENOTFOUND registry.npmjs.org
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly.  See: 'npm help config'

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\aero\AppData\Roaming\npm-cache\_logs\2020-03-05T06_19_31_757Z-debug.log
```

### 試したこと

```
npm config set registry http://registry.npmjs.org/
```
下記サイトを参考に上記コマンドを入力しても変化なしでした。。
npmのconfigを触ったらいいのかなとおもっているんですがあまり分かっていないです。。
[npm installで失敗したときの5つの解決方法](https://sugimotonote.com/2017/10/31/npm-install-error/)


### 補足情報（FW/ツールのバージョンなど）

windows10、
nodeのversion:v12.16.1

npm install をするとパッケージによってエラーがでる

##前提・実現したいこと
ドットインストールのExpressコース（2014年に更新終了・アーカイブ済）で、Node.jsのExpressフレームワークを用いたブログの作成をしています。

記事の更新・記事の削除を実装したいのですが、コースのやり方に従うと、
「Cannot POST /posts/0」「404 (Not Found)」というエラーが出てしまいます。

HTTPのフォームで更新・削除の情報を送る時に、POSTメソッドをhidden属性でput(更新)、delete(削除)メソッドに変える処理を行って実装しているのですが、うまくput,deleteととして認識されていないせいでエラーになっているのではないかと思い、解決方法を質問致します。

よろしくお願い致します。


##現在のファイル構成
```bash
├── app.js
├── node_modules
├── package-lock.json
├── package.json
├── routes
│   └── post.js　//全てのルーティング処理
└── views
    ├── partials
    │   ├── footer.ejs
    │   └── header.ejs
    └── posts
        ├── edit.ejs //編集ページ
        ├── index.ejs //記事タイトル一覧ページ（編集・削除ボタン付き）
        ├── new.ejs
        └── show.ejs
```

##現在のコード

・app.js【メイン処理】
```javascript
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const post = require('./routes/post')


app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');

//middleware
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({extended:true}));


//記事一覧ページ
app.get('/',post.index);
//記事詳細ページ
app.get('/posts/:id([0-9]+)',post.show);
//新規作成ページ
app.get('/posts/new',post.new);
//新規作成した記事の投稿
app.post('/posts/create',post.create);
//更新のための編集フォーム表示
app.get('/posts/:id/edit',post.edit);
//更新した記事の投稿【PUTメソッド】
app.put('/posts/:id/',post.update);
//記事の削除【DELETEメソッド】
app.delete('/posts/:id/',post.destroy);


app.listen(3100, () => {
  console.log('server is up on port 3100')
});


```

・post.js【ルーティング処理】
```javascript
var posts = [
  {title: 'title0', body: 'body0'},
  {title: 'title1', body: 'body1'},
  {title: 'title2', body: 'body2'},
]

exports.index = function(req,res){
  res.render('posts/index', {posts: posts});
};
exports.show = function(req,res){
  res.render('posts/show', {post: posts[req.params.id]});
};
exports.new = function(req,res){
  res.render('posts/new');
};
//更新のための編集フォーム表示
exports.edit = function(req,res){
  res.render('posts/edit', {post:posts[req.params.id], id:req.params.id});
};
//更新した記事の投稿【PUTメソッド】
exports.update = function(req,res){
 posts[req.body.id]={
   title: req.body.title,
   body: req.body.body
 }
 res.redirect('/');
};
//記事の削除【DELETEメソッド】
exports.destroy = function(req,res){
 posts.splice(req.body.id, 1);
 res.redirect('/');
};

exports.create = function(req, res){
  var post = {
      title: req.body.title,
      body: req.body.body
  };
  posts.push(post);
  res.redirect('/');
};
```

・index.ejs【記事タイトル一覧＆編集・削除ボタン】
```ejs
<%- include ('../partials/header'); %>
<h1>Posts</h1>
<ul>
<% for (var i=0; i<posts.length; i++){ %>
<li>
    <a href="/posts/<%= i %>"><%= posts[i].title %></a>
    <a href="/posts/<%= i %>/edit">[Edit]</a>

//HTMLにはdeleteメソッドがないため、見せかけのコードで代用
    <form method="post" action="/posts/<%= i %>">
//以下の一文を入れるとdeleteメソッドとして認識されるはず
        <input type="hidden" name="_method" value="delete">

        <input type="hidden" name="id" value="<%= i %>">
        <input type="submit" value="削除">
    </form>
</li>
<% } %>
</ul>
<p><a href="/posts/new">Add new</a></p>
<%- include ('../partials/footer'); %>
```

・edit.ejs【編集ページ】
```ejs
<%- include ('../partials/header'); %>
<h1>Edit</h1>
//HTMLにはputメソッドがないため、見せかけのコードで代用
<form method="post" action="/posts/<%= id %>">
   <input type="text" name="title" value="<%= post.title %>">
   <input type="text" name="body" value="<%= post.body %>">

//以下の一文を入れるとputメソッドとして認識されるはず
   <input type="hidden" name="_method" value="put">

   <input type="hidden" name="id" value="<%= id %>">
   <input type="submit" value="更新">
</form>

<p><a href="/">Back to Top</a></p>
<%- include ('../partials/footer'); %>
```

##問題点
「title0」の「削除」ボタン・「更新」ボタンを押すと、
Cannot POST /posts/0
404 (Not Found)

というエラーが出てしまう

##試したこと
「Cannot POST」と書かれているので、PUT,DELETEとして認識して欲しかったフォームの送信が、POSTとして認識されたままなのではないか？と疑っています。

input type="hidden" name="_method"を使ったPUT,DELETEの実装方法は古くなってしまっているのでしょうか？

2015年の記事[『[html/css] httpのフォームでDELETEやPUTのメソッドを送る方法』](http://portaltan.hatenablog.com/entry/2015/07/22/122031)では有効だったようです。

こちらの記事（[『PUTやDELETEのHTTPリクエストを送信する方法色々』](https://kapiecii.hatenablog.com/entry/2019/11/23/100000)）では、「HTMLのformで”_method”として指定する方法」は実装できず、「ブラウザのバージョンが上がったことにより、動作しなくなったのかもしれません」と書かれていました。

HTMLでPUT, DELETEメソッドを送信する方法

### 実現したいこと。
- [ ]Javascript 非同期処理の中でsubmit処理を中断させたい

### 前提
jspページで従業員登録や更新、削除ができる画面を作成中です。
従業員番号がすでに登録されている場合フォーム送信を中断し
エラー文を表示する機能を実装したのですがエラー文が一瞬表示された後
画面遷移が中断されず遷移してしまいます。

非同期処理の中で画面遷移を阻止する方法知りたいです。


### 発生している問題・エラーメッセージ
event.preventDefault()で画面遷移を防ぐはずが中断されず遷移してしまう。
### 該当のソースコード

```javascript

//入力されたEMPNOを送信し重複してないかを判定する
	return new Promise(resolve =>{

		fetch('http://localhost:3000/judgeEmpNo',{
			method: 'POST',
	  		headers: { 'Content-Type': 'application/json' },
	  		signal:signal,
                        //ここで編集中の従業員番号を送信
	  		body: JSON.stringify({empNo:empNo})
		})
		.then(response => response.json())
		.then(data =>{
			console.log(data);

			if(!data.length <= 0){
			//重複しているかどうかを従業員IDで判断
				if(!(Number(data[0].empId) == Number(empId))){
                //ここで画面遷移を中断させたい
                event.preventDefault();
					error.textContent='そのempNoはすでに登録されています';
				}else{
					error.textContent='';
					resolve();
				}
			}else{
				error.textContent='';
				resolve();
			}
		})
//node express側

//empNoが重複してないかチェックする

app.post('/judgeEmpNo',(req,res)=>{
	console.log('from / judgeEmpNo');
	let empNo = req.body.empNo;
	empNo = Number(empNo);
	connection.query(`select empId from Employee where empNo=${empNo}`,(err,result,field)=>{
		if (err) throw err;
		console.log(result);
		res.json(result);
	});
	
});

```

### 試したこと

送信ボタンの要素にdisable=Trueをして無効化しようとしたが失敗した
フォームのonSubmitで関数を実行し戻り値をfalseにして無効化しようとしたが失敗した。


### 補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。
