使用 Twitter 帳戶設定註冊和登入 - Azure AD B2C

發行項
11/08/2023

開始之前，請使用 [選擇原則類型 選取器] 來選擇您要設定的原則類型。 Azure Active Directory B2C 提供兩種方法來定義使用者如何與您的應用程式互動：透過預先定義的使用者流程，或透過完全可設定的自定義原則。本文中每個方法所需的步驟都不同。

注意

在 Azure Active Directory B2C 中，自定義原則的設計主要是為了解決複雜的案例。在大部分情況下，我們建議您使用內建的使用者流程。如果您尚未這麼做，請了解開始使用 Active Directory B2C 中的自定義原則入門套件。

必要條件

建立使用者流程，讓使用者可以註冊並登入您的應用程式。
註冊 Web 應用程式。

完成開始使用 Active Directory B2C 中的自定義原則中的步驟
註冊 Web 應用程式。

建立應用程式

若要在 Azure AD B2C 中為具有 Twitter 帳戶的使用者啟用登入，您需要建立 Twitter 應用程式。如果您還沒有 Twitter 帳戶，您可以在註冊 https://twitter.com/signup。您也需要申請開發人員帳戶。如需詳細資訊，請參閱套用存取權。

使用您的 Twitter 帳戶認證登入 Twitter 開發人員入口網站。
選取 [+ 建立專案 ] 按鈕。
在 [項目名稱] 索引標籤下，輸入您專案的慣用名稱，然後選取 [ 下一步] 按鈕。
在 [使用案例] 索引標籤下 ，選取您慣用的使用案例 ，然後選取 [ 下一步]。
在 [專案描述] 索引標籤下，輸入您的專案描述，然後選取 [下一步] 按鈕。
在 [ 應用程式名稱] 索引標籤下，輸入應用程式的名稱，例如 azureadb2c，然後選取 [下一步] 按鈕。
在 [金鑰令牌] & 索引標籤下，複製 [API 金鑰] 和 [API 金鑰密碼] 的值。您稍後會使用這些設定。
選取 [應用程式設定 ] 以開啟應用程式設定。
在頁面的下半部，在 [用戶驗證設定] 底下，選取 [設定]。
在 [應用程式類型] 底下，選取適當的應用程式類型，例如 Web 應用程式。
在 [應用程式資訊] 底下：
1. 針對 [ 回呼 URI/重新導向 URL]，輸入 https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com/your-policy-id/oauth1/authresp。如果您使用自訂網域，請輸入 https://your-domain-name/your-tenant-name.onmicrosoft.com/your-user-flow-Id/oauth1/authresp。輸入租使用者名稱和使用者流程標識碼時，請使用所有小寫字母，即使他們在 Azure AD B2C 中以大寫字母定義也一樣。取代：
  - your-tenant-name 具有租用戶名稱的名稱。
  - your-domain-name 使用您的自定義網域。
  - your-policy-id 使用使用者流程的標識碼。例如： b2c_1a_signup_signin_twitter 。
2. 針對 [ 網站 URL]，輸入 https://your-tenant.b2clogin.com。將取代 your-tenant 為您的租用戶名稱。例如： https://contosob2c.b2clogin.com 。如果您使用自訂網域，請輸入 https://your-domain-name。
3. （選擇性）輸入服務條款的網址，例如 http://www.contoso.com/tos。原則 URL 是您維護的頁面，可為您的應用程式提供條款和條件。
4. （選擇性）輸入隱私策略的網址，例如 http://www.contoso.com/privacy。原則 URL 是您維護的頁面，可為您的應用程式提供隱私權資訊。
選取 [儲存]。

