Ställa in anpassade sidor för användarinloggningar

Artikel
07/25/2024

I denna artikel beskrivs hur du skapar anpassade sidor i Microsoft Dynamics 365 Commerce som hanterar anpassade inloggningar för användare av Microsoft Entra B2C-klientorganisationer (Business-to-Consumer).

Om du vill använda anpassade sidor som har skapats i Dynamics 365 Commerce för att hantera användarinloggningsflöden måste du konfigurera de Microsoft Entra-policyer som kommer att refereras till i handelsmiljön. Du kan konfigurera B2C-policyer "Registrera och logga in", "profilredigering" och "lösenordsåterställning" Microsoft Entra B2C-policyer med hjälp av Microsoft Entra B2C-programmet. Microsoft Entra B2C-innehavare och policynamn kan sedan refereras under etableringsprocessen som utförs för handelsmiljön med hjälp av Microsoft Dynamics Lifecycle Services (LCS).

De anpassade Commerce-sidorna kan skapas med hjälp av modulerna för inloggning, registrering, redigering av kontoprofil, återställning av läsenord eller generiska Microsoft Entra-moduler. De sid-URL:er som publiceras för dessa anpassade sidor bör sedan refereras i Microsoft Entra B2C policykonfigurationer i Azure-portalen.

Varning

Microsoft Entra ID B2C drar tillbaka gamla (äldre) användarflöden senast den 1 augusti 2021. Därför bör du planera att flytta dina användarflöden till den nya rekommenderade versionen. Den nya versionen innehåller funktionen paritet och nya funktioner. Mer information finns i Arbetsflöden i Microsoft Entra ID B2C.

Modulbiblioteket för Commerce version 10.0.15 eller högre ska användas med de rekommenderade B2C-användarflödena. De standardsidor för användarpolicy som finns i Microsoft Entra ID B2C kan också användas, och dessa möjliggör tillagda bakgrundsbilder, logotyp och ändringar av bakgrundsfärg relaterade till företagets varumärke. De mer begränsade designfunktionerna gör att standardanvändarpolicysidorna tillhandahåller Microsoft Entra B2C-policyfunktioner utan att de dedikerade anpassade sidorna skapas och konfigureras.

Ställ in B2C-policyer

När du har ställt in Microsoft Entra B2C-innehavare och associerar den med din handelsmiljö, går du till sidan Microsoft Entra B2C i Azure-portalen och väljer i menyn Policyer och sedan Användarflöden (policyer).

Kommandot Användarflöden (policyer) på menyn.

Du kan nu konfigurera användarinloggningsflöden "registrera och logga in", "profilredigering" och "lösenordsåterställning".

För att konfigurera policyn "Registrera och logga in" följ stegen nedan.

Välj Nytt användarflöde, välj Registrera dig och logga in, välj Rekommenderad och välj Skapa.
Ange ett namn på policyn (till exempel B2C1SignInSignUp).
I avsnittet identitetsleverantörer väljer du vilka identitetsleverantörer som ska användas för policyn. Åtminstone måste du välja e-postregistrering.
I kolumnen Samla in attribut välj kryssrutorna för e-postadress, förnamn och efternamn.
I kolumnen returanspråk markerar du kryssrutorna för e-postadresser, förnamn, identitetsleverantör, efternamn och användarens objekt-ID.
Skapa policyn genom att välja OK.
Dubbelklicka på det nya policynamnet och välj sedan Egenskaperi navigeringsfönstret.
Ange alternativet aktivera JavaScript med tvingad sidlayout (förhandsgranskning) till På.

Notering

Policynamnet kommer att refereras till i handelsmiljön. (Prefixet B2C_1_ kommer att inkluderas i referensen.) Det går inte att byta namn på policyer när de har skapats. Om du ersätter en befintlig policy för din handelsmiljö, kan du ta bort den ursprungliga policyn och bygga en ny policy som har samma namn. Om miljön redan har etablerats kan du skicka det nya policynamnet via en tjänstbegäran.

Du kommer tillbaka till den här policyn för att slutföra installationen när du har byggt de anpassade sidorna. Stäng nu policyn för att återgå till sidan användarflöden (policyer) i Azure-portalen.

Konfigurera policyn för "profilredigering"

Gör på följande vis för att konfigurera policyn "profilredigering".

Välj Nytt användarflöde, välj Profilredigering, välj Rekommenderad och välj Skapa.
Ange ett namn på policyn (till exempel B2C_1_EditProfile).
I avsnittet identitetsleverantörer väljer du vilka identitetsleverantörer som ska användas för policyn. Åtminstone Local Account SignIn måste väljas.
I kolumnen Samla in attribut välj kryssrutorna för förnamn och efternamn.
I kolumnen returanspråk markerar du kryssrutorna för e-postadresser, förnamn, identitetsleverantör, efternamn och användarens objekt-ID.
Skapa policyn genom att välja OK.
Dubbelklicka på det nya policynamnet och välj sedan Egenskaperi navigeringsfönstret.
Ange alternativet aktivera JavaScript med tvingad sidlayout (förhandsgranskning) till På.

