Tworzenie przepływu użytkownika rejestracji i logowania
Ćwiczenie — tworzenie przepływu użytkownika rejestracji i logowania
Przepływ użytkownika definiuje serię kroków rejestracji, które klienci stosują, i metody logowania, których mogą używać (takich jak poczta e-mail i hasło, jednorazowe kody dostępu lub konta społecznościowe z Google lub Facebook). Możesz również zbierać informacje od klientów podczas rejestracji, wybierając z serii wbudowanych atrybutów użytkownika lub dodając własne atrybuty niestandardowe. Możesz utworzyć wiele przepływów użytkownika, jeśli masz wiele aplikacji, które mają być oferowane klientom.
Uwaga
Aby utworzyć przepływy użytkowników, musisz mieć co najmniej rolę katalogu Administratora przepływu użytkownika identyfikatora zewnętrznego.
Czy masz opinię? Daj nam znać, jak będzie przebiegał projekt weryfikacji koncepcji. Z przyjemnością poznamy opinie użytkowników.
Aby utworzyć przepływ rejestracji i logowania użytkownika, zaloguj się do centrum administracyjnego firmy Microsoft Entra i przejdź do pozycji Tożsamości>zewnętrzne tożsamości.
Z menu wybierz pozycję Przepływy użytkownika. Następnie wybierz pozycję Nowy przepływ użytkownika.
Na stronie Tworzenie wprowadź Nazwę przepływu użytkownika (na przykład „SignUpSignIn”). Następnie w obszarze Dostawcy tożsamości zaznacz pole wyboru Konta e-mail, a następnie wybierz jedną z tych opcji. Jeśli skonfigurowano innych dostawców tożsamości, możesz je wybrać.
W obszarze Atrybuty użytkownika wybierz atrybuty, które chcesz zbierać od użytkownika podczas rejestracji. Wybierz pozycję Pokaż więcej , aby wybrać pełną listę atrybutów, w tym stanowisko, nazwę wyświetlaną i kod pocztowy. Następnie wybierz pozycję Utwórz , aby utworzyć przepływ użytkownika.
Z listy wybierz utworzony przepływ użytkownika.
Poniższe kroki umożliwiają aktywowanie środowiska rejestracji i logowania (przepływu użytkownika) dla użytkowników odwiedzających aplikację. W menu po lewej stronie w obszarze Użyj wybierz pozycję Aplikacje.
Wybierz pozycję Dodaj aplikację
Wybierz aplikację z listy. Możesz też użyć pola wyszukiwania, aby znaleźć aplikację, a następnie ją wybrać. Naciśnij przycisk Wybierz.
Aplikacja jest teraz połączona z przepływem użytkownika. Wybierz pozycję Uruchom przepływ użytkownika, aby wyświetlić podgląd środowiska.
W okienku Uruchamianie przepływu użytkownika, które zostanie otwarte po prawej stronie, upewnij się, że wybrano prawidłowy adres URL aplikacji i odpowiedzi. Następnie wybierz pozycję Uruchom przepływ użytkownika.
Gotowe! Pomyślnie utworzono przepływ użytkownika i połączono aplikację.
Napiwek
Zawsze możesz użyć przycisku Uruchom przepływ użytkownika, aby wyświetlić podgląd środowiska logowania. Gdy użytkownicy logują się do witryny internetowej sklepów spożywczych, napotkają środowisko logowania i rejestracji skonfigurowane w przepływie użytkownika.
1. Tworzenie przepływu użytkownika
Aby utworzyć przepływ użytkownika, należy utworzyć obiekt przepływu zdarzeń uwierzytelniania, który jest typu określonego w treści żądania.
POST https://graph.microsoft.com/beta/identity/authenticationEventsFlows
{
"@odata.context": "https://graph.microsoft.com/beta/$metadata#identity/authenticationEventsFlows/$entity",
"@odata.type": "#microsoft.graph.externalUsersSelfServiceSignUpEventsFlow",
"displayName": "Default sign-up and sign-in",
"description": "Woodgrove default sign-up and sign-in flow",
"priority": 500,
"conditions": {
"applications": {
"includeAllApplications": false
}
},
"onInteractiveAuthFlowStart": {
"@odata.type": "#microsoft.graph.onInteractiveAuthFlowStartExternalUsersSelfServiceSignUp",
"isSignUpAllowed": true
},
"onAuthenticationMethodLoadStart": {
"@odata.type": "#microsoft.graph.onAuthenticationMethodLoadStartExternalUsersSelfServiceSignUp",
"identityProviders": [
{
"@odata.type": "#microsoft.graph.builtInIdentityProvider",
"id": "EmailPassword-OAUTH"
}
]
},
"onAttributeCollection": {
"@odata.type": "#microsoft.graph.onAttributeCollectionExternalUsersSelfServiceSignUp",
"accessPackages": [],
"attributeCollectionPage": {
"customStringsFileId": null,
"views": [
{
"title": null,
"description": null,
"inputs": [
{
"attribute": "email",
"label": "Email Address",
"inputType": "text",
"defaultValue": null,
"hidden": true,
"editable": false,
"writeToDirectory": true,
"required": true,
"validationRegEx": "^[a-zA-Z0-9.!#$%&’'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\\.[a-zA-Z0-9-]+)*$",
"options": []
},
{
"attribute": "displayName",
"label": "Display Name",
"inputType": "text",
"defaultValue": null,
"hidden": false,
"editable": true,
"writeToDirectory": true,
"required": true,
"validationRegEx": "^.*",
"options": []
},
{
"attribute": "country",
"label": "Country/Region",
"inputType": "radioSingleSelect",
"defaultValue": null,
"hidden": false,
"editable": true,
"writeToDirectory": true,
"required": false,
"validationRegEx": "^.*",
"options": [
{
"label": "Australia",
"value": "au"
},
{
"label": "Spain",
"value": "es"
},
{
"label": "United States",
"value": "us"
}
]
},
{
"attribute": "city",
"label": "City",
"inputType": "text",
"defaultValue": null,
"hidden": false,
"editable": true,
"writeToDirectory": true,
"required": false,
"validationRegEx": "^.*",
"options": []
}
]
}
]
},
"attributes": [
{
"id": "email"
},
{
"id": "city"
},
{
"id": "country"
},
{
"id": "displayName"
}
]
},
"onUserCreateStart": {
"@odata.type": "#microsoft.graph.onUserCreateStartExternalUsersSelfServiceSignUp",
"userTypeToCreate": "member",
"accessPackages": []
}
}
1.1 Kopiowanie identyfikatora przepływu użytkownika
Z odpowiedzi skopiuj wartość identyfikatora przepływu użytkownika. Na przykład:
{
"@odata.context": "https://graph.microsoft.com/beta/$metadata#identity/authenticationEventsFlows/$entity",
"@odata.type": "#microsoft.graph.externalUsersSelfServiceSignUpEventsFlow",
"id": "aaaaaaaa-0000-1111-2222-bbbbbbbbbbbb",
"displayName": "Default sign-up and sign-in1",
"description": "Woodgrove default sign-up and sign-in flow",
...
}
2. Dodawanie aplikacji do przepływu użytkownika
Aby dodać lub połączyć aplikację z przepływem użytkownika, użyj następującego żądania programu Microsoft Graph. Zastąp element {user-flow-ID} identyfikatorem przepływu użytkownika. Zastąp element {app-ID} identyfikatorem aplikacji.
POST https://graph.microsoft.com/beta/identity/authenticationEventsFlows/{user-flow-ID}/conditions/applications/includeApplications
{
"@odata.type": "#microsoft.graph.authenticationConditionApplication",
"appId": "{app-ID}"
}