Node.js関連のことを調べてみた2020年06月21日

ESLint v7.3.0

前 [v7.2.0](https://qiita.com/mysticatea/items/9215050e4546c1e2d486) | 次 (2020-07-04 JST)

ESLint v7.3.0 has been released: https://t.co/cGcdAuYc9s

— ESLint (@geteslint) June 19, 2020

ESLint `7.3.0` がリリースされ

NTTPCの激安VPS「Indigo」のAPIで遊んでみる

#はじめに
NTTPCの激安VPS「[Indigo](https://web.arena.ne.jp/indigo/)」を使い始めたのですが、APIが用意されているということで遊んでみました。

#やりたかったこと
基本的には自宅から各種実験用にVPSを使っていて、自宅からSSHでVPS上のインスタンスをに接続しています。
[Indigo](https://web.arena.ne.jp/indigo/)には、ファイアウォールが標準でついているので、

|方向|プロトコル|ポート|IP|
|:—|———|——|–:|
|IN|TCP|22(SSH)|自宅IPアドレス|

ってな具合にやりたいわけですが、自宅IPアドレスは固定じゃないDDNS運用なので、IPアドレスが変更された場合にFWでDENYされちゃいます。

ということで、自宅IPアドレスが変わった場合にAPIでごにょごにょしてFWのルールを変更してしまいたいというわけです。

#前提条件
以下の内容は、NTT PC コミュニケーションズのVPS「Indigo」上の、
– KVM Instance 1 C

[Alexa]APLのカスタムパッケージの作成・インポートをする

# APLのimportを使い、複数画面間の部品共通化をしたい
Alexaスキル開発をしていると、APLで複数画面間で共通な画面要素を使いたいという場面が出てきます。
例えば、一つのAPLドキュメントにて独自のボタンデザインをLayoutsで定義しているが、これをスキル内の全画面共通で使用したい、というような具合です。
カスタムパッケージを作成し、APLドキュメントの”import”を使ってインポートすることでこれを実現することができます。
以下、APLでのカスタムパッケージ作成・インポートを実現するために実際にやってみた内容の記録です。

# やること
以下を実施します。

1. カスタムパッケージの作成、配置
2. APLドキュメントファイルの作成
3. APLデータソースファイルの作成
4. ハンドラにてAPL描写処理を追加

## 1. カスタムパッケージの作成、配置
カスタムパッケージを作成します。
公式のリファレンスを見てもフォーマットに関する具体的な記載がないので書き方が不明でしたが、以下の記事に記載されているJSONの形式でうまくいきました。
(記事内ではこれではうまく

log.ioでログをブラウザでリアルタイムモニタリングする

「log.io」を使ってログを集約し、ブラウザからリアルタイムにモニタリングしてみます。

log.io
　http://logio.org/

log.ioは、TCPでログを受信するとともに、ブラウザからログを参照することができます。
Webサーバの機能が付いているので楽ちんなのと、WebSocketを使っているので、リアルタイムにログが出力されてきます。
それから、TCPでログを受信するので、AndroidやArduinoやNode.jsなど、様々なプラットフォームからのログを集約することができそうです。

# log.ioのセットアップ

npmでモジュール化されています。

> npm install -g log.io
> mkdir ~/.log.io
> vi ~/.log.io/server.json
> log.io-server

server.jsonはこんな感じです。

“`json;server.json
{
“messageServer”: {
“port”: 6689,
“host”: “【起動させるマシンのIPアドレス】”

Node.jsでSlack Slashコマンドアプリを作る

Slackのslashコマンドから動かせるシンプルなメモアプリケーションを作ってみます。
超初心者向けです。

## 完成イメージ
slackから `/note hoge`と打つと、`hoge`を記録してくれる。

## 設計
– ローカルサーバでnodeアプリケーション(express)を起動する。
– ngrokでローカルサーバを外部に公開
– slack slashコマンドを作成し、送信先に公開用URLを指定

以上です。お試し版なので、本番環境へのデプロイやDB接続など面倒くさいことはしません。

## expressアプリを作成
Udemyで速習しました。(https://www.udemy.com/course/nodejs-part2-express/)
express環境の構築は割愛します。
index.jsに下記を記載。

“`javascript:index.js

const express = require(“express”);
const app = express();
const port = process.env.PORT || 30

Node.jsのCLIツールでURLを既定のブラウザで開く

[open](https://www.npmjs.com/package/open) パッケージを使用すると、クロスプラットフォームでその辺の処理をよしなにやってくれる。
実行時にHTTPサーバを立てたり、ライセンスなどを表示したりするようなCLIツールで便利かもしれない。

## Install

“`sh
yarn add open
“`

## Usage

非常にシンプル。

“`js
const open = require(‘open’);

open(‘https://qiita.com/’);
“`

async/await を使用した実用的な例などは [README](https://www.npmjs.com/package/open) を確認されたい。

なお、従来は[opn](https://www.npmjs.com/package/opn)という名称だったものがrenameされたらしい。

socket ioでビデオ通話+ユーザー名表示

# Zoomにあるようなビデオ映像に名前を入れて欲しい…
以前に作成した[socket.io にセッション情報を渡す](https://qiita.com/4201tosiyuki/items/80ee553ac42eeb323859)と[Express+MySQLでログインする](https://qiita.com/4201tosiyuki/items/7ece29ed48b49efcbe59)の続編です。

改めて、このプログラムを書いた経緯です。

1. 自社ネットワーク内でビデオ通話をしたいという相談をうける
2. [hidden.in](https://qiita.com/ukiuni@github/items/a1372fac50a4ece1d5e8)を見つける
3. これは便利だと感動し、セットアップする
4. ユーザー名（支店名）を表示して欲しいと相談をうける
5. Node.jsを勉強する

このような経緯で今に至っております。

冒頭に紹介した記事で、MySQLにユーザー情報を保存しておき、passportモジュールを読み込み、ログイン判定をする。というところまでが

コスパ最強IoT家電！TPLink製品をRaspberryPiから操作

#TPLinkとは？
ルータを主力とする中国・深圳のネットワーク機器メーカーです。
近年はスマート電球、スマートプラグ等のIoT家電に力を入れており、コスパの良さからAmazonで独自の地位を築いています。

　　　　　　　　　　　　　[スマートプラグのHS105](https://www.amazon.co.jp/Alexa%E8%AA%8D%E5%AE%9A%E5%8F%96%E5%BE%97%E8%A3%BD%E5%93%81%E3%80%91-%E7%9B%B4%E5%B7%AE%E3%81%97%E3%82%B3%E3%83%B3%E3%82%BB%E3%83%B3%E3%83%88-Google%E3%83%9B%E3%83%BC%E3%83%A0%E5%AF%BE%E5%BF%9C-%E9%9F%B3%E5%A3%B0%E3%82%

node.js Firebase Functionで作ったGoogle Chat BotでChatからのリクエストであるかの検証を行う

皆さんこんにちわ。Chat Bot作ってますか？まだApps Scriptで作ってますか？
このごろは外部のG SuiteテナントユーザーともやりとりできるようになったGoogle Chat。
Apps Scriptのままじゃテナントまたげません[^1]。
やっぱりFirebase Functionsでしょう！ (Cloud Functionsもほぼ同じ)

…ってことでCloud Functionsをnode.jsで作り始めると、開発ドキュメントの「[Verifying bot authenticity][1]」でGoogle Chatからのリクエストかどうかを検証するためのサンプルコードが書かれていることに気づきます。
この対策をしないと、Bot Function URLが知らんやつに知られたら、Bot messageのsender情報を偽装されちゃうかもしれません。Botでユーザー情報を保持していてメッセージよって返すようにしていたら、その情報が抜かれちゃいます。そりゃまずいってことでサンプルのとおりに実装しようとしたところ…

### node.jsでBot Function作

ESLint7系を使っていると「TypeError: createRequire is not a function」が出る

# 概要

**ESLint 7** 系と**Node.js 12未満**をつかっていると以下のエラーがでる場合がある

> ESLint 7 がサポートしている Node.js バージョンは ^10.12.0 || >=12.0.0 となっています

↑だそうです。（コメントありがとうございました）

“`
TypeError: createRequire is not a function
Referenced from: /something/.eslintrc
at Object.resolve (/something/node_modules/eslint/lib/shared/relative-module-resolver.js:28:20)
at ConfigArrayFactory._loadExtendedShareableConfig (/something/node_modules/eslint/lib/cli-engine/config-array-factory.js:854:39)
at ConfigArrayFactory._l

virtual背景のロジックをnpm パッケージ化した件

### はじめに
先日、自分史上初めてnpmのパッケージを作成したので、記録として作業の流れを残しておくものです。
新しい情報は少ないかもしれません。
作成したパッケージは以前紹介したvirtual背景のコンポーネントです。

https://qiita.com/wok/items/962929e63bc98e4033b9


もしよかったら使ってやってください。

### 概要
Typescriptを用いた環境でnpmパッケージを作成してpublishするまでの流れです。

### 前提
– npmのアカウントは作っておく。
– githubのアカウントとリポジトリは作っておく。
– 作成したgitリポジトリをクローンして、そのディレクトリに移動している状態。

### 作業の流れ
まずはじめに、npmの環境設定とログインをしておきましょう

Nodejs用のモデルライブラリを作ってみた【Express】

#リポジトリ
https://github.com/kbc18a11/oreoreExpress
ライブラリ本体は`oreoreExpress/database/AbstractModel.js`です。

#解説用の構成や注意点
– FW：Express
– ディレクトリ構成：WebStormの新規Expressプロジェクトの状態に`プロジェクト名/database`と`プロジェクト名/model`というディレクトリを生成
– 本記事はチーム開発のメンバーのマニュアルとしても書いていますので、ライブラリには直接関係ないことも書いています。

今回利用しているtestsテーブルは以下の構成になっています

| id | text | created_at | updated_at |
|:—|——|:———-:|:———-:|

#使い方
リポジトリのものを利用するのであれば、以下のコマンドを実行してください。
“`
npm install mysql2
“`

ライブラリだけを使用するのであれば、`mysql2`と`date-utlis`をイン

JavaScriptワンライナー #1 任意長のランダムな文字列を作る

シェル芸ならぬワンライナー芸@JavaScriptで色々やってみようという試みです。

—

今回はテストデータを作るときに役に立つかもしれない「任意長のランダムな文字列を作る」というのをやってみます。
「ランダムな文字列を作る」というのをざっと調べるとよく見つかるコードにこんなのがあります。

“`js
Math.random().toString(36).slice(-8);
“`

– 乱数を発生させます。
– それを36進数としてパースすれば`0～9a～z`で値が表現されます。
– そのままでは先頭に`0.`というのが付いてしまうのでお尻から使えるところを拾っています。

都合の良いワンライナーですので、ここから発展させてみたいと思います。

## `0.`を捨てる

“`js
Math.random().toString(36).split(‘.’)[1];
“`
– ピリオドで分割します。
– 後ろを拾います。

## もっと長くしたい
このままでは得られる文字列の長さに限界があるので適当に繋げてみます。
先ずは4つぐらいかな…

“`js
[0,1,2,

TypeScriptでFormDataを良い感じに受け渡ししたい

# 概要
以前こんな記事を書きました。

JavaScript上でObjectをRailsで取得できる形のFormDataへ変換する
https://qiita.com/dorarep/items/f3aa1463123c1ae75879

今回、似たような形でNode.js上で動くサーバサイド側へ楽にデータを受け渡ししたいので、クライアント側、サーバサイドの変換ロジックをTypeScriptで実装しました。

# 実装

クライアント側

“`ts
/**
* Convert object to FormData which backend can use.
* This function is useful for uploading files.
*
* ex)
* { id: 1, hero: { id: 1, name: ‘NewHero’ }, items: [1, 2] }
* -> FormData with following parameters
* id: 1
* hero.id: 1
* hero.name: NewHero
* items

Node.js のバージョン管理を nodebrew で行った際、VS Code に反映されなかった

## Prologue
稼働しているプロジェクトで node.js のバージョンが低く、パッケージがインストールできない問題が発生しました。
単純にバージョンをあげてもよかったのですが、以前 node.js のバージョンがチーム内で異なっていて検証がうまく進まなかったことがあったため、これを期に `nodebrew` で管理することにしました。
インストール自体はそれなりにスムーズにできたのですが、VS Code で使用した際にエラーが出たため、その辺りも含めて記載しておきます。
内容は Try&Error のため、不要な内容も入っているのでご注意ください。
最後にスムーズにいく流れを記載しています。(-> [まとめ](https://qiita.com/miiiii/items/c3dbe4d5f82595a050fc#%E3%81%BE%E3%81%A8%E3%82%81))

## 環境
– macOS: 10.15.4
– terminal: iTerm
– VS Code 使用

– Project概要
– パッケージマネージャ: `yarn`

***

参考: h

Promise.all()内で軽率にawaitしてはいけない

# 事前知識
## Promise.all()

> Promise.all(iterable) メソッドは単一の Promise を返し、これは引数 iterable の中のすべての Promise が解決されるか、引数 iterable の中に Promise がない場合に解決されます。最初に拒否された Promise の拒否理由をもって拒否されます。

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

## JSONPlaceholder
例に用いるAPI
JSONを返してくれる
https://jsonplaceholder.typicode.com/

#Promiseを返すことを意識する

Promiseを返さないとPromise.all()を使う意味が無い。。。

## 見かけ上並列で非同期処理を実行したい
下記のように、urlの配列があったとする

“`js
const urls = [‘https://jsonplaceholder

Node.js（データベースを用いたWebアプリケーション）

# プログラミングの勉強日記
2020年6月18日　Progate Lv.130
Node.jsⅡ,Ⅲ

##MySQL
　データベースを管理するツールである。Node.jsからMySQLを操作するには、Node.jsからMySQLに接続する。そのためにmysqlパッケージを利用する。

“`:ターミナル
$npm install mysql
“`

“`javascript:app.js
//mysqlパッケージの読み込み
const mysql=require(‘mysql’);
//接続情報をcreateConnectionメソッドを用いて定数connectionに代入
const connection=mysql.createConnection({
//データベース名、パスワードなどを記述
});
“`

##クエリの実行
　`connection.query(‘クエリ’,クエリ実行後の処理)`と書くことで、Node.jsからデータベースに対してクエリを実行できる。
　クエリ実行後の処理は
　　第1引数のerror：クエリが失敗したときのエラー情報
　　第2引数の

【JWT（JSON Web Token）】Node.jsで実際に使ってみた

# はじめに
認証方式の１つであるJWTについてのまとめと使用例

# JWTとは
JSON Web Tokenの略
認証情報を含むJSONをbase64エンコードしたものに署名を付与したもの

# 利用例
1. クライアント側から認証情報（例：ユーザー名、パスワード）をサーバーに送信
2. サーバー側で認証情報を確認し、認証OKの場合JWTを発行し、クライアント側に返却
3. クライアントは次回以降、JWTを付与したリクエストを送信
4. サーバー側はJWTを検証する

なお、JWTの暗号化アルゴリズムは大きく分けて2種類ある。

– 共通鍵方式
HS256というアルゴリズムを使用する。
認証サーバとリソースサーバが同じ場合はこの方式が使われることが多い。

– 公開鍵／秘密鍵方式
RS256というアルゴリズムを使用する。
認証サーバとリソースサーバが別々の場合にこの方式が使われる。
認証サーバに秘密鍵、リソースサーバに公開鍵が配置される。

# JWTの構造
JWTの例は以下
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjoidGFy

Node.jsの基本的な使い方

# プログラミングの勉強日記
2020年6月17日　Progate Lv.122
　Node.jsⅠ
　Webアプリを作るために使われるNode.jsを学んだ。JavaScriptをサーバーサイドで動かす仕組みである。
　今回はNode.jsのフレームワークであるExpressを扱う。Node.jsには便利な機能を使えるようにまとめたパッケージがあり、Expressはそのパッケージのうちの1つである。

##npm
　パッケージを用意するために使うシステムである。Expressをnpmからインストールするには、`npm install`コマンドを使う。

“`:ターミナル(入力したらEnterを押して実行)
$ npm install express
“`
　インストールしたExpressを利用するためにはパッケージの読み込みと使用する準備が必要。以下の文は定型文として覚えてOK

“`javascript:app.js
const express=require(‘express’); //expressの読み込み
const app=exprss(); //ex

Express+MySQLでログインする

[前回の記事では](https://qiita.com/4201tosiyuki/items/80ee553ac42eeb323859)ユーザーtestパスワードtestのみのログインユーザーであった為、MySQLにユーザー情報を入れ、そこを参照してログインするを実装した備忘録です。

**各バージョン**

* Node v12.13.1
* express-session 1.17.1
* passport 0.4.1
* passport-local 1.0.0
* mysql 2.18.1
* bookshelf 1.2.0
* knex 0.21.1

では実装手順です。
必要なモジュールをインストールします。

“`:terminal
npm install i mysql knex bookshelf
“`

前回記事のユーザー名・パスワードをチェックするプログラムです。

“`javascript:index.js
passport.use(new localStrategy({
usernameField:’username’,
passwordFie