Web
NextAuth.jsには標準でもサインインページとサインアウトページは用意されているのだが、実務ではそのまま使いづらく、独自のサインインページを用意したいことが多いのではないかと思う。 本稿では、独自のサインインページを作成する場合の設定の概要と注…
一般的な話であるが、OAuth認証の基本的な仕組みを前提として確認する。OAuth認証を利用するWebアプリは、OIDCプロバイダから提供されたアクセストークンの正しさを、ユーザプロファイル情報の取得可否によって確認する。つまり、認証の過程においてWebアプ…
APIを試してみたのでメモ。 import 'dotenv/config' const API_KEY = process.env.DEEPL_API_KEY; const API_DOMAIN = process.env.DEEPL_API_DOMAIN; if (API_KEY == null || API_DOMAIN == null) { throw new Error(); } const API_ENDPOINT = `https://${…
Azure Static Web Appではstaticなファイルにはmiddlewareが機能しないっぽいので、 画像にも認証をかけたい場合はAPIで画像を返すようにする必要がある。 Static Web Appってそういうものだよなーと思っているので仕方ない気がするし、 そもそも認証が必要…
以前にAzure Web App Serviceへのデプロイについての記事を書きました。 ma38su.hatenablog.com 今回はこのデプロイをブラッシュアップして、Azure Pipelineからstatic web appへもデプロイできるようにしました。 2024/2/10 追記 Next.JSのmiddlewareうまく…
新しい技術を試すにあたって、面倒ではあるが、認証までは一通り使いこなせる必要があると感じている。ただ、認証は結構めんどくさいし、すぐ忘れてしまいがちなので、メモを残しておく。 GraphQLサーバに、認証機能を付与するにあたって、Contextを定義する…
最近、新しいアプリを作ってみたらデプロイに苦労したのでメモを残しておく。 2023.9.13時点で、Next.JSのアプリは、VSCodeの拡張機能や、Web App Serviceから自動設定できるGitHub連携のデフォルトのGitHub Actionでは、Next.JSのデプロイに時間がかかりす…
読んだ。 本書では、WATという人が読み書きしやすいテキストフォーマットを通して、WebAssemblyを解説している。 実務でWATを直接書くのは想像できないので、教養的な位置付けになるかと思っていたが、結構よかったと思う。 ちなみに、8章で、衝突判定をwasm…
Viteはthreejsで使うときも、基本、そのまま使えますが、 多少のご作法は理解しておく必要がありましたので、メモを残しておきます。 JSのコード中で読み込むアセットの取り扱い jsでimportなどせずにパスやURLを指定して読み込むテクスチャやフォントなどで…
expressセッションIDの生成についても読んでみる。 var uid = require('uid-safe').sync （中略） function session(options) { var opts = options || {} // get the cookie options var cookieOptions = opts.cookie || {} // get the session id generate…
軽量なコンテナを作るにはdistrolessのイメージをベースにするのがよいらしい。 distrolessは、Googleが管理しているイメージで、Google Container Registryで管理されているっぽい。 github.com 当たり前だけどdockerhubで検索してもでてこない。 とりあえ…
ESP32のライブラリでは、直接、mDNSのURLを指定してもアクセスできない。 ただ、mDNSを利用するためのライブラリは提供されているので、IPを解決してからアクセスすればよい。 例えばraspberry.localのIPを取得したい場合は以下のような感じでできる。 #incl…
express-generatorは、パッケージ名とコマンド名が異なるので、npxでインストールせずに使うのがちょっとめんどくさい。 npx --package express-generator -- express -h ただ、インストールするか？と確認されるので、どこかにはインストールされているのか…
M5Stackでもほとんど同じでいける。 とりあえず、センサーの値をサーバに残したい場合とか。 とりあえずとはいえhttpsにはしないとなー。 #include <M5StickCPlus.h> #include <WiFi.h> #include <HTTPClient.h> #include <ArduinoJson.h> const char* ssid = "xxxx"; const char* pass = "xxxx"; const int capaci</arduinojson.h></httpclient.h></wifi.h></m5stickcplus.h>…
nginxのロードバランサに割り当てたバックエンドのサーバがダウンしていることは、タイムアウトで判定される。タイムアウトする時間は以下のパラメータで調整できる。 proxy_connect_timeout 接続自体のタイムアウト proxy_send_timeout バックエンドサーバ…
Reactの開発環境の前にnginxのリバースプロキシを適当に置くと、以下のようなエラーが出る。*1 WebSocket connection to 'wss://127.0.0.1/sockjs-node' failed: Error during WebSocket handshake: Unexpected response code: 404 これは、Reactの開発環境…
最近クッキーネタ多いな。。。 なんかエラーが起きてると思ったら、manifest.json(Web App Manifest)にCookieが送られていないことが判明。 調べてみると、manifest.jsonファイルについては、オリジンによらず資格情報、 つまりCookieを送らない仕様なのだそ…
違うのはわかっていても、なかなか覚えらないのでメモしておく。 nginxでリバースプロキシの設定をするとき、 Request URLによって、転送したいURLを指定するが、末尾のスラッシュの有無で振る舞いが異なる。 以下の場合は、指定したサーバに転送はされるが…
一昔前に話題になっていたので、いまさらながらCookieのSameSite属性について調べた。 First Party Cookieと、Third Party Cookieがあるが、今回はFirst Party Cookieの確認。 *1 一言でSameSiteの設定の影響について説明するなら、他のドメインからのアクセ…
Cookieの仕様について調べているが、 どうもFirst Party Cookieと、Third Party Cookieってのがあるらしい。 普通のCookie、表示して表示しているページと同じドメイン(domainAとする)のCookieはFirst Party Cookieというらしい。 それに対して、表示してい…
CookieのSecure属性を付けないとどうなるか試した。Secure属性を有効にすると、httpsのときのみCookieを送信するようになる。 事前準備 事前の準備として、検証の内容的にhttpsアクセスは必須なので、nginxのリバースプロキシでhttps化の設定しておく。*1 今…
docker-composeでnginxでロードバランサを試した。 nginxの後ろに、3台のexpressのサーバに振り分けるようなものを試してみた。 version: '3' services: lb: image: nginx:latest volumes: - ./nginx/nginx.conf:/etc/nginx/nginx.conf ports: - "80:80" dep…
いわゆるオレオレ証明書の作り方。 最近、ちょっとしたことを確認しようとしても、https化が必須になっている。 パブリックなネットワークだとLet's Encryptを使うべきなんだけど、 Let's Encryptではドメインが必須なので、ドメインが容易できないと使えな…
threejsで大規模なモデル操作とか始めるとTypescriptの型サポートはとても助かる。 以前にも書いていたことがあったが、古かったので消して、代わりに2020年度時点の環境設定を残しておく。 package.json { "name": "threejs-tutorial", "version": "0.0.1",…
grpc-webとenvoyの間の通信のhttps化を試した。 grpc-webの公式には、httpでenovyの設定は載っていて、 envoyの公式には、httpsでの接続のための設定は載っているので、 基本的にはそれらを組み合わせるだけでうまくいった。 envoy.ymlを張っておく。 この例…
HTTPSを手を動かして確認する。 opensslを使うと簡易にSSL/TLSのクライアントやサーバを立てられるということなので確認してみる。 ちなみに，HTTPを確認する場合はtelnetを使えば良い。 HTTPS クライアントの動作確認 HTTP/1.0 以下のコマンドを打つと，HTT…
