Posts

課題 Google Apps Script（GAS）からDiscordへWebhookでメッセージを送信する際，GASの共有IPアドレスが原因でDiscordのレートリミットに巻き込まれ，IPブロックされることがある： Discord API Error (429): error code: 1015 この問題は自身の送信頻度が適正であっても発生する． 解決策 Cloudflare Workers（CFW）を用いて，リクエストをDiscordへ横流しするだけのプロキシを構築する． drop-in replacement: クライアント側の変更を最小限にするため，Base URLの置換だけで機能するようパスをそのまま引き継ぐ仕様とする． whitelist管理: セキュリティ対策として，WH_というプレフィックスから始まるCloudflare Secretsに登録されたWebhook URLのみを許可する． 実装 index.tsのみ． export interface Env { [key: string]: unknown; } export default { async fetch( request: Request, env: Env, ctx: ExecutionContext, ): Promise<Response> { if (request.method !== "POST") { return new Response(JSON.stringify({ error: "Method Not Allowed" }), { status: 405, headers: { "Content-Type": "application/json" }, }); } const requestUrl = new URL(request.url); const pathname = requestUrl.pathname; const targetWebhook = `https://discord.com${pathname}`; const allowedWebhooks: string[] = Object.keys(env) .filter((key) => key.startsWith("WH_") && typeof env[key] === "string") .map((key) => env[key] as string); if (!allowedWebhooks.includes(targetWebhook)) { return new Response( JSON.stringify({ error: "Forbidden: Webhook URL is not in the allowlist", }), { status: 403, headers: { "Content-Type": "application/json" }, }, ); } const contentType = request.headers.get("content-type") || "application/json"; try { const body = await request.text(); const discordResponse = await fetch(targetWebhook, { method: "POST", headers: { "Content-Type": contentType, }, body: body, }); const responseBody = await discordResponse.text(); return new Response(responseBody, { status: discordResponse.status, headers: { "Content-Type": discordResponse.headers.get("Content-Type") || "application/json", }, }); } catch (error) { return new Response( JSON.stringify({ error: "Internal Server Error while forwarding" }), { status: 500, headers: { "Content-Type": "application/json" }, }, ); } }, }; 使用方法 Webhook URLをWH_というプレフィックスから始まる名前でSecretsに登録し，送信元でdiscord.comをyour-worker.your-subdomain.workers.devに置換するだけ． ...

VSCode 上のコードを Colab で実行する VSCode には Google 公式 Colab 拡張機能がある： 拡張機能 公式ブログの記事 この拡張機能を使うことで VSCode 上から Colab のランタイムに直接接続し，コードを実行できる． これにより，VSCode でコーディングし，Colab の計算リソースを使って実行する，というワークフローをとれる． なお，Google Drive のデスクトップアプリをインストールしておけば，Drive 上のファイルを VSCode で直接開ける． この状態で Colab のランタイムを接続すれば，Drive 上のファイルをそのまま編集し，Colab 環境で実行できることになる． GitHub 上のコードを Colab で開く Colab はもともと，GitHub 上の public repo から直接ノートブックを開く機能を備えている． 公式解説 GitHub public repo への URL をgithub.com→colab.research.google.com/githubと置換するだけでよい．

Repository https://github.com/Efo-YU/vite-react-tailwind-ts-swc Motivation Next.jsではTypeScriptとTailwind CSS(とベースたるReact)が標準的な構成として用いられる(create-next-app時に自動でsetupできる) Next.jsはReactの代表的な full-stack framework とされるため，Reactを用いる際は上記の構成を真似したい だがNext.js自体は超クソデカframeworkであるため，この構成を使うためだけにNext.jsを用いるのは無駄が多い Viteなら簡単かつminimalにReact+Tailwind+TSを構成できる Procedure Initialize project Commit: https://github.com/Efo-YU/vite-react-tailwind-ts-swc/commit/7d4de5eb7ac7561dc163684a4ccc556c874b6d94 下記を実行： pnpm create vite dialogで以下のように選択： ◇ Project name: │ foo-bar-project # 任意にキーボード入力，Enterで決定 │ ◇ Select a framework: │ React # 十字キーで選択，Enterで決定 │ ◇ Select a variant: │ TypeScript + SWC # 十字キーで選択，Enterで決定 │ Note: SWCはNext.jsでも用いられているとのこと． Add tailwindcss and @tailwindcss/vite dependencies Commit: https://github.com/Efo-YU/vite-react-tailwind-ts-swc/commit/e9eda14599f8ef6cf8fd082c6611686abbebf1c0 pnpm i tailwindcss @tailwindcss/vite Configure Tailwind CSS Commit: https://github.com/Efo-YU/vite-react-tailwind-ts-swc/commit/42633c835ac2f62520d83d1b2d50a5c5da79a237 src/App.cssを削除 src/index.cssを@import "tailwindcss"ただ一行だけにする @import "tailwindcss" vite.config.tsにtailwindcssを追加 import { defineConfig } from 'vite' import react from '@vitejs/plugin-react-swc' import tailwindcss from '@tailwindcss/vite' // https://vite.dev/config/ export default defineConfig({ plugins: [react(), tailwindcss()], }) Edit src/App.tsx 前節までで構成は完了．ただし，pnpm create vite時に生成されたsrc/App.tsxはTailwindを用いておらず，もはや使えなくなっているため，Tailwindを用いたものに変える必要がある． ...

Rebuilt my website using Hugo with PaperMod theme, which was originally created with VitePress.