使用您的 Twitter 帳戶認證登入 Twitter 開發人員入口網站。
選取 [+ 建立專案 ] 按鈕。
在 [項目名稱] 索引標籤下，輸入您專案的慣用名稱，然後選取 [ 下一步] 按鈕。
在 [使用案例] 索引標籤下 ，選取您慣用的使用案例 ，然後選取 [ 下一步]。
在 [專案描述] 索引標籤下，輸入您的專案描述，然後選取 [下一步] 按鈕。
在 [ 應用程式名稱] 索引標籤下，輸入應用程式的名稱，例如 azureadb2c，然後選取 [下一步] 按鈕。
在 [金鑰&令牌] 索引標籤，複製 API 金鑰和 API 金鑰秘密的值以供稍後使用。您可以使用這兩者，將 Twitter 設定為 Azure AD B2C 租使用者中的識別提供者。
選取 [應用程式設定 ] 以開啟應用程式設定。
在頁面的下半部，在 [用戶驗證設定] 底下，選取 [設定]。
在 [應用程式類型] 底下，選取適當的應用程式類型，例如 Web 應用程式。
在 [應用程式資訊] 底下：
1. 針對 [ 回呼 URI/重新導向 URL]，輸入 https://your-tenant.b2clogin.com/your-tenant-name.onmicrosoft.com/your-user-flow-name/oauth1/authresp。如果您使用自訂網域，請輸入 https://your-domain-name/your-tenant-name.onmicrosoft.com/your-user-flow-Id/oauth1/authresp。輸入租使用者名稱和使用者流程標識碼時，請使用所有小寫字母，即使他們在 Azure AD B2C 中以大寫字母定義也一樣。取代：
  - your-tenant-name 具有租用戶名稱的名稱。
  - your-domain-name 使用您的自定義網域。
  - your-user-flow-name 使用使用者流程的標識碼。例如： b2c_1_signup_signin_twitter 。
2. 針對 [ 網站 URL]，輸入 https://your-tenant.b2clogin.com。將取代 your-tenant 為您的租用戶名稱。例如： https://contosob2c.b2clogin.com 。如果您使用自訂網域，請輸入 https://your-domain-name。
3. 輸入服務條款的網址，例如 http://www.contoso.com/tos。原則 URL 是您維護的頁面，可為您的應用程式提供條款和條件。
4. 輸入隱私策略的網址，例如 http://www.contoso.com/privacy。原則 URL 是您維護的頁面，可為您的應用程式提供隱私權資訊。
選取 [儲存]。

將 Twitter 設定為識別提供者

以 Azure AD B2C 租使用者的全域管理員身分登入 Azure 入口網站。
如果您有多個租使用者的存取權，請選取頂端功能表中的設定 圖示，從 [目錄 + 訂用帳戶] 功能表切換至您的 Azure AD B2C 租使用者。
選擇 Azure 入口網站左上角的 [所有服務]，搜尋並選取 [Azure AD B2C]。
選取 [ 識別提供者]，然後選取 [Twitter]。
輸入名稱。例如， Twitter。
針對 [ 用戶端識別符]，輸入 您稍早建立之 Twitter 應用程式的 API 金鑰 。
針對 [ 客戶端密碼]，輸入您記錄的 API 金鑰秘密 。
選取 [儲存]。

將 Twitter 識別提供者新增至使用者流程

此時，Twitter 身分識別提供者已設定，但尚未在任何登入頁面中提供。若要將 Twitter 識別提供者新增至使用者流程：

在您的 Azure AD B2C 租使用者中，選取 [ 使用者流程]。
選取您想要新增 Twitter 身分識別提供者的使用者流程。
在 [ 社交識別提供者] 底下，選取 [Twitter]。
選取 [儲存]。

測試您的使用者流程

若要測試您的原則，請選取 [ 執行使用者流程]。
針對 [ 應用程式]，選取您先前註冊的名為 testapp1 的Web應用程式。回覆 URL 應該會顯示 https://jwt.ms。
選取 [ 執行使用者流程 ] 按鈕。
從註冊或登入頁面，選取 [Twitter] 以使用 Twitter 帳戶登入。

建立原則金鑰

您必須將您先前為 Twitter 應用程式記錄的秘密金鑰儲存在 Azure AD B2C 租使用者中。

登入 Azure 入口網站。
如果您有多個租使用者的存取權，請選取頂端功能表中的 [設定] 圖示，從 [目錄 + 訂用帳戶] 功能表切換至您的 Azure AD B2C 租使用者。
在 Azure 入口網站中，搜尋並選取 [Azure AD B2C]。
在左側功能表的 [原則] 底下，選取 [身分識別體驗架構]。
選取 [ 原則密鑰 ]，然後選取 [ 新增]。
針對 [ 選項]，選擇 Manual。
輸入 原則金鑰的 [名稱 ]。例如： TwitterSecret 。前置詞 B2C_1A_ 會自動新增至金鑰的名稱。
針對 [ 秘密]，輸入 您先前記錄的 API 金鑰秘密 值。
針對 [ 金鑰使用方式]，選取 Signature。
按一下 [建立]。

