MENU

Blog

ブログ

2024.06.13

Hono, Firebase AuthでToken検証してみる。@hono/firebase-authを使ってみよう!Cloudflare workersで定義する関数に認証チェックをつける

[Cloudflare]Hono, Firebase AuthでToken検証してみる。

honoでToken検証をしてみようと考え実装してみたら、想像以上にお手軽でしたので紹介します。
環境を立てれていない方や、Cloudflare workers,honoでサーバーレス関数をデプロイしてみたい方などは以下の記事にて実装方法を紹介していますのでぜひご覧ください!

Cloudflareサービスを使ってみよう!bunとWorkersでサーバーレス関数をデプロイしてみよう!

早速本題に入ります!まずはfirebase-authをインストールしましょう!

bun i @hono/firebase-auth

wrangler.tomlにkv等の設定をする

cloudflare kvのidやfirebaseのproject idを記載してください

[vars]
PROJECT_ID = "{firebase project name}"
PUBLIC_JWK_CACHE_KEY = "{任意の文字列}"

[[kv_namespaces]]
binding = "PUBLIC_JWK_CACHE_KV"
id = "{your kv id}"

src/index.tsに検証するための処理を記載する

以下の処理でリクエストの検証がされるのではないでしょうか?curl -H “Authorization: Bearer YOUR_ACCESS_TOKEN” https://example.com/api/usersなどでtoken検証されているか確認してみてください!

import { Hono } from 'hono'
import { VerifyFirebaseAuthConfig, VerifyFirebaseAuthEnv, verifyFirebaseAuth } from '@hono/firebase-auth'
import { userApp } from './controllers/users' // コントローラに分けています!

const config: VerifyFirebaseAuthConfig = {
  projectId: '{firebase project name}',
}

const app = new Hono<{ Bindings: VerifyFirebaseAuthEnv }>().basePath('/api')

app.use('*', verifyFirebaseAuth(config))

app.route('/users', userApp) // app.routeで記述したものはtoken検証が行われます!

honoでfirebase auth のtokenをフロントから検証してみたい際はぜひ試してみてください。

最後までご覧頂きありがとうございました!
web開発やweb制作、デザイン制作等相談がありましたら、longtownにお気軽にお問い合わせください

ブログカテゴリー

WEB開発