Konfigurera policyn "Återställ lösenord"

Gör på följande vis för att konfigurera policyn "Lösenordsåterställning".

Välj Nytt användarflöde, välj sedan alternativet Återställ lösenord och välj Rekommenderad och klicka på Skapa.
Ange ett namn på policyn (till exempel B2C_1_ForgetPassword).
I avsnittet identitetsleverantörer väljer du Återställ lösenord med e-postadress.
I kolumnen returanspråk markerar du kryssrutorna för e-postadresser, förnamn, efternamn och användarens objekt-ID.
Skapa policyn genom att välja OK.
Dubbelklicka på det nya policynamnet och välj sedan Egenskaperi navigeringsfönstret.
Ange alternativet aktivera JavaScript med tvingad sidlayout (förhandsgranskning) till På.

Skapa anpassade sidor

Dedikerade Microsoft Entra-moduler ingår i Commerce för att skapa anpassade sidor för Microsoft Entra B2C-användarpolicyer. Sidor kan byggas specifikt för varje användarpolicysidas layout med hjälp av de Microsoft Entra B2C huvudmoduler som beskrivs nedan. Du kan också använda den generiska Microsoft Entra modulen för alla sidolayouter och policyer i Microsoft Entra ID B2C (till och med för alternativ för sidlayout i policyer som inte anges nedan).

Sidspecifika Microsoft Entra-moduler är bundna till datainmatningsobjekt som återges av Microsoft Entra ID B2C. Dessa moduler ger dig större kontroll över positionen för elementen på dina sidor. Det kan dock vara nödvändigt att skapa fler sidor och modultillägg som tar hänsyn till avvikelser utöver de standardinställningar som beskrivs nedan.
Den generiska Microsoft Entra-modulen skapar "div"-elementet för Microsoft Entra B2C som återger alla element i sidlayouten för användarpolicyn, vilket ger mer flexibilitet i sidans B2C-funktioner, men mindre kontroll över positionering och styling (dock kan CSS användas för att matcha utseendet och känslan på din webbplats).

Du kan skapa en enda sida med den generiska Microsoft Entra-modulen och använda den för alla dina användarpolicysidor, eller också kan du bygga ut specifika sidor med enskilda Microsoft Entra-moduler för inloggning, registrering, profilredigering, återställning av lösenord och verifiering av lösenord. Du kan också använda en blandning av båda, där specifika Microsoft Entra-sidor används för de sidlayouter som anges nedan, och den generiska Microsoft Entra-modulsidan för återstående sidlayouter på dessa eller andra sidor för användarpolicyer.

Om du vill veta mer om Microsoft Entra moduler som levereras med modulbiblioteket kan du läsa mer på identitetshanteringssidorna och modulerna.

Att bygga anpassade sidor med specifika identitetsmoduler för att hantera användarinloggningar följer du stegen nedan.

I Commerce webbplatsskaparen, gå till din webbplats.
Bygg följande fem mallar och sidor (om de inte redan finns på webbplatsen):
- Mallen Logga in och sida där inloggningsmodulen används.
- Mallen Registrera dig och sida där registreringsmodulen används.
- Mallen lösenordsåterställning och sidan med modulen lösenordsåterställning.
- Mallen verifiering av lösenordsåterställning och sidan med modulen verifiering av lösenordsåterställning.
- Mallen profilredigering och sidor som använder redigeringsmodulen för kontoprofilen.

Följ de här riktlinjerna när du skapar sidorna:

För varje sida eller modul använder du layouten och formatet som bäst passar dina affärsbehov.
Publicera alla sidor och URL som måste användas i Microsoft Entra B2C-inställningar.
När sidorna och adresserna har publicerats samlar du in de URL-adresser som måste användas för konfigurationer av Microsoft Entra B2C-policy. Suffixet ?preloadscripts=true kommer att läggas till varje URL när det används.

Viktigt

Sidor som byggts i Microsoft Entra B2C visas direkt från Microsoft Entra B2C-innehavares domän. Återanvänd inte universella sidhuvuden och sidfötter med relativa länkar. Eftersom dessa sidor kommer att finnas i Microsoft Entra B2C-domänen när de används, ska endast absoluta URL:er användas för alla länkar. Det rekommenderas att skapa en specifik sidhuvud och sidfot med absoluta webbadresser för din Microsoft Entra-relaterade anpassade sidor, med alla Commerce-specifika moduler som kräver anslutning till Retail Server borttagen. Exempelvis ska inte modulerna för favoriter, sökfält, inloggning och kundvagn inkluderas på några sidor som används i Microsoft Entra B2C-användarflöden.

Konfigurera Microsoft Entra B2C policyer med anpassad sidinformation

I Azure-portalen, gå tillbaka till sidan Microsoft Entra B2C och sedan på menyn under Policyer, välj Användarflöden (policyer).

För att uppdatera policyn "Registrera och logga in" med anpassad sidinformation, följ dessa steg.

