SDK

Nuxt SDK

@authon/nuxt — SSRサポート、ルートミドルウェア、サーバーサイドユーティリティを持つNuxt 3モジュール。

インストール

bash

npm install @authon/nuxt

モジュール設定

nuxt.config.ts

export default defineNuxtConfig({
  modules: ["@authon/nuxt"],

  authon: {
    publishableKey: process.env.AUTHON_PUBLISHABLE_KEY,
    secretKey: process.env.AUTHON_SECRET_KEY,
    // Redirect unauthenticated users to /sign-in
    redirectTo: "/sign-in",
    // Routes that don't require auth
    publicRoutes: ["/", "/about", "/pricing"],
  },
});

環境変数

.env

AUTHON_PUBLISHABLE_KEY=pk_live_your_key
AUTHON_SECRET_KEY=sk_live_your_key

ページでの使い方

pages/dashboard.vue

<template>
  <div>
    <AuthonSignedIn>
      <h1>Welcome, {{ user?.displayName }}</h1>
      <AuthonUserButton />
    </AuthonSignedIn>
  </div>
</template>

<script setup lang="ts">
definePageMeta({ middleware: "authon" });

const { user } = useAuthonUser();
</script>

サーバーサイド認証

server/api/protected.get.ts

import { requireAuthon } from "@authon/nuxt/server";

export default defineEventHandler(async (event) => {
  const user = await requireAuthon(event);
  // Throws 401 if not authenticated

  return {
    message: `Hello, ${user.email}!`,
    userId: user.id,
  };
});