MastraAuthAuth0 クラス

MastraAuthAuth0 クラスは、Auth0 を用いて Mastra の認証を提供します。Auth0 が発行した JWT トークンで受信リクエストを検証し、experimental_auth オプションを使用して Mastra サーバーと連携します。

前提条件

この例では Auth0 認証を使用します。次のことを行ってください：

auth0.com で Auth0 アカウントを作成する
Auth0 ダッシュボードでアプリケーションを設定する
識別子（audience）を指定して Auth0 ダッシュボードで API を設定する
アプリケーションの許可済みコールバック URL、Web オリジン、ログアウト URL を設定する

.env


AUTH0_DOMAIN=あなたのテナント名.auth0.com
AUTH0_AUDIENCE=あなたのAPI識別子

注意: ドメインは Auth0 Dashboard の Applications > Settings で確認できます。audience は Auth0 Dashboard > APIs で設定された API の識別子です。

詳細なセットアップ手順については、ご利用のプラットフォーム向けの Auth0 quickstarts を参照してください。

インストール

MastraAuthAuth0 クラスを使用する前に、@mastra/auth-auth0 パッケージをインストールする必要があります。


npm install @mastra/auth-auth0@latest

使用例

環境変数を使った基本的な使い方

src/mastra/index.ts


import { Mastra } from "@mastra/core/mastra";
import { MastraAuthAuth0 } from '@mastra/auth-auth0';
 
export const mastra = new Mastra({
  // ..
  server: {
    experimental_auth: new MastraAuthAuth0(),
  },
});

カスタム設定

src/mastra/index.ts


import { Mastra } from "@mastra/core/mastra";
import { MastraAuthAuth0 } from '@mastra/auth-auth0';
 
export const mastra = new Mastra({
  // ..
  server: {
    experimental_auth: new MastraAuthAuth0({
      domain: process.env.AUTH0_DOMAIN,
      audience: process.env.AUTH0_AUDIENCE
    }),
  },
});

構成

ユーザー認可

デフォルトでは、MastraAuthAuth0 は指定した audience 向けの有効な Auth0 トークンを持つ認証済みユーザーをすべて許可します。トークン検証では次の点を確認します:

トークンが Auth0 により正しく署名されていること
トークンの有効期限が切れていないこと
トークンの audience が設定した audience と一致していること
トークンの issuer があなたの Auth0 ドメインと一致していること

ユーザー認可をカスタマイズするには、カスタムの authorizeUser 関数を指定します:

src/mastra/auth.ts


import { MastraAuthAuth0 } from '@mastra/auth-auth0';
 
const auth0Provider = new MastraAuthAuth0({
  authorizeUser: async (user) => {
    // カスタムの認可ロジック
    return user.email?.endsWith('@yourcompany.com') || false;
  }
});

利用可能なすべての設定オプションについては、MastraAuthAuth0 の API リファレンスを参照してください。

クライアント側のセットアップ

Auth0 認証を使用する場合は、Auth0 React SDK を設定し、ユーザーを認証して、Mastra へのリクエストに渡すためのアクセストークンを取得する必要があります。

Auth0 React SDK のセットアップ

まず、アプリケーションに Auth0 React SDK をインストールして設定します。


npm install @auth0/auth0-react

src/auth0-provider.tsx


import React from 'react';
import { Auth0Provider } from '@auth0/auth0-react';
 
const Auth0ProviderWithHistory = ({ children }) => {
  return (
    <Auth0Provider
      domain={process.env.REACT_APP_AUTH0_DOMAIN}
      clientId={process.env.REACT_APP_AUTH0_CLIENT_ID}
      authorizationParams={{
        redirect_uri: window.location.origin,
        audience: process.env.REACT_APP_AUTH0_AUDIENCE,
        scope: "read:current_user update:current_user_metadata"
      }}
    >
      {children}
    </Auth0Provider>
  );
};
 
export default Auth0ProviderWithHistory;

アクセストークンの取得

Auth0 React SDK を使用してユーザーを認証し、アクセストークンを取得します。

lib/auth.ts


import { useAuth0 } from '@auth0/auth0-react';
 
