--- title: "認証の有効化" url: https://docs.catalyst.zoho.com/ja/tutorials/photo-store-app/nodejs/enable-auth/ description: "Stratusのバケットに画像をアップロードし、他の登録ユーザーと画像を共有するReactギャラリーアプリを構築します。AppSailでアプリをホストし、GitHubと同期してPipelinesでアプリをデプロイします。" last_updated: 2026-08-17T12:16:04Z service: All Services type: tutorial related_links: - name: "Catalyst Authentication" url: /ja/cloud-scale/help/authentication/introduction/ - name: "ホスト型認証" url: /ja/cloud-scale/help/authentication/native-catalyst-authentication/hosted-authentication-type/introduction/ --- # 認証の有効化 このチュートリアルでは、**Hosted Authentication**タイプを有効にします。このネイティブ認証タイプにより、各ログイン要素専用のページが提供されます。 アプリケーションでHosted Authenticationタイプを有効にするには： 1. *Security and Identity*の下にある**Authentication**コンポーネントに移動し、[Native Catalyst Authentication](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/native-catalyst-authentication/introduction/)オプションで**Set Up**をクリックします。 ![catalyst_tutorials_photostore_authentication_first_look](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_authentication_first_look.webp) 2. **Hosted Authentication**を選択し、**Next**をクリックします。 ![catalyst_tutorials_photostore_hosted_auth_type_sel](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_hosted_auth_type_sel.webp) > **Info:** * [Hosted Authenticationタイプについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/native-catalyst-authentication/hosted-authentication-type/introduction/)。 * [Embedded Authenticationタイプについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/native-catalyst-authentication/embedded-authentication/introduction/)。 * [サードパーティ認証タイプについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/third-party-authentication/introduction/)。 3. ブランド名を入力し、ロゴを画像としてアップロードします。コンソールのカラーパレットを使用してログイン要素のスタイルを設定できます。右側の*Preview*セクションを使用して、お好みに合わせてログイン要素をデザインしてください。 ![catalyst_tutorials_photostore_hosted_auth_setip_inprog](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_hosted_auth_setip_inprog.webp) > **Note:** *Preview*セクションを使用して、**Sign In**、**Sign Up**、**Password Reset**、**Confirm Password**のログイン要素のスタイルを同時に確認できます。ただし、**Sign Up**ページを表示するには、**Public Signup**を有効にする必要があります。**Public Signup**を有効にする手順は以下に詳述されています。 4. トグルボタンをクリックして*Public Signup*を有効にします。 ![catalyst_tutorials_photostore_hosted_auth_public_toggle](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_hosted_auth_public_toggle.webp) 情報ポップアップを読み、**Yes, Proceed**をクリックします。 ![catalyst_tutorials_photostore_toggle_confirm](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_toggle_confirm.webp) > **Info:** [Public Signupについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/public-signup/)。 5. お好みに応じて、任意の**Social Logins**を有効にできます。 ![catalyst_tutorials_photostore_hosted_auth_social_login](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_hosted_auth_social_login.webp) > **Info:** [他のSocial Loginsの設定に必要な`Client ID`と`Client Secret`の資格情報を生成する手順を学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/social-logins/configuring-social-logins/)。 6. 現時点では**Additional Settings**セクションをスキップします。このセクションにある**Authorized Domains**機能は、後のステップで再度確認します。**Finish**をクリックします。 ![catalyst_tutorials_photostore_addn_settings](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_addn_settings.webp) アプリケーションでHosted Authenticationが有効になります。 *Authentication* Typesセクションで、各ログイン要素に対して生成されたスタイルとセキュアアクセスURLを確認できます。 ![catalyst_tutorials_photostore_auth_done](https://catalyst-docs-development.zohostratus.in/images/tutorials/photo-store/catalyst_tutorials_photostore_auth_done.webp) > **Info:** 残りのセクションはアプリケーションの機能には必要ありません。ただし、以下のリンクからそれらについて学ぶことができます： * [Authentication Typesについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/authentication-types/)。 * [User Managementについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/user-management/introduction/)。 * [ホワイトリストについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/whitelisting/introduction/)。 * [メールテンプレートについて詳しく学ぶ](https://docs.catalyst.zoho.com/ja/cloud-scale/help/authentication/email-templates/introduction/)。