技術系

いかがでしたか?

【備忘録】iPadからTailscale経由でssh接続する

iPadからsshで自宅のサーバーに接続したいと思ったことありませんか?え?自宅にサーバーがない?それだと話が終わってしまうので「あるある〜」という前提でこの記事は書いていきます。 Tailscale は WireGuard の技術を使用したVPNのSaaSです。 tailscale.…

Webサイトのキャッシュ戦略を整理する

現在、Web上にはたくさんのWebサイトが存在しています。見る側も昔と比べ格段に増え、現在はスマホをもつ世界中の人々がアクセスしてきます。 そのため、なにかしらWebサイトを立ち上げる際には現在はCDNなどを使用したキャッシュの仕組みが欠かせません。こ…

【備忘録】CloudRunは X-Forwarded-For を上書きする

3行まとめ CloudRunはX-Forwarded-Forを上書きしてクライアントのIPアドレスにしてしまう User - CDN - CloudRun としている場合、X-Forwarded-Forの値はCDNのIPアドレスになってしまう 解決策はCDN独自のヘッダーを付与してアプリケーション側で読むしか方…

docker composeでnginxを動かすときはオリジンのコンテナがHealthyになっているかチェックすると良い

バックエンドとフロントエンドが分かれていたり、細かいルーティングを行うWebアプリケーションではローカルの開発環境でnginxをプロキシサーバとしてかますことが多いと思います。 しかし、docker compose upで立ち上げた初期はバックエンドのアプリケーシ…

【備忘録】Chromium 121でVRTが落ちる事がある

追記 2024年6月4日 4757 - chromedriver - WebDriver for Google Chrome - Monorail のissueを見てみると status が fixed になっており、修正されていそうです。 とはいえ、まだ最新版はパッケージマネージャーに降ってきていないのでまだ待つ必要がありそ…

出社できて偉いボタンを作った

この記事は はてなエンジニアのカレンダー | Advent Calendar 2023 - Qiita の22日目の記事です。 qiita.com developer.hatenastaff.com 前日は id:utgwkk さんの 知見がどんどん集まってくるところが見た〜い - 私が歌川です でした。 突然ですが、 こんに…

Goで作るパスキー

注意 この記事ではgo-webauthnを使用したバックエンド側のWebAuthnの実装について解説しています。 1からWebAuthnを実装したい場合は RFC や W3C を参照してください。 この記事は、四工大アドベントカレンダーのカレンダー | Advent Calendar 2023 - Qiita …

Goのディレクトリ構成で無限に悩んでいる

これは、Go歴1年未満の初心者の戯言です。はてブなんかで指摘していただけると嬉しいです。 Goでアプリケーションを書くときに、クリーンアーキテクチャに則って実装するのは厳しいのではないかということをよく考えている。というのも、Goはディレクトリご…

Cloud BuildでFastlyのキャッシュをパージする

Cloud Runをバックエンドにし、前段にFastlyなどのCDNをかますといった構成をすることは多いと思います。しかし、CDNはデプロイ時にキャッシュをパージしないと古い内容が残ってしまうという問題があります。Next.jsなどは特にパージしてあげなければならず…

【備忘録】CloudRunにFastly CDNを噛ますときはセッション アフィニティをOFFにしないとキャッシュされない

Cloud Run には セッション アフィニティ という機能があります。説明には 同じクライアントからのリクエストを可能な限り同じコンテナ インスタンスにルーティング。 とあるように、Cloud Runで複数のインスタンスが立ち上がっている状態でも可能な限り同一…

Fastlyでオリジン間をBasic認証で保護する

Fastly はVarnish上に構築されているCDNです。 そのため、VCLを自由に書くことができます。これを使用することで CDN - Orign 間通信にBasic認証を追加することも可能です。 TL;DR FastlyのVCL snippets 設定で以下をvcl_missとvcl_passに追加します。値はus…

【備忘録】EQIS-1 でプログラムを書き込む

* この記事はドライバのダウンロードなどを説明していますが、行う際はすべて自己責任でお願いします。 EQIS-1という素晴らしい商品があります。PRIORIS社が販売している、加速度センサとOLEDのディスプレイ、Raspberry Pi Picoのようなマイコンボードである…

ローカル環境で初回コンテナ起動時にMySQLのマイグレーションをする

コンテナ化しているプロダクトをローカルで動作させる場合、MySQLのコンテナを用意しdocker composeで管理することが多いかと思います。 スキーマのマイグレーションは別スクリプトになっていて初回セットアップ時の手順で「docker compose upをした後、マイ…

CDN、Next.js、Middlewareを使用している場合バージョン13に上げると動かなくなる場合がある

追記 2023/10/25 ミドルウェアを使用している際にX-Middleware-Prefetchヘッダを付与して送信すると{}がキャッシュされることで攻撃者は容易にキャッシュを{}にすることができるためこちらの問題にCVEが付きました。 13.4.20-canary.13で修正されているので…

docker compose v2.20.0 の新機能includeが追加された

2行まとめ include文が追加された include:で外部のcompose.yamlをロードできる 本文 docker compose の v2.20.0 に include文というものが追加されました。 github.com これは、yamlに、 include: - ./docker/compose.yaml - ../hogehoge/compose.yaml のよ…