I policyn Registrera och logga in som du konfigurerade tidigare, i navigeringsfönstret, välj Sidlayouter.
Välj layouten Enhetlig sida för registrera och logga in.
Ställ in alternativet Använd anpassat sidinnehåll till ja.
I fältet Anpassad sid-URI ange fullständig inloggnings-URL. Inkludera suffixet ?preloadscripts=true. Ange exempelvis www.<my domain>.com/sign-in?preloadscripts=true.
I fältet Version av sidlayout väljer version 2.1.0 eller senare (kräver modulbibliotek för Commerce version 10.0.15 eller högre).
Välj Spara.
Välj layouten sida för registrering av lokalt konto.
Ställ in alternativet Använd anpassat sidinnehåll till ja.
I fältet Anpassad sid-URI ange fullständig inloggnings-URL. Inkludera suffixet ?preloadscripts=true. Ange exempelvis www.<my domain>.com/sign-up?preloadscripts=true.
I fältet Version av sidlayout väljer version 2.1.0 eller senare (kräver modulbibliotek för Commerce version 10.0.15 eller högre).
I avsnittet Användarattribut följ dessa steg:
1. För attributen förnamn och efternamn, välj Nej i kolumnen Kräver verifiering.
2. För E-postadress, det rekommenderas att lämna standardvärdet Ja som väljs i kolumnen Kräver verifiering. Det här alternativet garanterar att användarna registrerar sig med en viss e-postadress och verifierar att de har e-postadressen.
3. För attributen e-postadress, förnamn och efternamn väljer du nej i kolumnen Valfritt.
Välj Spara.

Uppdatera policyn "Profilredigering" med anpassad sidinformation

För att uppdatera policyn "Profilredigering" med anpassad sidinformation, följ dessa steg.

I policyn Profilredigering som du konfigurerade tidigare, i navigeringsfönstret, välj Sidlayouter.
Välj layout Profilredigeringssida (kan kräva att du rullar nedför andra layoutalternativ, beroende på skärm).
Ställ in alternativet Använd anpassat sidinnehåll till ja.
I fältet Anpassad sid-URI ange fullständig profil redigerings-URL. Inkludera suffixet ?preloadscripts=true. Ange exempelvis www.<my domain>.com/profile-edit?preloadscripts=true.
För Version av sidlayout väljer version 2.1.0 eller högre (kräver modulbibliotek för Commerce version 10.0.15 eller högre).
I avsnittet Användarattribut följ dessa steg:
1. För attributen förnamn och efternamn välj nej i kolumnen valfritt.
2. För attributen förnamn och efternamn, välj Nej i kolumnen Kräver verifiering.
Välj Spara.

Uppdatera policyn "Lösenordsåterställning" med anpassad sidinformation

För att uppdatera policyn "Lösenordsåterställning" med anpassad sidinformation, följ dessa steg.

I policyn Lösenordsåterställning som du konfigurerade tidigare, i navigeringsfönstret, välj Sidlayouter.
Välj layouten Glömt lösenordssida.
Ställ in alternativet Använd anpassat sidinnehåll till ja.
I fältet Anpassad sid-URI ange fullständig lösenordsåterställning verifierings-URL. Inkludera suffixet ?preloadscripts=true. Ange exempelvis www.<my domain>.com/password-reset-verification?preloadscripts=true.
I fältet Version av sidlayout väljer version 2.1.0 eller senare (kräver modulbibliotek för Commerce version 10.0.15 eller högre).
Välj Spara.
Välj layouten Ändra lösenordssida.
Ställ in alternativet Använd anpassat sidinnehåll till ja.
I fältet Anpassad sid-URI ange fullständig lösenordsåterställnings-URL. Inkludera suffixet ?preloadscripts=true. Ange exempelvis www.<my domain>.com/password-reset?preloadscripts=true.
I fältet Version av sidlayout väljer version 2.1.0 eller senare (kräver modulbibliotek för Commerce version 10.0.15 eller högre).
Välj Spara.

Anpassa standardtextsträngar för etiketter och beskrivningar

I modulbiblioteket är inloggningsmoduler förifyllda med standardtextsträngar för etiketterna och beskrivningarna. Du kan anpassa strängerna i egenskapsfönstret i den modul du arbetar på. Ytterligare strängar på sidan, (t.ex. länktexten Glömt lösenord? eller åtgärdstexten Skapa ett konto) kräver att du använder Commerce programutvecklingskit (SDK) och uppdaterar värdena i filen global.json för inloggningsmodulen.

Standardtexten för länken Glömt lösenordet är glömt lösenord?. Nedan visas den här standardtexten på inloggningssidan.

Standardtext för länken Glömt lösenordet på inloggningssidan.

I global.json-filen för modulen modulbibliotek kan du emellertid redigera texten till glömt lösenordet?, som du ser i bilden nedan.

Länktexten uppdaterades inloggningsmodulens global.json-fil.

När du har uppdaterat global.json-filen och publicerat ändringarna, visas den nya länktexten i modulen logga in både i handel och på live-inloggningssidan.