export const useAuth0Token = () => {
  const { getAccessTokenSilently } = useAuth0();
 
  const getAccessToken = async () => {
    const token = await getAccessTokenSilently();
    return token;
  };
 
  return { getAccessToken };
};

さらなる認証方法や設定オプションについては、Auth0 React SDK のドキュメントをご参照ください。

`MastraClient` の設定

experimental_auth が有効な場合、MastraClient によるすべてのリクエストには、Authorization ヘッダーに有効な Auth0 アクセストークンを含める必要があります。

lib/mastra/mastra-client.ts


import { MastraClient } from "@mastra/client-js";
 
export const createMastraClient = (accessToken: string) => {
  return new MastraClient({
    baseUrl: "https://<mastra-api-url>",
    headers: {
      Authorization: `Bearer ${accessToken}`
    }
  });
};

注意: Authorization ヘッダーでは、アクセストークンの前に Bearer を付ける必要があります。

さらなる設定オプションについては、Mastra Client SDK を参照してください。

認証済みリクエストの送信

MastraClient に Auth0 のアクセストークンを設定したら、認証済みリクエストを送信できます。

src/components/mastra-api-test.tsx


import React, { useState } from 'react';
import { useAuth0 } from '@auth0/auth0-react';
import { MastraClient } from '@mastra/client-js';
 
export const MastraApiTest = () => {
  const { getAccessTokenSilently } = useAuth0();
  const [result, setResult] = useState(null);
 
  const callMastraApi = async () => {
    const token = await getAccessTokenSilently();
 
    const mastra = new MastraClient({
      baseUrl: "http://localhost:4111",
      headers: {
        Authorization: `Bearer ${token}`
      }
    });
 
    const weatherAgent = mastra.getAgent("weatherAgent");
    const response = await weatherAgent.generate({
      messages: "What's the weather like in New York"
    });
 
    setResult(response.text);
  };
 
  return (
    <div>
      <button onClick={callMastraApi}>
        Test Mastra API
      </button>
 
      {result && (
        <div className="result">
          <h6>Result:</h6>
          <pre>{result}</pre>
        </div>
      )}
    </div>
  );
};

MastraAuthAuth0 クラス

前提条件

この例では Auth0 認証を使用します。次のことを行ってください：

auth0.com で Auth0 アカウントを作成する
Auth0 ダッシュボードでアプリケーションを設定する
識別子（audience）を指定して Auth0 ダッシュボードで API を設定する
アプリケーションの許可済みコールバック URL、Web オリジン、ログアウト URL を設定する

.env


AUTH0_DOMAIN=あなたのテナント名.auth0.com
AUTH0_AUDIENCE=あなたのAPI識別子

注意: ドメインは Auth0 Dashboard の Applications > Settings で確認できます。audience は Auth0 Dashboard > APIs で設定された API の識別子です。

詳細なセットアップ手順については、ご利用のプラットフォーム向けの Auth0 quickstarts を参照してください。

インストール

MastraAuthAuth0 クラスを使用する前に、@mastra/auth-auth0 パッケージをインストールする必要があります。


npm install @mastra/auth-auth0@latest

使用例

環境変数を使った基本的な使い方

src/mastra/index.ts


import { Mastra } from "@mastra/core/mastra";
import { MastraAuthAuth0 } from '@mastra/auth-auth0';
 
export const mastra = new Mastra({
  // ..
  server: {
    experimental_auth: new MastraAuthAuth0(),
  },
});

カスタム設定

src/mastra/index.ts


import { Mastra } from "@mastra/core/mastra";
import { MastraAuthAuth0 } from '@mastra/auth-auth0';
 
export const mastra = new Mastra({
  // ..
  server: {
    experimental_auth: new MastraAuthAuth0({
      domain: process.env.AUTH0_DOMAIN,
      audience: process.env.AUTH0_AUDIENCE
    }),
  },
});

構成

ユーザー認可

トークンが Auth0 により正しく署名されていること
トークンの有効期限が切れていないこと
トークンの audience が設定した audience と一致していること
トークンの issuer があなたの Auth0 ドメインと一致していること

ユーザー認可をカスタマイズするには、カスタムの authorizeUser 関数を指定します:

