本文へ移動

Basic Auth ミドルウェア ​

このミドルウェアは、指定したパスに HTTP Basic 認証を適用できます。 Cloudflare Workers や他のプラットフォームで Basic 認証を実装するのは意外と複雑ですが、このミドルウェアなら簡単です。

Basic 認証方式の内部動作については、MDN ドキュメントを参照してください。

インポート ​

ts
import { Hono } from 'hono'
import { basicAuth } from 'hono/basic-auth'

使い方 ​

ts
const app = new Hono()

app.use(
  '/auth/*',
  basicAuth({
    username: 'hono',
    password: 'acoolproject',
  })
)

app.get('/auth/page', (c) => {
  return c.text('You are authorized')
})

特定のルートとメソッドだけを制限するには:

ts
const app = new Hono()

app.get('/auth/page', (c) => {
  return c.text('Viewing page')
})

app.delete(
  '/auth/page',
  basicAuth({ username: 'hono', password: 'acoolproject' }),
  (c) => {
    return c.text('Page deleted')
  }
)

自分でユーザーを検証するには、verifyUser オプションを指定します。true を返すと認証を許可します。

ts
const app = new Hono()

app.use(
  basicAuth({
    verifyUser: (username, password, c) => {
      return (
        username === 'dynamic-user' && password === 'hono-password'
      )
    },
  })
)

オプション ​

required username: string ​

認証するユーザーのユーザー名。

required password: string ​

指定したユーザー名の認証に使用するパスワード。

optional realm: string ​

返される WWW-Authenticate チャレンジヘッダーに含める認証領域の名前。デフォルトは "Secure Area" です。
詳細:https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/WWW-Authenticate#directives

optional hashFunction: Function ​

パスワードを安全に比較するためのハッシュ処理関数。

optional verifyUser: (username: string, password: string, c: Context) => boolean | Promise<boolean> ​

ユーザーを検証する関数。

optional invalidUserMessage: string | object | MessageFunction ​

MessageFunction は (c: Context) => string | object | Promise<string | object> です。ユーザーが無効な場合のメッセージをカスタマイズします。

optional onAuthSuccess: (c: Context, username: string) => void | Promise<void> ​

認証成功後に呼び出すコールバック関数です。Authorization ヘッダーを再解析せずに、コンテキスト変数の設定や副作用の実行ができます。

ts
app.use(
  '/auth/*',
  basicAuth({
    username: 'hono',
    password: 'acoolproject',
    onAuthSuccess: (c, username) => {
      c.set('username', username)
    },
  })
)

app.get('/auth/page', (c) => {
  const username = c.get('username')
  return c.text(`Hello, ${username}!`)
})

その他のオプション ​

optional ...users: { username: string, password: string }[] ​

レシピ ​

複数ユーザーの定義 ​

このミドルウェアには、追加の username と password の組を定義するオブジェクトを、任意の数の引数として渡すこともできます。

ts
app.use(
  '/auth/*',
  basicAuth(
    {
      username: 'hono',
      password: 'acoolproject',
      // Define other params in the first object
      realm: 'www.example.com',
    },
    {
      username: 'hono-admin',
      password: 'super-secure',
      // Cannot redefine other params here
    },
    {
      username: 'hono-user-1',
      password: 'a-secret',
      // Or here
    }
  )
)

ハードコードを減らす場合:

ts
import { users } from '../config/users'

app.use(
  '/auth/*',
  basicAuth(
    {
      realm: 'www.example.com',
      ...users[0],
    },
    ...users.slice(1)
  )
)

MIT ライセンスで公開されています。