CloudflareのTurnstileを使用して、ユーザーがボットであるかどうかを判別することができます。この機能を使用して、ボットと判定された場合にフォーム送信を制限する実装を試しました。Turnstileを管理画面からサイトに追加し、サイトキーとシークレットキーを取得します。HTMLファイルにTurnstileの設定を追加し、ボタンを無効化した状態から有効化するカスタマイズを行います。Turnstileの失敗ケースをテストする場合は、特定のSite Keyを使用します。Turnstileのドキュメントから詳細なテスト方法を確認できます。Turnstileを使用することで、簡単にボット対策ができるということです。

Cloudflareでは、Google Analytics 4（GA4）などのサードパーティツールを利用するための仕組みが提供されています。この仕組みを利用すると、サイトやアプリケーションのコードを変更せずに、トラッキングコードなどを追加することができます。具体的な設定手順についても説明されており、Zarasというツールを使用することで、GA4の機能を追加することができます。Zarasを使用することで、カスタムなトラッキングを行いたい場合に便利であり、メンテナンスの手間も軽減されるとのことです。また、WordPressなどの管理画面から設定するわけではないため、ユーザーの操作ミスによる問題も避けられます。

先日Supabaseの方に開発者イベントへお誘い頂きました。触らずに登壇するのも気が引けるので、アカウント作成や簡単に管理画面を触ってみた時の覚書です。 Supabaseとは https://supabase.com/ […]

HonoはAPI機能に特化したフレームワークで、Cloudflare Workersで使用できます。Honoを使う場合、Cloudflare Workersでは環境変数やbindingsを処理してくれるので非常に便利です。また、Cloudflare WorkersでHonoを使用しない場合、fetch関数をexportする必要があります。しかし、Honoではその仕組みを持っており、fetchだけをHonoにすることで、APIやcronジョブを動かすことができます。さらに、Honoにはscheduleなどの関数を追加することもできます。HonoはREST APIの提供に特化しているため、scheduleなどの機能は他のプラットフォームでデプロイする際に問題が発生する可能性があります。そのため、fetch関数に集中して再利用可能な処理やバインドなどを追加するのが良いと思われます。

CloudflareのオブジェクトストレージサービスR2を使用してVectorデータのストア先を試した結果、ストレージの作り方に手間取ったが、手順をまとめる。R2バケットはWraglerから作成可能。ローカル開発環境では2つのバケットが必要。プレビュー用のR2バケットを作成し、WranglerでアプリのBindingsに追加する。HonoからR2バケットを呼び出す方法についても解説。ただし、R2にJSONデータを配置する方法は効率的ではなく、Cloudflare Vectorizeなど他のベクターストアを使用することが推奨される。しかし、R2バケットの扱い方は覚えたので結果は良い。

Cloudflare Workers AIは、Workersから利用するためのAIサービスで、APIトークンを取得してREST APIを使用することで利用できます。記事では、APIトークンの取得方法やcURLを使用したREST APIの実行方法が紹介されています。また、リクエストBodyに質問を入れることでLLMに対して質問を送ることもできます。Cloudflareは、世界中のウェブサイトに安全性、高速化、可用性を提供するサービスプロバイダーであり、日本でも利用が増えています。Workers AIの恩恵を受けるためには、APIトークンの作成とREST APIの呼び出し方を理解する必要があります。

Cloudflare Meetup Kobe Kick Off!では、「WordPressとhonoで、Cloudflare Workersプロキシパターンをやってみた」というセッションが行われました。このセッションでは、BASIC認証やレスポンスの書き換えなどが紹介され、実際の案件でも活用できる可能性があります。次は、Cloudflare CDNとWorkersの併用に挑戦して、特定のパスでのみBASIC認証を設定するなど、より具体的な用途での活用を考えています。Cloudflare CDNでもルールを設定できるので、例えば「wp-admin以下だけWorkersを通る」といった設定も試してみたいと思っています。

Kansai WordPress Meetupでは、ブロックパターンを使ったデモサイトやLPの作成についてセッションが行われました。ブロックエディタでは、クエリーループブロックを使用することで、任意のカテゴリーやタグの記事をサイトや記事・固定ページに追加できます。WordPressの立ち位置については、ページ・ウェブサイトビルダー機能を持つOSSのCMSとして紹介されました。また、Toro_Unitのセッションでは、デザインシステムを提供・組み込むCMSとして位置付けられていました。次のWordPress系での登壇はWordCamp Tokyo 2023であり、AI・LLMに関する話題も含まれる予定です。

このテキストは、個人的な興味からCloudflare Turnstileの組み込みを試した経験について述べています。Cloudflareエバンジェリスト亀田さんの公開資料が参考になり、TurnstileをHonoで動かすことに挑戦しました。ローカル環境で動かすためにWranglerを使用し、Turnstileのキーを設定します。Honoを使用して認証ページを作成し、Honoでサーバー側の検証処理も行います。Honoの使い方には慣れが必要ですが、ルーティングの部分は書きやすくなりました。HonoとReactを組み合わせるか、Cloudflare PagesのfunctionsとしてHonoをデプロイする方法も考えられます。

Stripe APIをkintoneのApp Proxyから呼び出すための方法を紹介しました。kintoneプラグインのAPIプロキシー機能を使用することで安全にAPIキーを管理できます。Formデータを作成する際にはURLSearchParamsを使用する方法が良いです。また、Stripeとkintoneを連携させるために、kintoneプラグイン経由でStripe APIを呼び出すサンプルコードも紹介しました。