src/mastra/auth.ts


import { MastraAuthAuth0 } from '@mastra/auth-auth0';
 
const auth0Provider = new MastraAuthAuth0({
  authorizeUser: async (user) => {
    // カスタムの認可ロジック
    return user.email?.endsWith('@yourcompany.com') || false;
  }
});

利用可能なすべての設定オプションについては、MastraAuthAuth0 の API リファレンスを参照してください。

クライアント側のセットアップ

Auth0 React SDK のセットアップ

まず、アプリケーションに Auth0 React SDK をインストールして設定します。


npm install @auth0/auth0-react

src/auth0-provider.tsx


import React from 'react';
import { Auth0Provider } from '@auth0/auth0-react';
 
const Auth0ProviderWithHistory = ({ children }) => {
  return (
    <Auth0Provider
      domain={process.env.REACT_APP_AUTH0_DOMAIN}
      clientId={process.env.REACT_APP_AUTH0_CLIENT_ID}
      authorizationParams={{
        redirect_uri: window.location.origin,
        audience: process.env.REACT_APP_AUTH0_AUDIENCE,
        scope: "read:current_user update:current_user_metadata"
      }}
    >
      {children}
    </Auth0Provider>
  );
};
 
export default Auth0ProviderWithHistory;

アクセストークンの取得

Auth0 React SDK を使用してユーザーを認証し、アクセストークンを取得します。

lib/auth.ts


import { useAuth0 } from '@auth0/auth0-react';
 
export const useAuth0Token = () => {
  const { getAccessTokenSilently } = useAuth0();
 
  const getAccessToken = async () => {
    const token = await getAccessTokenSilently();
    return token;
  };
 
  return { getAccessToken };
};

さらなる認証方法や設定オプションについては、Auth0 React SDK のドキュメントをご参照ください。

`MastraClient` の設定

lib/mastra/mastra-client.ts


import { MastraClient } from "@mastra/client-js";
 
export const createMastraClient = (accessToken: string) => {
  return new MastraClient({
    baseUrl: "https://<mastra-api-url>",
    headers: {
      Authorization: `Bearer ${accessToken}`
    }
  });
};

注意: Authorization ヘッダーでは、アクセストークンの前に Bearer を付ける必要があります。

さらなる設定オプションについては、Mastra Client SDK を参照してください。

認証済みリクエストの送信

MastraClient に Auth0 のアクセストークンを設定したら、認証済みリクエストを送信できます。

src/components/mastra-api-test.tsx


import React, { useState } from 'react';
import { useAuth0 } from '@auth0/auth0-react';
import { MastraClient } from '@mastra/client-js';
 
export const MastraApiTest = () => {
  const { getAccessTokenSilently } = useAuth0();
  const [result, setResult] = useState(null);
 
  const callMastraApi = async () => {
    const token = await getAccessTokenSilently();
 
    const mastra = new MastraClient({
      baseUrl: "http://localhost:4111",
      headers: {
        Authorization: `Bearer ${token}`
      }
    });
 
    const weatherAgent = mastra.getAgent("weatherAgent");
    const response = await weatherAgent.generate({
      messages: "What's the weather like in New York"
    });
 
    setResult(response.text);
  };
 
  return (
    <div>
      <button onClick={callMastraApi}>
        Test Mastra API
      </button>
 
      {result && (
        <div className="result">
          <h6>Result:</h6>
          <pre>{result}</pre>
        </div>
      )}
    </div>
  );
};

MastraAuthAuth0 クラス

前提条件

インストール

使用例

環境変数を使った基本的な使い方

カスタム設定

構成

ユーザー認可

クライアント側のセットアップ

Auth0 React SDK のセットアップ

アクセストークンの取得

MastraClient の設定

認証済みリクエストの送信

MastraAuthAuth0 クラス

前提条件

インストール

使用例

環境変数を使った基本的な使い方

カスタム設定

構成

ユーザー認可

クライアント側のセットアップ

Auth0 React SDK のセットアップ

アクセストークンの取得

MastraClient の設定

認証済みリクエストの送信

`MastraClient` の設定

`MastraClient` の設定