【備忘録】SQLBoilerのデバッグログをzap経由で出力する

SQLBoilerでは、Debug Loggingという機能があり、これを有効にするとSQLクエリが実行されるたびに標準出力されます。 boil.DebugMode = true このデバッグログの出力先はデフォルトでos.Stdoutになっていますがboil.DebugWriterを使用することで自由に上書き…

Recoilのstateをタブ間で共有する

はじめに RecoilというReactの状態管理ライブラリが存在します。 自分はよく、/user/meから取得したユーザー情報をこのRecoilのStateに入れて保管しています。 しかしただログイン状態を入れるだけでは、複数タブで同じページを開いている場合に片方がログア…

はてなのid記法を使えるようにするrmark.jsプラグインを作った

remark.jsというのを知っていますか?知らない方向けに一言で説明すると、マークダウンをHTMLに変換するJavaScriptのツールです。 react-markdownなんかも内部はこれで動いています。 remark.jsはプラグインをサポートしており、自分で自由に構文を作成する…

【備忘録】ChakraUIはSotrybookでuseColorModeが使えない

TL;DR ChakraUIには@chakra-ui/storybook-addonという便利なアドオンがある これを使用するとStorybookで簡単にChakraUIを使用できる しかし、ツールバーのテーマボタンはconst {setColorMode} = useColorMode();などが効かない 解決するには、.storybook/pr…

株式会社はてなに入社しました

株式会社はてなに入社しました 株式会社はてなに入社しました - hitode909の日記 4月1日です。今日はエイプリルフールですが、この記事は本物です。 タイトルにある通りに株式会社はてなに入社します。はてなとは1年ほど前からアルバイトをさせていただいて…

gitのコミット署名管理を1passwordに頼ったら生活レベルが上がった

TL;DR Sign your Git commits with 1Password | 1Passwordを使用するとGitのコミット署名を1passwordで管理することができる。 GPG keyを使用する場合よりもかんたんに署名することができ、管理もしやすくて最高 コミット署名には苦い思い出があった Gitには…

はてなブログではタイトルのみでカテゴリーを設定できる

TL;DR 記事タイトルを[カテゴリー]タイトルのようにすると[]の中が自動的にカテゴリーになる。 カテゴリーを複数設定する場合は、[カテゴリー1][カテゴリー2]タイトルのように連続にする。 ??? 少なくともヘルプには書いていないので隠し機能(?) help.…

【備忘録】GoからHeadless Chromeを動かしてスクリーンショットを撮る

TL;DR github.com/go-rod/rodを使うと簡単にできる package main import ( "path/filepath" "github.com/go-rod/rod" "github.com/go-rod/rod/lib/proto" "github.com/go-rod/rod/lib/utils" ) func main() { browser := rod.New().MustConnect() page := br…

【Go】xmlのstruct定義ベストプラクティス

Goのxmlパーサである、encoding/xmlのパースベストプラクティス(自分調べ)です。 通常のパース <data> <item> <title>hogehoge</title> <link>https://cateiru.com</link> </item> </data> type Data struct { Item struct { Title string `xml:"title"` Link string `xml:"link"` } `xml:"item"` } go.dev 複数…

【Go】GoでISO8601拡張形式(タイムゾーンあり)をパースする

2022-12-15T06:12:47+09:00の形式をパースします。 TL;DR d := "2009-10-01T13:48:00+09:00" parsedTime, err := time.Parse(time.RFC3339, d) ... Playground go.dev

ITエンジニアに向ける**料理**のすゝめ

この記事は Calendar for 東京電機大学 | Advent Calendar 2022 - Qiita の10日目です。 ITエンジニアしていますか?私は日々、クソコードを量産したり研究室で発狂しています。 さて、このブログではITエンジニアに向けて料理という趣味について紹介をして…

Wi-Fiはチャンネルも大切

この記事は Calendar for 東京電機大学 | Advent Calendar 2022 - Qiita の9日目です。 みなさん、Wi-Fi使っていますよね?Wi-Fiを選ぶ際にはどういう指標をみて選んでいますか?おそらく、一番はacやbeなどというIEEEの規格で選んでいることが多いかと思い…

「茨城県」を「魅力度最下位県」にするブックマークレット

この記事は、Calendar for 東京電機大学 | Advent Calendar 2022 - Qiita の8日目です。 昨日は、 埼玉をダ埼玉に変えてしまうブックマークレットを作成しました。そして、今回は、私が生まれ育った「茨城県」を使って遊んでいこうかと思います。 魅力度ラン…

「埼玉」を「ダ埼玉」に変えるブックマークレット

この記事は Calendar for 東京電機大学 | Advent Calendar 2022 - Qiita の7日目です。 皆さん、埼玉県民していますか?私は、2019年から埼玉県民の一員として日々精進しています。 その、暮らしの中で私はあることに気づきました。 埼玉県民は自虐ネタが好…

WebClassのセッション維持方法を見る

この記事は、 Calendar for 東京電機大学 | Advent Calendar 2022 - Qiita の6日目です。 昨日はUNIPAのセッション維持方法を見ました。今日は、東京電機大学で使用しているもう一つのポータルサイトであるWebClassのセッション維持方法を見てみます。 els.s…