{"id":55000142,"date":"2018-08-01T00:00:00","date_gmt":"2020-03-27T19:33:26","guid":{"rendered":"http:\/\/access-im-unternehmen.aix-dev.de\/aiu\/?p=142"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-30T00:00:00","slug":"Authentifizierungsseiten_anpassen","status":"publish","type":"post","link":"https:\/\/vbentwickler.de\/Authentifizierungsseiten_anpassen\/","title":{"rendered":"Authentifizierungsseiten anpassen"},"content":{"rendered":"<p><b>Im Artikel &#8220;Authentifizierung nachr&uuml;sten&#8221; haben wir gezeigt, wie Sie die Funktionen f&uuml;r die Authentifizierung von Benutzern in einer Webanwendung nachr&uuml;sten k&ouml;nnen. Dort haben wir die platzsparende Variante verwendet &#8211; also die, welche die ganzen verwendeten Elemente der Benutzeroberfl&auml;che f&uuml;r die Authentifizierung direkt aus einer Bibliothek verwendet. Das spart zwar eine Menge Platz, weil die ganzen Seiten nicht einzeln im Projektordner liegen, aber man kann diese nicht so einfach anpassen. Der vorliegende Artikel zeigt, wie Sie die Authentifizierung umstellen und diese so anpassbar machen.<\/b><\/p>\n<p>Im Artikel <b>Authentifizierung nachr&uuml;sten <\/b>haben wir die unter ASP.NET Core 2.1 eingef&uuml;hrte Bibliothek <b>Microsoft.AspNetCore.Identity.UI <\/b>eingebunden, um die darin enthaltenen Elemente f&uuml;r die Benutzer-Authentifizierung zu nutzen. Damit haben wir den Umfang der im Projektordner enthaltenen Daten erheblich verringert, denn die Seiten f&uuml;r die Anzeige der Elemente der Authentifizierung und erst recht der Code f&uuml;r die notwendigen Funktionen sind sehr umfangreich (rund 50 Dateien). Diese Bibliothek haben wir verf&uuml;gbar gemacht, in dem wir in der Klasse <b>Startup.cs <\/b>die Methode <b>AddDefaultUI() <\/b>aufrufen.<\/p>\n<p>Nun wollen wir allerdings beispielsweise die Texte in deutscher Sprache pr&auml;sentieren und nicht in englischer Sprache. Dazu m&uuml;ssen wir allerdings doch wieder den Code f&uuml;r die Authentifizierungsfunktionen ins Projekt holen. Hier gibt es zwei verschiedene Ans&auml;tze: Entweder Sie holen den kompletten Code an Bord oder Sie f&uuml;gen nur diejenigen Dateien ein, die Sie anpassen m&ouml;chten, um beispielsweise die Benutzeroberfl&auml;che in deutscher Sprache zu pr&auml;sentieren. Wir zeigen Ihnen in den n&auml;chsten Abschnitten, wie das funktioniert.<\/p>\n<h2>Authentifizierungsfunktionen ins Projekt holen<\/h2>\n<p>Um die Elemente der Bibliothek <b>Microsoft.AspNetCore.Identity.UI <\/b>doch wieder im Projektverzeichnis unterzubringen, ben&ouml;tigen Sie ein neues Element. Diesmal f&uuml;gen wir allerdings nicht einfach ein Element etwa wie eine Klasse hinzu, sondern verwenden einen sogenannten Scaffolded Item, zu deutsch Ger&uuml;stelement. Dazu rufen Sie zun&auml;chst den Kontextmen&uuml;-Befehl <b>Hinzuf&uuml;gen|Neues Ger&uuml;stelement&#8230; <\/b>auf. Es erscheint der Dialog <b>Ger&uuml;st hinzuf&uuml;gen<\/b>, in dem wir links <b>Identit&auml;t <\/b>ausw&auml;hlen und in der Mitte anschlie&szlig;end auch (siehe Bild 1).<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2018_04\/pic_142_001.png\" alt=\"Hinzuf&uuml;gen der Authentifizierungs-Elemente per Ger&uuml;stbau\" width=\"649,559\" height=\"366,1\"\/><\/p>\n<p><b><span style=\"color:darkgrey;\">Bild 1: Hinzuf&uuml;gen der Authentifizierungs-Elemente per Ger&uuml;stbau<\/span><\/b><\/p>\n<p>Danach erscheint der Dialog aus Bild 2. Hier haben Sie verschiedene M&ouml;glichkeiten:<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2018_04\/pic_142_002.png\" alt=\"Konfiguration zum Hinzuf&uuml;gen der Elemente\" width=\"549,6265\" height=\"468,9648\" \/><\/p>\n<p><b><span style=\"color:darkgrey;\">Bild 2: Konfiguration zum Hinzuf&uuml;gen der Elemente<\/span><\/b><\/p>\n<ul>\n<li>Angabe der Layout-Seite<\/li>\n<li>Auswahl der zu &uuml;berschreibenden Dateien &#8211; gegebenenfalls auch die M&ouml;glichkeit, alle Dateien zu &uuml;berschreiben<\/li>\n<li>Auswahl der Kontext-Klasse<\/li>\n<li>Angabe der Benutzerklasse<\/li>\n<\/ul>\n<p>Die Angabe der Layout-Seite k&ouml;nnen wir weglassen, da wir ja bereits in der Datei <b>Areas|Identity|Pages <\/b>eine Datei namens <b>_ViewStart.cshtml <\/b>angelegt haben, die einen Verweis auf die zu verwendende Layout-Datei enth&auml;lt (<b>Pages|Shared|_Layout.cshtml<\/b>).<\/p>\n<p>Darunter k&ouml;nne Sie ausw&auml;hlen, welche der vielen Dateien, die sich in der Bibliothek <b>Microsoft.AspNetCore.Identity.UI <\/b>befinden, Sie &uuml;berschreiben wollen. &Uuml;berschreiben deshalb, weil ja die Dateien in der Bibliothek noch vorhanden sind, aber stattdessen dann die von Ihnen hinzugef&uuml;gten Dateien verwendet werden. Wir wollen zun&auml;chst die offensichtlichen Dateien hinzuf&uuml;gen:<\/p>\n<ul>\n<li><b>Account|Login<\/b><\/li>\n<li><b>Account|Register<\/b><\/li>\n<\/ul>\n<p>Erst wenn Sie hier mindestens eine Datei ausgew&auml;hlt haben, wird das Auswahlfeld f&uuml;r die Datenkontextklasse gef&uuml;llt. Hier w&auml;hlen wir dann unsere Datenkontextklasse <b>ApplicationDbContext <\/b>aus dem Verzeichnis <b>AuthAnpassen.Data <\/b>aus (siehe Bild 3). Das Textfeld Benutzerklasse wird nicht aktiviert und kann ignoriert werden.<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2018_04\/pic_142_00.png\" alt=\"Auswahl der hinzuzuf&uuml;genden Elemente\" width=\"549,6265\" height=\"468,9648\" \/><\/p>\n<p><b><span style=\"color:darkgrey;\">Bild 3: Auswahl der hinzuzuf&uuml;genden Elemente<\/span><\/b><\/p>\n<p>Klicken Sie dann auf <b>OK<\/b>, erscheint ein Dialog, der den Fortschritt dokumentiert. Au&szlig;erdem zeigt Visual Studio nach Abschluss des Vorgangs noch eine Readme-Datei an (siehe Bild 4). Demnach soll die <b>Configure<\/b>-Methode der Klasse <b>Startup.cs <\/b>die Methode <b>app.UseStaticFiles() <\/b>aufrufen. Dahinter soll die Methode <b>app.UseAuthentication() <\/b>aufgerufen werden sowie danach die Methode <b>app.UseMvc<\/b>.<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2018_04\/pic_142_004.png\" alt=\"Hinweise nach dem Ger&uuml;stbau\" width=\"700\" height=\"303,6424\" \/><\/p>\n<div class=\"rcp_restricted\"><p><span style=\"color: #ff0000;\">M&ouml;chten Sie weiterlesen? Dann l&ouml;sen Sie Ihr Ticket!<\/span><br \/>\n<span style=\"color: #ff0000;\">Hier geht es zur Bestellung des Jahresabonnements des Magazins <strong>Visual Basic Entwickler<\/strong>:<\/span><br \/>\n<span style=\"color: #ff0000;\"><a style=\"color: #ff0000;\" href=\"https:\/\/shop.minhorst.com\/magazine\/363\/visual-basic-entwickler-jahresabonnement?c=77\">Zur Bestellung ...<\/a><\/span><br \/>\n<span style=\"color: #ff0000;\">Danach greifen Sie sofort auf <strong>alle rund 200 Artikel<\/strong> unseres Angebots zu - auch auf diesen hier!<\/span><br \/>\n<span style=\"color: #000000;\">Oder haben Sie bereits Zugangsdaten? Dann loggen Sie sich gleich hier ein:<\/span><\/p>\n<\/div>\n\n\t\n\t<form id=\"rcp_login_form\"  class=\"rcp_form\" method=\"POST\" action=\"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000142\/\">\n\n\t\t\n\t\t<fieldset class=\"rcp_login_data\">\n\t\t\t<p>\n\t\t\t\t<label for=\"rcp_user_login\">Username or Email<\/label>\n\t\t\t\t<input name=\"rcp_user_login\" id=\"rcp_user_login\" class=\"required\" type=\"text\"\/>\n\t\t\t<\/p>\n\t\t\t<p>\n\t\t\t\t<label for=\"rcp_user_pass\">Password<\/label>\n\t\t\t\t<input name=\"rcp_user_pass\" id=\"rcp_user_pass\" class=\"required\" type=\"password\"\/>\n\t\t\t<\/p>\n\t\t\t\t\t\t<p>\n\t\t\t\t<input type=\"checkbox\" name=\"rcp_user_remember\" id=\"rcp_user_remember\" value=\"1\"\/>\n\t\t\t\t<label for=\"rcp_user_remember\">Remember me<\/label>\n\t\t\t<\/p>\n\t\t\t<p class=\"rcp_lost_password\"><a href=\"\/data\/wp\/v2\/posts\/55000142?rcp_action=lostpassword\"><\/a><\/p>\n\t\t\t<p>\n\t\t\t\t<input type=\"hidden\" name=\"rcp_action\" value=\"login\"\/>\n\t\t\t\t<input type=\"hidden\" name=\"rcp_redirect\" value=\"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000142\/\"\/>\n\t\t\t\t<input type=\"hidden\" name=\"rcp_login_nonce\" value=\"123b777de9\"\/>\n\t\t\t\t<input id=\"rcp_login_submit\" class=\"rcp-button\" type=\"submit\" value=\"Login\"\/>\n\t\t\t<\/p>\n\t\t\t\t\t<\/fieldset>\n\n\t\t\n\t<\/form>\n<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Im Artikel &#8220;Authentifizierung nachr&uuml;sten&#8221; haben wir gezeigt, wie Sie die Funktionen f&uuml;r die Authentifizierung von Benutzern in einer Webanwendung nachr&uuml;sten k&ouml;nnen. Dort haben wir die platzsparende Variante verwendet &#8211; also die, welche die ganzen verwendeten Elemente der Benutzeroberfl&auml;che f&uuml;r die Authentifizierung direkt aus einer Bibliothek verwendet. Das spart zwar eine Menge Platz, weil die ganzen Seiten nicht einzeln im Projektordner liegen, aber man kann diese nicht so einfach anpassen. Der vorliegende Artikel zeigt, wie Sie die Authentifizierung umstellen und diese so anpassbar machen.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[662018,66042018,44000018],"tags":[],"yst_prominent_words":[],"class_list":["post-55000142","post","type-post","status-publish","format-standard","hentry","category-662018","category-66042018","category-ASPNET_Core"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000142","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/comments?post=55000142"}],"version-history":[{"count":0,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000142\/revisions"}],"wp:attachment":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/media?parent=55000142"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/categories?post=55000142"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/tags?post=55000142"},{"taxonomy":"yst_prominent_words","embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/yst_prominent_words?post=55000142"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}