將 Twitter 設定為識別提供者

若要讓使用者使用 Twitter 帳戶登入，您必須將帳戶定義為 Azure AD B2C 可以透過端點進行通訊的宣告提供者。端點提供一組宣告，供 Azure AD B2C 用來驗證特定使用者已驗證。

您可以將 Twitter 帳戶新增至 原則延伸檔案中的 ClaimsProviders 元素，將它定義為宣告提供者。請參閱本文必要條件中下載的自定義原則入門套件。

開啟 TrustFrameworkExtensions.xml。
尋找 ClaimsProviders 元素。如果不存在，請在根元素底下新增它。

新增 ClaimsProvider，如下所示：

<ClaimsProvider>
  <Domain>twitter.com</Domain>
  <DisplayName>Twitter</DisplayName>
  <TechnicalProfiles>
    <TechnicalProfile Id="Twitter-OAuth1">
      <DisplayName>Twitter</DisplayName>
      <Protocol Name="OAuth1" />
      <Metadata>
        <Item Key="ProviderName">Twitter</Item>
        <Item Key="authorization_endpoint">https://api.twitter.com/oauth/authenticate</Item>
        <Item Key="access_token_endpoint">https://api.twitter.com/oauth/access_token</Item>
        <Item Key="request_token_endpoint">https://api.twitter.com/oauth/request_token</Item>
        <Item Key="ClaimsEndpoint">https://api.twitter.com/1.1/account/verify_credentials.json?include_email=true</Item>
        <Item Key="ClaimsResponseFormat">json</Item>
        <Item Key="client_id">Your Twitter application API key</Item>
      </Metadata>
      <CryptographicKeys>
        <Key Id="client_secret" StorageReferenceId="B2C_1A_TwitterSecret" />
      </CryptographicKeys>
      <OutputClaims>
        <OutputClaim ClaimTypeReferenceId="issuerUserId" PartnerClaimType="user_id" />
        <OutputClaim ClaimTypeReferenceId="displayName" PartnerClaimType="screen_name" />
        <OutputClaim ClaimTypeReferenceId="email" />
        <OutputClaim ClaimTypeReferenceId="identityProvider" DefaultValue="twitter.com" />
        <OutputClaim ClaimTypeReferenceId="authenticationSource" DefaultValue="socialIdpAuthentication" />
      </OutputClaims>
      <OutputClaimsTransformations>
        <OutputClaimsTransformation ReferenceId="CreateRandomUPNUserName" />
        <OutputClaimsTransformation ReferenceId="CreateUserPrincipalName" />
        <OutputClaimsTransformation ReferenceId="CreateAlternativeSecurityId" />
        <OutputClaimsTransformation ReferenceId="CreateSubjectClaimFromAlternativeSecurityId" />
      </OutputClaimsTransformations>
      <UseTechnicalProfileForSessionManagement ReferenceId="SM-SocialLogin" />
    </TechnicalProfile>
  </TechnicalProfiles>
</ClaimsProvider>

將 client_id 的值取代為您先前記錄的 API 金鑰。
儲存檔案。

新增使用者旅程圖

此時，識別提供者已設定，但尚未在任何登入頁面中提供。如果您沒有自己的自定義使用者旅程圖，請建立現有範本使用者旅程圖的重複項目，否則請繼續進行下一個步驟。

從入門套件開啟 TrustFrameworkBase.xml 檔案。
尋找並複製包含 Id="SignUpOrSignIn"之 UserJourney 元素的整個內容。
開啟 TrustFrameworkExtensions.xml 並尋找 UserJourneys 元素。如果專案不存在，請新增一個。
貼上您複製為 UserJourneys 元素子系之 UserJourney 元素的整個內容。
重新命名使用者旅程圖的標識碼。例如： Id="CustomSignUpSignIn" 。

將識別提供者新增至使用者旅程圖

現在您已擁有使用者旅程圖，請將新的識別提供者新增至使用者旅程圖。您必須先新增登入按鈕，然後將按鈕連結至動作。動作是您稍早建立的技術配置檔。

