- 1. 無限に時間がかかるサーバー
- 2. npmセキュリティ10のベストプラクティス
- 3. Node.js Expressの例を通じて、Webアプリのセッションについて理解する
- 4. 私のnode古すぎ?node10.から最新にした話
- 5. Node.js Expressの例を通じて、WebアプリにおけるCookieについて理解する
- 6. Discord.js(v13系)で指定チャンネルにメッセージ送信メモ
- 7. Nest(Node.js), Vue3, MySQL(Prisma), GraphQLで動かしてみる
- 8. NodeJSからAPI Gateway SDK Javascript版を使ってみる
- 9. Node.jsのworker_threadsモジュール(スレッドプール)
- 10. 【JavaScript】Promiseと非同期処理について
- 11. discord.js v13 のみでスラッシュコマンドを登録する
- 12. Node.js: Cognito から Access Token を取得
- 13. 【初学者】Herokuデプロイ時に詰まったこと【Webアプリ開発の道~その2~】
- 14. ReactとNode.js(express)でAPIの通信を確立する
- 15. Herokuでアプリを作るのをもっと簡単にしよう
- 16. Cloud FunctionsにSecretを環境変数として渡したが、デプロイ時に環境変数がなぜか取得できずデプロイエラーとなった件の解決
- 17. Puppeteerでヘッドレス Chromeのフルページスクリーンショットを撮る
- 18. 2021年版 Expoまとめ
- 19. Day.jsをいい感じに共通化する
- 20. Next.jsアプリケーションをIISにデプロイしたかったのでIIS上でホストしてみた
無限に時間がかかるサーバー
“`
const express = require(‘express’)
const app = express()
const port = 9999app.get(‘/’, (req, res) => {
res.header(‘Access-Control-Allow-Origin’, ‘*’)
res.header(‘Access-Control-Allow-Methods’, ‘GET,PUT,POST,DELETE’)
res.header(
‘Access-Control-Allow-Headers’,
‘Content-Type, Authorization, access_token’
)
setTimeout(() => {
res.send(‘Hello World!’)
}, 1000000000)
})app.listen(port, () => {
console.log(`Example app listening on port ${port}`)
})
“`
npmセキュリティ10のベストプラクティス
こんにちは!
IT用語には、Acronym 、頭文字の略称がたくさんありますよね。
便利ですが、時々 いい間違えや、会話がこんがらがることがあります。Linuxコマンドのrpmと、
npmの字面が、rpmと似ていて、「全然、違うし!」と自分で、思わずツッコミをいれたくなったことが何度かありました:joy:。npm → Node Package Manager
rpm → Red Hat Package Manager今回はこちらの翻訳から、お届けします。
https://snyk.io/blog/ten-npm-security-best-practices/#npmセキュリティ10のベストプラクティス
オープンソース アプリケーションのセキュリティ
Liran Tal, Juan Picado
リラン・タル、フアン・ピカド
2019年2月19日npmの脆弱性が心配?
フロントエンドとバックエンドどちらのデベロッパにとっても、npmのセキュリティのベストプラクティスを考慮に入れることは重要です。[オープンソースのセキュリティ](https://snyk.io/b
Node.js Expressの例を通じて、Webアプリのセッションについて理解する
## はじめに
Webアプリケーションが快適に利用できるのはセッションが存在するから、とよく言われると思う。前回の記事[Node.js Expressの例を通じて、WebアプリにおけるCookieについて理解する](https://qiita.com/yuta-katayama-23/items/068900da9271c4d1be1c)ではCookieが必要でそのCookieのおかげと言っていたのに、どういう事?となるかもしれないが、セッションについて理解を深めていく事でCookieとセッションの関係性についてもスッキリすると思う。そこで今回は、セッションとは何か?について理解しつつ、実際にNode.jsのExpressでセッションを実現する実装をやってみたのでその備忘録を残す。
## セッションとは何か?
簡単に一言で言ってしまうと、「論理的な意味での開始から終了までの一連の連続した操作(クライアントとサーバ間でやり取りされるひとまとまりの操作)を表す単位・概念」の事。ここでポイントは「一連の連続した操作」や「ひとまとまりの操作」と言っているように、1回だけでなく連続で行
私のnode古すぎ?node10.から最新にした話
#はじめに
環境
OS:ubuntu20.04
npmは8.3.1
これまで使っていたnodejsが古すぎて使えないとnpmから言われてしまったので、新しいnodeを導入することになりました。aptやnpmじゃないインストール方法を全く知らなかった筆者が、右往左往しながらnodeを追加するまでの備忘録を書きます。#npmコマンドを使ったある日
“`shell
npm does not support Node.js v10.19.0
“`ある日突然、nodejsが古いと指摘された。これまで普通に使えた気がするんだけどな。ただ調べてみると最新版がv17であるのに、今使ってるのがv10では確かに古いか。
#普通にnodeをアップデートしようとする
nodeはaptコマンドからインストールしていたので、ap
Node.js Expressの例を通じて、WebアプリにおけるCookieについて理解する
## はじめに
Web アプリケーションが快適に利用できるのは Cookie のおかげとよく言われると思う。今回は、そんな Cookie が何をしてくれているものなのか?について理解しつつ、実際に Node.js の Express で Cookie の実装をやってみたのでその備忘録を残す。## Cookie とは何か?
簡単に一言で言ってしまうと、「クライアントの状態をテキストで保存する仕組み」の事。ここで言うクライアントというのは Web アプリなどを開くブラウザの事だと思ってよく、Cookie は Web アプリなどを利用しているユーザに関する状態を保存するためも仕組みと言い換えられるだろう。
具体的にどのような動きをするか?だが、以下の図に示したようにサーバを起点にしてクライアントにテキスト情報が送られ、これをクライアントはそのままサーバに送り返すという事をする。やっている事はこれだけ。
で指定チャンネルにメッセージ送信メモ
呼びかけてリプライさせるなどではなく、別のプログラムから
Webhook使う形でも良いのですが、毎回Webhook URLを発行するのも手間になってきたので、調べてみました。
## client.channels.cache.get().send()
こちらの記事にある記載で出来ました。
https://scrapbox.io/discordjs-japan/%E6%8C%87%E5%AE%9A%E3%81%97%E3%81%9F%E3%83%81%E3%83%A3%E3%83%B3%E3%83%8D%E3%83%AB%E3%81%AB%E3%83%A1%E3%83%83%E3%82%BB%E3%83%BC%E3%82%B8%E3%82%92%E9%80%81%E4%BF%A1%E3%81%97%E3%81%9F%E3%81%84
`client.channels.cache.get(‘送信するチャンネルのID’).send(‘メッセージ’)`
なかなか長いメソッド
## 送信のサンプルコード
以前書いたメモのサンプルコードがそのまま使えました。
https:/
Nest(Node.js), Vue3, MySQL(Prisma), GraphQLで動かしてみる
## 環境構築
– Docker-compose## Nest.js
– dockerコンテナ内で`npx nest new {APP_NAME}` で新規プロジェクトを作成
– prismaの設定
– `yarn add -D prisma`
– `yarn add @prisma/client`
– `yarn init` で、生成されたファイルにテーブルの定義をしていく
– 定義後に`npx prisma migrate dev`でデータベース作成
– Nest.jsにデータを読み込ませるために、テーブルを更新したら、毎回マイグレーション後に`npx prisma generate`をする
– GraphQLの設定
– [参考 Nest/GraphQL/schema-first](https://docs.nestjs.com/graphql/quick-start)### error: GraphQLのversionは15系じゃないとうまく動かなかった
– リファレンス通りに実行すれば問題ない## Vue3 (Vite)
– dockerコンテナ内で
NodeJSからAPI Gateway SDK Javascript版を使ってみる
“`Node.js
// eval(fs.readFileSync(“apiGateway-js-sdk/lib/axios/dist/axios.standalone.js”, ‘utf-8’));
const axios = require(‘axios’); //npm install axios
eval(fs.readFileSync(“apiGateway-js-sdk/lib/CryptoJS/rollups/hmac-sha256.js”, ‘utf-8’));
eval(fs.readFileSync(“apiGateway-js-sdk/lib/CryptoJS/rollups/sha256.js”, ‘utf-8’));
eval(fs.readFileSync(“apiGateway-js-sdk/lib/CryptoJS/components/hmac.js”, ‘utf-8’));
eval(fs.readFileSync(“apiGateway-js-sdk/lib/CryptoJS/components/enc-base64.js”, ‘utf-8
Node.jsのworker_threadsモジュール(スレッドプール)
# はじめに
node.jsでマルチスレッドを実現するworker_threadsについて、実例を交えて説明します。# 参考
– ハンズオンNode.jshttps://github.com/oreilly-japan/hands-on-nodejs/blob/master/ch04/samples.txt
# worker_threadsモジュール
例として、http\://localhost:3000/10へのアクセスに対して10番目のフィボナッチ数を返すような簡易Webアプリケーションを構築していきます。
パフォーマンスを担保するために生成するスレッドをプールして使い回すような仕組みにしたいです。
以下の3ファイルで実現できます。~~~thread-pool.js
‘use strict’
const { Worker } = require(‘worker_threads’)module.exports = class ThreadPool {
// 空きスレッド、キューを初期化
availableWorkers = []
queue = []
【JavaScript】Promiseと非同期処理について
こんばんは。今回はJavaScriptの非同期処理について書いていきます。
##非同期処理とは?
非同期処理とは、ある処理を実行をしている際に、他のタスクが別の処理を実行できる方式をいいます。
DBから値をとってくるなど、他の処理と比べて時間がかかる処理があった場合、この非同期処理の仕組みがないと、DBから値をとってくる処理が終わるまで待っていなければなりません。
非同期処理の場合、DBから値をとってくる処理を行ってるとき、別のイベントが発生すると、一旦DB処理を中断してそのイベントを処理します。そしてまたDB処理を再開します。しかし非同期処理にも不便な点があります。例えばDBから値を取得し、そのデータをreturnする関数があったとします。普通にこの関数を実行すると、DBから値を取得する処理が行われている間にreturnが実行され、正常に値が返されなくなってしまいます。
そのような問題を解決するための方法はいくつかありますが、今回はPromiseを使った方法をご紹介します。##非同期処理を順番に実行する
非同期処理を順番に実行する場合、Promiseを使うと便利です。
discord.js v13 のみでスラッシュコマンドを登録する
## はじめに
スラッシュコマンドとは,下の図のようなコマンドのことであり,v13系のdiscord.jsでbotに実装できるようになりました.
従来botがコマンドを受け取るには,サーバー(ギルド)に書き込まれる文章を監視し続け,任意のコマンドを含む文字列を取得した場合はプログラムを実行させることでコマンドのような機能を実装していました.
しかし,スラッシュコマンドが導入されることでユーザーは使いやすく,開発側は(実装方法にもよるが)プログラムが読みやすく書きやすくなりました.

しかし,たいていのスラッシュコマンドの記事では,登録はREST APIを自分で叩いて行う方法が紹介されています.
([公式のガイド](https://discordjs.guide/interactions/registering-slash-commands.
Node.js: Cognito から Access Token を取得
AWS の Cognito から JWT Access Token を取得する方法です。
ライブラリーのインストール
“`bash
sudo npm install amazon-cognito-identity-js
“`“`js:get_token.js
// —————————————————————
//
// get_token.js
//
// Feb/19/2022
// —————————————————————
‘use strict’console.error(“*** start ***”)
var cognito = require(‘amazon-cognito-identity-js’)
const dotenv = require(‘dotenv’)
dotenv.config()
const user_pool_id = `${process.env.US
【初学者】Herokuデプロイ時に詰まったこと【Webアプリ開発の道~その2~】
# はじめに
こんにちは。「塵も積もれば山となる」精神で日々学習しながら、Webアプリ開発に取り組んでいます。# 何を書いたか
今回はローカル環境で作成したRails6アプリ(Hello,Worldの出力)をHerokuにデプロイする際に詰まったことについて書きます。Railsチュートリアル(第6版)では1章と3章前半部分の内容です。# なぜ書いたか
RailsチュートリアルどおりにAWSのCloud9を開発環境として、Herokuにデプロイしたときにはすんなり上手くいったのですが、ローカル環境からHerokuにデプロイしようとすると、まぁまぁ大量のエラーが発生しました笑前回の[ローカル環境構築](https://qiita.com/kosukein38/items/aff73fda16a1447e6db3) に続き、こちらも一日がかりでデバッグして、ようやくデプロイ成功したので、エラーデバッグ方法を備忘録として記事にしました。同じような境遇になった方の参考になれば幸いです。
エラーのデバッグが経験値を上げると信じて、できるだけエラーの意味を解釈しながら進めていったつもり
ReactとNode.js(express)でAPIの通信を確立する
## 概要
サーバーを立ち上げてAPIを叩くという一連の流れを確認してみたかったので、ローカルでフロントエンドとしてReact, バックエンドとしてNode.js(express)を立ち上げてAPI(Fetch)叩いてみる。
フロント側としてはわざわざReactでやる意味はないが慣れているため採用しました。## 1. Node.js(Express)でサーバーを立ち上げる
1. `cd backend`
2. `yarn init`でpackage.jsonを初期化。色々質問されるけど、とりあえずデフォルトでok
2. `yarn add express`でexpressのパッケージをインストール
2. index.jsをbackend配下に作成する
2. index.jsは以下のように記述する“`js
const express = require(“express”);
const app = express(); //express のインスタンス
const port = 3001; // listenするport番号app.get(“/”, (
Herokuでアプリを作るのをもっと簡単にしよう
[Herokuの[Node.js getting started]](https://github.com/heroku/node-js-getting-started/)
Heroku公式のリポジトリは、ムダがあります。– 不必要なモジュールの導入
– テンプレートの説明やタイトルなど、無駄があります。(2回言っちゃう)
ということで、無駄を無くしたものを作ってみました![Bellomakerの[Node.js getting started]](https://github.com/heroku/nodepack/)
やばいです!めちゃ無駄省きました!
使ってみてね※あえて語彙力は低めで書いております
Cloud FunctionsにSecretを環境変数として渡したが、デプロイ時に環境変数がなぜか取得できずデプロイエラーとなった件の解決
## 前提
* Cloud Functions(Node.js) + Express.js + TypeScript
* 異なるプロジェクトのFirestoreにアクセスする必要がある
* Service Account Keyのclient_email, private_keyを用いてinitializeApp()する
* Secret Managerにclient_email, private_keyを保存
* Cloud FunctionsにSecretを環境変数として渡している## 最初作った構成
下記のソースだと、`firebase deploy –only functions`時にエラーを吐いた
client_emailをハードコードすると、private_keyで同様のエラー。
private_keyもハードコードするとうまく動いた。“`
Error: Error occurred while parsing your function triggers.
Error: Service account object must contain a string
Puppeteerでヘッドレス Chromeのフルページスクリーンショットを撮る
Webページのスクリーンショットを大量に取りたいという時に、便利なのがヘッドレス Chrome。
ヘッドレスとは、GUIからではなくCUIからChromeを使用するモードのことで、Chrome 59以降から搭載されました。
ヘッドレス Chromeを使うと、ブラウザで行う様々な操作をコマンドラインから行い、自動化することもできるようになります。今回はこのヘッドレス ChromeをNode.jsのプログラムで制御するためのライブラリである[Puppeteer](https://github.com/puppeteer/puppeteer)を使って、Webページ全体のスクロールショットを撮る方法を模索してみました。
まずはPuppeteerをインストール
“`
npm i puppeteer
“`Puppeteerをインストールする際、自動でChromiumもインストールされますが、ローカルにあるChromeを使いたい場合には、puppeteer-coreのみでインストールすることもできます。
“`
npm i puppeteer-core
“`puppeteer
2021年版 Expoまとめ
https://github.com/expo/expo
https://blog.expo.dev/expo-sdk-43-aa9b3c7d5541
– Expoのここ3年くらいの動きが慌ただしかったため、用語整理も兼ねてまとめる
# Expoのリリース履歴
| SDK | Date | Highlight |
| — | — | — |
| [33](https://blog.expo.dev/expo-sdk-v33-0-0-is-now-available-52d1c99dfe4c) | 2019/6 | Bare Workflow
Expo Web(React Native Web)ベータ版
|
| [34](https://blog.expo.dev/expo-sdk-34-is-now-available-4f7825239319) | 2019/7 | `Android App Bundle(.app)`をサポート |
| [35](https://blog.expo.dev/expo-sdk-35-is-now-available-beee
Day.jsをいい感じに共通化する
Day.jsは、軽くてMoment.jsと互換が効くのでよくプロジェクトで使っています。
そこで困ってくるのがlocaleやtimezoneの共通化ではないでしょうか?
Day.jsをimportする度に設定するのは、抜け漏れしそうですしね。僕の場合は以下のようにして、Global設定(共通化)しています。
## React
“` index.tsx
import dayjs from “dayjs”;
import utc from ‘dayjs/plugin/utc’;
import timezone from ‘dayjs/plugin/timezone’;
import “dayjs/locale/ja”;
dayjs.extend(utc);
dayjs.extend(timezone);
dayjs.tz.setDefault(‘Asia/Tokyo’);
dayjs.locale(“ja”);
“`## NestJS
“` src/util/dayjs.ts
import dayjs from ‘dayjs’;
import utc from ‘day
Next.jsアプリケーションをIISにデプロイしたかったのでIIS上でホストしてみた
Next.jsをデプロイするならVercelが推奨されているけど、
どうしてもIISでやりたいっていう人向け。IIS拡張モジュール「HttpPlatformHandler」を使うと、
IISからnode.exeを起動してHTTP要求をNodeプロセスに処理させることができます。
下記サイトを参考にさせていただきました。
https://nodejs.keicode.com/nodejs/using-platformhandler-to-host-nodejs-on-iis.php##事前準備
IIS拡張モジュールが必要なのでインストールします。
https://www.iis.net/downloads/microsoft/httpplatformhandlerあとは、Next.jsアプリを普通に作成して、ビルドまで済ませておきます。
私はcreate-next-appで作りました。IISのWebアプリケーションで
http://localhost/nextapp
というURLでアクセスできるようにしたいので、
next.config.jsにbasePathの指定を入