尋找在 Type="CombinedSignInAndSignUp"使用者旅程圖中包含或 Type="ClaimsProviderSelection" 的協調流程步驟元素。通常是第一個協調流程步驟。 ClaimsProviderSelections 元素包含使用者可以登入的識別提供者清單。元素的順序會控制向用戶呈現的登入按鈕順序。 新增 ClaimsProviderSelection XML 元素。將 TargetClaimsExchangeId 的值設定為易記名稱。
在下一個 協調流程步驟中，新增 ClaimsExchange 元素。將標識符設定為目標宣告交換標識碼的值。將TechnicalProfileReferenceId的值更新為您稍早建立之技術配置檔的標識碼。

下列 XML 示範使用者旅程圖的前兩個協調流程步驟與識別提供者：

<OrchestrationStep Order="1" Type="CombinedSignInAndSignUp" ContentDefinitionReferenceId="api.signuporsignin">
  <ClaimsProviderSelections>
    ...
    <ClaimsProviderSelection TargetClaimsExchangeId="TwitterExchange" />
  </ClaimsProviderSelections>
  ...
</OrchestrationStep>

<OrchestrationStep Order="2" Type="ClaimsExchange">
  ...
  <ClaimsExchanges>
    <ClaimsExchange Id="TwitterExchange" TechnicalProfileReferenceId="Twitter-OAuth1" />
  </ClaimsExchanges>
</OrchestrationStep>

設定信賴憑證者原則

信賴憑證者原則，例如 SignUpSignIn.xml，會指定 Azure AD B2C 將執行的使用者旅程圖。 尋找信賴憑證者內的DefaultUserJourney元素。 更新 ReferenceId 以符合您新增識別提供者的使用者旅程圖標識碼。

在下列範例中 CustomSignUpSignIn ，針對使用者旅程圖， ReferenceId 會設定為 CustomSignUpSignIn：

<RelyingParty>
  <DefaultUserJourney ReferenceId="CustomSignUpSignIn" />
  ...
</RelyingParty>

上傳自定義原則

登入 Azure 入口網站。
在入口網站工具列中選取 [ 目錄 + 訂 用帳戶] 圖示，然後選取包含 Azure AD B2C 租使用者的目錄。
在 Azure 入口網站中，搜尋並選取 [Azure AD B2C]。
在 [原則] 底下，選取 [身分識別體驗架構]。
選取 [ 上傳自定義原則]，然後上傳您變更的兩個原則檔案，順序如下：擴充原則，例如 TrustFrameworkExtensions.xml，然後是信賴憑證者原則，例如 SignUpSignIn.xml。

測試您的自定義原則

選取您的信賴憑證者原則，例如 B2C_1A_signup_signin。
針對 [ 應用程式]，選取您先前註冊的 Web 應用程式。回覆 URL 應該會顯示 https://jwt.ms。
選取 [ 立即執行] 按鈕。
從註冊或登入頁面，選取 [Twitter] 以使用 Twitter 帳戶登入。

如果登入程式成功，您的瀏覽器會重新導向至 https://jwt.ms，以顯示 Azure AD B2C 所傳回令牌的內容。

提示

如果您在測試此識別提供者時遇到unauthorized錯誤，請確定您使用正確的 Twitter API 金鑰和 API 金鑰秘密，或嘗試套用提升許可權的存取權。此外，如果您已在提供此功能之前註冊應用程式，建議您查看 Twitter 的項目結構。

共用方式為

必要條件

建立應用程式

將 Twitter 設定為識別提供者

將 Twitter 識別提供者新增至使用者流程

測試您的使用者流程

建立原則金鑰

將 Twitter 設定為識別提供者

新增使用者旅程圖

將識別提供者新增至使用者旅程圖

設定信賴憑證者原則

上傳自定義原則

測試您的自定義原則

意見反應

其他資源

共用方式為

使用 Azure Active Directory B2C 設定使用 Twitter 帳戶註冊和登入

必要條件

建立應用程式

將 Twitter 設定為識別提供者

將 Twitter 識別提供者新增至使用者流程

測試您的使用者流程

建立原則金鑰

將 Twitter 設定為識別提供者

新增使用者旅程圖

將識別提供者新增至使用者旅程圖

設定信賴憑證者原則

上傳自定義原則

測試您的自定義原則

意見反應

其他資源