"use strict"; const {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0]; const {useMDXComponents: _provideComponents} = arguments[0]; const headings = [{ "data": { "id": "einführung", "hProperties": { "id": "einführung" } }, "depth": 2, "value": "Einführung" }, { "data": { "id": "aber-zuerst-was-und-warum", "hProperties": { "id": "aber-zuerst-was-und-warum" } }, "depth": 2, "value": "Aber zuerst, was und warum?" }, { "data": { "id": "einen-oidc-server-integrieren", "hProperties": { "id": "einen-oidc-server-integrieren" } }, "depth": 2, "value": "Einen OIDC-Server integrieren" }, { "data": { "id": "einen-oidc-anbieter-finden", "hProperties": { "id": "einen-oidc-anbieter-finden" } }, "depth": 3, "value": "Einen OIDC-Anbieter finden" }, { "data": { "id": "subjekt-client-und-zielgruppe", "hProperties": { "id": "subjekt-client-und-zielgruppe" } }, "depth": 3, "value": "Subjekt, Client und Zielgruppe" }, { "data": { "id": "1-ein-benutzer-klickt-auf-die-anmeldeschaltfläche-in-einer-webanwendung", "hProperties": { "id": "1-ein-benutzer-klickt-auf-die-anmeldeschaltfläche-in-einer-webanwendung" } }, "depth": 4, "value": "1. Ein Benutzer klickt auf die Anmeldeschaltfläche in einer Webanwendung" }, { "data": { "id": "2-ein-benutzer-verwendet-eine-single-page-anwendung", "hProperties": { "id": "2-ein-benutzer-verwendet-eine-single-page-anwendung" } }, "depth": 4, "value": "2. Ein Benutzer verwendet eine Single-Page-Anwendung" }, { "data": { "id": "3-eine-maschine-zu-maschine-kommunikation", "hProperties": { "id": "3-eine-maschine-zu-maschine-kommunikation" } }, "depth": 4, "value": "3. Eine Maschine-zu-Maschine-Kommunikation" }, { "data": { "id": "zusammenfassung", "hProperties": { "id": "zusammenfassung" } }, "depth": 4, "value": "Zusammenfassung" }, { "data": { "id": "tokens", "hProperties": { "id": "tokens" } }, "depth": 3, "value": "Tokens" }, { "data": { "id": "mehrere-zielgruppen", "hProperties": { "id": "mehrere-zielgruppen" } }, "depth": 3, "value": "Mehrere Zielgruppen" }, { "data": { "id": "resource-im-code-austauschanfrage-angeben", "hProperties": { "id": "resource-im-code-austauschanfrage-angeben" } }, "depth": 4, "value": "resource im Code-Austauschanfrage angeben" }, { "data": { "id": "ein-refresh-token-verwenden-um-ein-neues-access-token-zu-erhalten", "hProperties": { "id": "ein-refresh-token-verwenden-um-ein-neues-access-token-zu-erhalten" } }, "depth": 4, "value": "Ein Refresh Token verwenden, um ein neues Access Token zu erhalten" }, { "data": { "id": "client-credentials-grant", "hProperties": { "id": "client-credentials-grant" } }, "depth": 4, "value": "Client-Credentials-Grant" }, { "data": { "id": "deinen-api-dienst-schützen", "hProperties": { "id": "deinen-api-dienst-schützen" } }, "depth": 3, "value": "Deinen API-Dienst schützen" }, { "data": { "id": "ansprüche-prüfen", "hProperties": { "id": "ansprüche-prüfen" } }, "depth": 4, "value": "Ansprüche prüfen" }, { "data": { "id": "autorisierung", "hProperties": { "id": "autorisierung" } }, "depth": 2, "value": "Autorisierung" }, { "data": { "id": "abschließende-anmerkungen", "hProperties": { "id": "abschließende-anmerkungen" } }, "depth": 2, "value": "Abschließende Anmerkungen" }]; const readingTime = { "minutes": 7, "words": 2243, "text": "7 min read" }; const frontmatter = undefined; function _createMdxContent(props) { const _components = { a: "a", blockquote: "blockquote", code: "code", em: "em", h2: "h2", h3: "h3", h4: "h4", li: "li", p: "p", pre: "pre", span: "span", strong: "strong", ul: "ul", ..._provideComponents(), ...props.components }, {Info, LogtoCloudButton, Note} = _components; if (!Info) _missingMdxReference("Info", true); if (!LogtoCloudButton) _missingMdxReference("LogtoCloudButton", true); if (!Note) _missingMdxReference("Note", true); return _jsxs(_Fragment, { children: [_jsxs(_components.h2, { id: "einführung", children: ["Einführung", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#einführung", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Möglicherweise stehst du vor der Situation, ein zentrales Authentifizierungs- und Autorisierungssystem zu benötigen, auch bekannt als Identity Access Management (IAM) oder Identity Provider (IdP). Manchmal fügen Menschen ein Wort hinzu, um das Geschäft zu bezeichnen, wie z. B. Customer IAM und Workforce IAM." }), "\n", _jsx(_components.p, { children: "Lassen wir diese ausgefallenen Namen für einen Moment beiseite. Das Bedürfnis nach IAM könnte entstehen, weil deine Anwendung wächst oder du planst, die harte Arbeit von Anfang an an einen Anbieter zu delegieren. Nichtsdestotrotz erreichst du einen Punkt, an dem ein Identitätssystem in dein Projekt eingeführt werden muss." }), "\n", _jsx(_components.p, { children: "Angesichts der Beliebtheit von OAuth 2.0 ist OpenID Connect (OIDC) für viele Entwickler eine natürliche Wahl. Da OIDC eine Authentifizierungsebene ist, die auf OAuth 2.0 aufgebaut ist, könntest du dich vertraut fühlen, wenn du mit OIDC arbeitest. Lass uns loslegen!" }), "\n", _jsxs(_components.h2, { id: "aber-zuerst-was-und-warum", children: ["Aber zuerst, was und warum?", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#aber-zuerst-was-und-warum", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.blockquote, { children: ["\n", _jsx(_components.p, { children: "Du kannst diesen Abschnitt überspringen, wenn du bereits mit dem Konzept des Identity Providers und seiner Bedeutung vertraut bist." }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Ein OIDC-Server, oder Identity Provider, ist ein zentrales System, das Benutzerauthentifizierung und -autorisierung verwaltet. Wie wir im Artikel ", _jsx(_components.a, { href: "https://blog.logto.io/centralized-identity-system", children: "Warum du ein zentrales Identitätssystem für ein Multi-App-Geschäft benötigst" }), " besprochen haben, bietet ein zentrales Identitätssystem viele Vorteile."] }), "\n", _jsx(_components.p, { children: "Angenommen, dein Projekt startet mit einer einfachen Webanwendung, die eine integrierte Authentifizierung hat:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "graph LR\n A[Benutzer] --> B[Webanwendung]\n" }) }), "\n", _jsx(_components.p, { children: "Während dein Projekt wächst, musst du eine mobile Version einführen:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "graph LR\n A[Benutzer] --> B[Webanwendung]\n A --> C[Mobile Anwendung]\n" }) }), "\n", _jsx(_components.p, { children: "Es wäre eine schlechte Erfahrung für Benutzer, wenn sie für jede Anwendung ein Konto erstellen müssten. Da du mit einer Webanwendung begonnen hast, lässt du die mobile Anwendung mit der Webanwendung für die Authentifizierung kommunizieren:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "graph LR\n A[Benutzer] --> B[Webanwendung]\n A --> C[Mobile Anwendung]\n C --> B\n" }) }), "\n", _jsx(_components.p, { children: "Nun wird ein neuer API-Dienst eingeführt. Da es sich um einen Dienst für zahlende Benutzer handelt, musst du sicherstellen, dass der Benutzer authentifiziert und autorisiert ist, auf den Dienst zuzugreifen. Um dies zu erreichen, kannst du den Dienst über die Webanwendung leiten:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "graph LR\n A[Benutzer] --> B[Webanwendung]\n A --> C[Mobile Anwendung]\n C --> B\n B --> D[API-Dienst]\n" }) }), "\n", _jsx(_components.p, { children: "Oder, du verwendest eine Token-Technik, um den Benutzer zu authentifizieren, und validierst das Token, indem du in der Dienstleistung mit der Webanwendung sprichst. Daher kann die mobile Anwendung den Dienst direkt nutzen:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "graph LR\n A[Benutzer] --> B[Webanwendung]\n A --> C[Mobile Anwendung]\n C --> B\n B <--> D[API-Dienst]\n C --> D\n" }) }), "\n", _jsx(_components.p, { children: "Die Dinge werden unübersichtlich. Also entscheidest du dich, die Authentifizierungs- und Autorisierungslogik in einen separaten Dienst aufzuteilen:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "graph LR\n A[Benutzer] --> B[Webanwendung]\n A --> C[Mobile Anwendung]\n B --> D[API-Dienst]\n C --> D\n B --> E[Identity-Dienst] \n C --> E\n D --> E \n\n subgraph Anwendungen\n B\n C\n end\n\n subgraph Dienste\n D\n end\n\n subgraph Identität\n E\n end\n" }) }), "\n", _jsx(_components.p, { children: "Der Refaktorisierungsprozess kann schmerzhaft sein. Du wirst bemerken, dass die Komplexität exponentiell zunimmt, wenn du mehr Anwendungen und Dienste zum Projekt hinzufügst. Noch schlimmer, du musst möglicherweise mehrere Authentifizierungsmethoden wie passwortloses Anmelden, soziales Login, SAML usw. aufrechterhalten." }), "\n", _jsx(_components.p, { children: "Deshalb sollten wir besser einen Identity Provider am Anfang einführen, wenn du planst, dein Projekt zu skalieren." }), "\n", _jsx(Note, { children: _jsx(_components.p, { children: "Natürlich gibt es einige Fälle, in denen das Projekt einfach genug ist und du weißt, dass es eine Weile einfach bleibt. Du kannst diesen Artikel verlassen und wiederkommen, wenn du ihn benötigst." }) }), "\n", _jsxs(_components.h2, { id: "einen-oidc-server-integrieren", children: ["Einen OIDC-Server integrieren", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#einen-oidc-server-integrieren", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.h3, { id: "einen-oidc-anbieter-finden", children: ["Einen OIDC-Anbieter finden", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#einen-oidc-anbieter-finden", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Es gibt viele OIDC-Anbieter auf dem Markt. Du kannst einen basierend auf deinen Anforderungen und Vorlieben auswählen. Solange der Anbieter OIDC-konform ist, wird er die gleiche Rolle in deinem Projekt spielen." }), "\n", _jsx(Info, { children: _jsxs(_components.p, { children: [_jsx(_components.a, { href: "https://logto.io", children: "Logto" }), " ist ein Open-Source-OIDC-Anbieter mit sofort einsatzfähigen Identitäts- und Zugangsmanagement-Funktionen."] }) }), "\n", _jsxs(_components.h3, { id: "subjekt-client-und-zielgruppe", children: ["Subjekt, Client und Zielgruppe", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#subjekt-client-und-zielgruppe", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Um das Konzept zu vereinfachen, können wir denken, dass das ", _jsx(_components.em, { children: "Subjekt" }), " die Entität ist, die versucht, über einen ", _jsx(_components.em, { children: "Client" }), " auf eine ", _jsx(_components.em, { children: "Zielgruppe" }), " zuzugreifen."] }), "\n", _jsx(Note, { title: "Ich kann keine Zielgruppe (aud) im Token sehen", children: _jsx(_components.p, { children: "Wenn die Zielgruppe fehlt, bedeutet das normalerweise, dass die Zielgruppe der OIDC-Server selbst ist." }) }), "\n", _jsx(_components.p, { children: "Lassen wir uns einige typische Szenarien ansehen:" }), "\n", _jsxs(_components.h4, { id: "1-ein-benutzer-klickt-auf-die-anmeldeschaltfläche-in-einer-webanwendung", children: ["1. Ein Benutzer klickt auf die Anmeldeschaltfläche in einer Webanwendung", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#1-ein-benutzer-klickt-auf-die-anmeldeschaltfläche-in-einer-webanwendung", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "In einer traditionellen und serverseitigen Rendering-Webanwendung sind Frontend und Backend gekoppelt. Angenommen, die Webanwendung bedient sowohl Frontend als auch Backend:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Subjekt" }), ": Der Benutzer"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Zielgruppe" }), ": Der OIDC-Server"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Client" }), ": Die Webanwendung"] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Es mag kontraintuitiv erscheinen, dass die Zielgruppe der OIDC-Server ist. Tatsächlich ist dies der Schlüssel, um das SSO- (Single Sign-On) Erlebnis für Endbenutzer zu realisieren. Lass uns ein vereinfachtes Sequenzdiagramm für den ", _jsx(_components.a, { href: "https://blog.logto.io/implicit-flow-is-dead#how-authorization-code-flow-works", children: "Authorization Code Flow" }), " ansehen:"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User as Benutzer
(Subjekt)\n participant App1 as WebApp 1
(Client)\n participant App2 as WebApp 2
(Client)\n participant OIDC as OIDC-Server
(Zielgruppe)\n\n User ->> App1: Klick auf Anmelden\n App1 ->> OIDC: Umleitung
(Authorisierungsanfrage)\n OIDC ->> User: Anmeldeseite anzeigen\n User ->> OIDC: Anmelden\n OIDC ->> App1: Umleiten mit `code`\n App1 ->> OIDC: Token mithilfe von `code` austauschen\n Note über User: Einen Kaffee trinken\n User ->> App2: Klick auf Anmelden\n App2 ->> OIDC: Weiterleiten\n OIDC ->> OIDC: Gültige Sitzung gefunden\n OIDC ->> App2: Umleiten mit `code`\n App2 ->> OIDC: Token mithilfe von `code` austauschen\n" }) }), "\n", _jsxs(_components.p, { children: [_jsx(_components.code, { children: "code" }), " ist ein einmaliger Code, der gegen verschiedene Tokens ausgetauscht werden kann, wie z. B. Access Token, ID Token und Refresh Token. Es ist in Ordnung, wenn du diese Tokens im Moment nicht vollständig verstehst. Im weiteren Verlauf wirst du ein besseres Verständnis für sie entwickeln."] }), "\n", _jsx(_components.p, { children: "In dem obigen Fall muss sich der Benutzer nicht erneut anmelden, wenn er zu einer anderen Anwendung wechselt, da der Benutzer (Subjekt) bereits beim OIDC-Server (Zielgruppe) authentifiziert ist." }), "\n", _jsxs(_components.h4, { id: "2-ein-benutzer-verwendet-eine-single-page-anwendung", children: ["2. Ein Benutzer verwendet eine Single-Page-Anwendung", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#2-ein-benutzer-verwendet-eine-single-page-anwendung", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "In einer Single-Page-Anwendung (oder einer mobilen Anwendung) sind Frontend und Backend getrennt. Angenommen, das Backend ist ein API-Dienst:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Subjekt" }), ": Der Benutzer"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Zielgruppe" }), ": Der API-Dienst"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Client" }), ": Die Single-Page-Anwendung (SPA)"] }), "\n"] }), "\n", _jsx(_components.p, { children: "Ein vereinfachtes Sequenzdiagramm mit Authorization Code Flow:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant User as Benutzer
(Subjekt)\n participant SPA as Single-Page-Anwendung
(Client)\n participant API as API-Dienst
(Zielgruppe)\n participant OIDC as OIDC-Server
(Zielgruppe)\n\n User ->> SPA: Klick auf Anmelden\n SPA ->> OIDC: Umleitung
(Authorisierungsanfrage)\n OIDC ->> User: Anmeldeseite anzeigen\n User ->> OIDC: Anmelden\n OIDC ->> SPA: Umleiten mit `code`\n SPA ->> OIDC: Token mithilfe von `code` austauschen\n User ->> SPA: Versuch, eine geschützte Seite anzuzeigen\n SPA ->> API: Daten mit Access Token anfordern\n API ->> OIDC: Access Token validieren\n OIDC ->> API: OK\n API ->> SPA: Antworten mit Daten\n" }) }), "\n", _jsxs(_components.p, { children: ["Da der API-Dienst nicht interaktiv ist, muss die SPA den Access Token mit dem API-Dienst als Zielgruppe verwenden (das ", _jsx(_components.code, { children: "aud" }), " im Token)."] }), "\n", _jsx(_components.p, { children: _jsx(_components.strong, { children: "Warum ist der OIDC-Server immer noch eine Zielgruppe?" }) }), "\n", _jsx(_components.p, { children: "Technisch gesehen kannst du den OIDC-Server aus der Liste der Zielgruppen entfernen. Da du in den meisten Fällen die Benutzerinformationen vom OIDC-Server benötigst (was erfordert, dass der OIDC-Server die Zielgruppe ist), ist es besser, den OIDC-Server immer in die Liste der Zielgruppen aufzunehmen, wenn es um Benutzerinteraktionen geht." }), "\n", _jsx(_components.p, { children: _jsx(_components.strong, { children: "Moment, du sagst, dass wir mehrere Zielgruppen in einer Authorisierungsanfrage haben können?" }) }), "\n", _jsxs(_components.p, { children: ["Genau! Denke daran, dass OIDC auf OAuth 2.0 aufgebaut ist. Es ist möglich, ", _jsx(_components.a, { href: "https://datatracker.ietf.org/doc/html/rfc8707", children: "RFC 8707: Resource Indicators for OAuth 2.0" }), " in der Authorisierungsanfrage zu nutzen, um mehrere Zielgruppen anzugeben. Es erfordert die Unterstützung sowohl des Grants als auch des OIDC-Servers. ", _jsx(_components.a, { href: "https://logto.io", children: "Logto" }), " unterstützt diese Funktion von Haus aus."] }), "\n", _jsxs(_components.h4, { id: "3-eine-maschine-zu-maschine-kommunikation", children: ["3. Eine Maschine-zu-Maschine-Kommunikation", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#3-eine-maschine-zu-maschine-kommunikation", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Angenommen, du hast einen Dienst A, der den Dienst B anrufen muss:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Subjekt" }), ": Dienst A"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Zielgruppe" }), ": Dienst B"] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Client" }), ": Dienst A"] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Ein vereinfachtes Sequenzdiagramm mit ", _jsx(_components.a, { href: "https://datatracker.ietf.org/doc/html/rfc6749#section-1.3.4", children: "Client-Credentials-Grant" }), ":"] }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-mermaid", children: "sequenceDiagram\n participant ServiceA as Dienst A
(Subjekt und Client)\n participant ServiceB as Dienst B
(Zielgruppe)\n participant OIDC as OIDC-Server\n\n ServiceA ->> OIDC: Access Token anfordern
mit Client-Credentials (Token-Anfrage)\n OIDC ->> ServiceA: Access Token\n ServiceA ->> ServiceB: Daten mit Access Token anfordern\n ServiceB ->> OIDC: Access Token validieren\n OIDC ->> ServiceB: OK\n ServiceB ->> ServiceA: Antworten mit Daten\n" }) }), "\n", _jsx(_components.p, { children: "Wenn Dienst B den Dienst A anrufen muss, werden die Rollen einfach getauscht." }), "\n", _jsxs(_components.h4, { id: "zusammenfassung", children: ["Zusammenfassung", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#zusammenfassung", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Subjekt" }), ": Es kann ein Benutzer, ein Dienst oder eine beliebige Entität sein, die auf die Zielgruppe zugreifen muss."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Client" }), ": Es kann eine Webanwendung, eine mobile Anwendung oder eine beliebige Entität sein, die die Anfrage initiiert oder im Namen des Subjekts handelt."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Zielgruppe" }), ": Es kann ein Dienst, eine API oder eine beliebige Entität sein, die dem Subjekt Zugang gewährt."] }), "\n"] }), "\n", _jsxs(_components.h3, { id: "tokens", children: ["Tokens", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#tokens", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Es gibt drei Arten von Tokens, auf die du stoßen könntest, wenn du mit OIDC arbeitest:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Access Token" }), ": Es wird verwendet, um auf die Zielgruppe zuzugreifen. Es kann ein JWT (JSON Web Token) oder ein undurchsichtiges Token (normalerweise eine zufällige Zeichenfolge) sein."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "ID Token" }), ": Ein OIDC-spezifisches Token, das Benutzerinformationen enthält. Es ist immer ein JWT. Der Client kann das Token decodieren, um Benutzerinformationen zu erhalten."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Refresh Token" }), ": Es wird verwendet, um ein neues Set von Tokens zu erhalten, wenn das Access Token oder das ID Token abläuft."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Für eine detaillierte Erklärung dieser Tokens kannst du dich auf ", _jsx(_components.a, { href: "https://blog.logto.io/understanding-tokens-in-oidc", children: "Verständnis von Refresh Tokens, Access Tokens und ID Tokens im OIDC-Protokoll" }), " beziehen."] }), "\n", _jsxs(_components.p, { children: ["In den obigen Szenarien 1 und 2 bezieht sich der Begriff ", _jsx(_components.em, { children: "Authorisierungsanfrage" }), " auf eine Anfrage, um ein Set von Tokens über einen spezifischen ", _jsx(_components.em, { children: "Grant" }), " zu erhalten."] }), "\n", _jsx(Note, { children: _jsxs(_components.p, { children: ["Während das OAuth 2.0 RFC den Begriff ", _jsx(_components.em, { children: "Grant" }), " verwendet, verwenden Menschen in der Praxis oft den Begriff ", _jsx(_components.em, { children: "Flow" }), ", um einen allgemeingültigeren, End-to-End-Prozess zu beschreiben."] }) }), "\n", _jsxs(_components.p, { children: ["Wenn alles gut geht, wird ein Set von Tokens im Schritt \"Token mithilfe von ", _jsx(_components.code, { children: "code" }), " austauschen\" zurückgegeben. Die verfügbaren Tokens im Set hängen von mehreren Faktoren ab, insbesondere vom ", _jsx(_components.code, { children: "scope" }), "-Parameter in der Authorisierungsanfrage. Der Einfachheit halber gehen wir davon aus, dass alle Tokens im Set zurückgegeben werden. Sobald das Access Token abläuft, kann der Client das Refresh Token verwenden, um ein neues Set von Tokens ohne Benutzerinteraktion zu erhalten."] }), "\n", _jsx(_components.p, { children: "Für Szenario 3 ist es einfacher, da der Client-Credentials-Grant nur ein Access Token zurückgibt." }), "\n", _jsxs(_components.h3, { id: "mehrere-zielgruppen", children: ["Mehrere Zielgruppen", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#mehrere-zielgruppen", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Du hast vielleicht bemerkt, dass immer nur ein Access Token auf einmal zurückgegeben wird. Wie könnten wir den Fall handhaben, in dem der Client auf mehrere Zielgruppen zugreifen muss?" }), "\n", _jsx(_components.p, { children: "Es gibt zwei gemeinsame Lösungen:" }), "\n", _jsxs(_components.h4, { id: "resource-im-code-austauschanfrage-angeben", children: [_jsx(_components.code, { children: "resource" }), " im Code-Austauschanfrage angeben", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#resource-im-code-austauschanfrage-angeben", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Wenn der Client den Code gegen Tokens austauscht, kann er einen ", _jsx(_components.code, { children: "resource" }), "-Parameter in der Anfrage angeben. Der OIDC-Server wird ein Access Token für die angegebene Zielgruppe zurückgeben, falls zutreffend."] }), "\n", _jsx(_components.p, { children: "Hier ist ein nicht-normatives Beispiel:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-http", children: "POST /token HTTP/1.1\nHost: oidc-server.example.com\nContent-Type: application/x-www-form-urlencoded\n\ngrant_type=authorization_code\n&code=AUTHORIZATION_CODE\n&client_id=CLIENT_ID\n&client_secret=CLIENT_SECRET\n&resource=API_SERVICE\n" }) }), "\n", _jsxs(_components.p, { children: ["Dann wird der OIDC-Server ein Access Token für die ", _jsx(_components.code, { children: "API_SERVICE" }), "-Zielgruppe zurückgeben, falls zutreffend."] }), "\n", _jsxs(_components.h4, { id: "ein-refresh-token-verwenden-um-ein-neues-access-token-zu-erhalten", children: ["Ein Refresh Token verwenden, um ein neues Access Token zu erhalten", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#ein-refresh-token-verwenden-um-ein-neues-access-token-zu-erhalten", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Mit RFC 8707 kann der Client sogar mehrere Zielgruppen angeben, indem er den ", _jsx(_components.code, { children: "resource" }), "-Parameter mehrmals verwendet. Jetzt, wenn Refresh Tokens im Client verfügbar sind, kann der Client die Zielgruppe im ", _jsx(_components.code, { children: "resource" }), "-Parameter angeben, wenn das Token aktualisiert wird."] }), "\n", _jsx(_components.p, { children: "Hier ist ein nicht-normatives Beispiel:" }), "\n", _jsx(_components.pre, { children: _jsx(_components.code, { className: "language-http", children: "POST /token HTTP/1.1\nHost: oidc-server.example.com\nContent-Type: application/x-www-form-urlencoded\n\ngrant_type=refresh_token\n&refresh_token=REFRESH_TOKEN\n&client_id=CLIENT_ID\n&client_secret=CLIENT_SECRET\n&resource=API_SERVICE\n" }) }), "\n", _jsx(_components.p, { children: "Es hat die gleiche Wirkung wie die vorherige Lösung. In der Zwischenzeit sind andere gewährte Zielgruppen weiterhin in zukünftigen Token-Anfragen verfügbar." }), "\n", _jsxs(_components.h4, { id: "client-credentials-grant", children: ["Client-Credentials-Grant", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#client-credentials-grant", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Du kannst auch den ", _jsx(_components.code, { children: "resource" }), "-Parameter im Client-Credentials-Grant verwenden, um die Zielgruppe anzugeben. Es gibt kein Problem mit mehreren Zielgruppen in diesem Grant, da du immer ein neues Access Token für eine andere Zielgruppe anfordern kannst, indem du einfach eine weitere Token-Anfrage sendest."] }), "\n", _jsxs(_components.h3, { id: "deinen-api-dienst-schützen", children: ["Deinen API-Dienst schützen", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#deinen-api-dienst-schützen", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Der \"API-Dienst\" im Szenario 2 und der \"Dienst B\" im Szenario 3 haben eines gemeinsam: Sie müssen das Access Token validieren, um festzustellen, ob die Anfrage autorisiert ist. Abhängig vom Format des Access Tokens kann sich der Validierungsprozess unterscheiden." }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "Undurchsichtiges Token" }), ": Der API-Dienst muss den OIDC-Server aufrufen, um das Token zu validieren. Ein ", _jsx(_components.a, { href: "https://blog.logto.io/oauth2-token-introspection", children: "Introspektionsendpunkt" }), " wird normalerweise vom OIDC-Server zu diesem Zweck bereitgestellt."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.strong, { children: "JWT" }), ": Der API-Dienst kann das Token lokal validieren, indem er die Signatur und die Ansprüche im Token überprüft. Der OIDC-Server stellt normalerweise einen ", _jsx(_components.a, { href: "https://openid.net/specs/openid-connect-discovery-1_0.html#ProviderMetadata", children: "JSON Web Key Set (JWKS)-Endpunkt" }), " (", _jsx(_components.code, { children: "jwks_uri" }), ") für den API-Dienst bereit, um den öffentlichen Schlüssel zum Überprüfen der Signatur zu erhalten."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Wenn du neu bei JWT bist, kannst du dich auf ", _jsx(_components.a, { href: "https://blog.logto.io/what-is-jwt", children: "Was ist JSON Web Token (JWT)?" }), " beziehen. Tatsächlich muss die Signatur-Validierung und das Überprüfen der Ansprüche normalerweise nicht manuell durchgeführt werden, da es viele Bibliotheken gibt, die dies für dich erledigen können, wie z. B. ", _jsx(_components.a, { href: "https://github.com/panva/jose", children: "jose" }), " für Node.js und Webbrowser."] }), "\n", _jsxs(_components.h4, { id: "ansprüche-prüfen", children: ["Ansprüche prüfen", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#ansprüche-prüfen", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Zusätzlich zur Validierung der JWT-Signatur sollte der API-Dienst immer die Ansprüche im Token überprüfen:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "iss" }), ": Der Herausgeber des Tokens. Er sollte mit der URL des OIDC-Servers übereinstimmen."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "aud" }), ": Die Zielgruppe des Tokens. Er sollte mit dem Zielgruppenwert des API-Dienstes (normalerweise ein gültiger URI) übereinstimmen."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "exp" }), ": Die Ablaufzeit des Tokens. Der API-Dienst sollte das Token ablehnen, wenn es abgelaufen ist."] }), "\n", _jsxs(_components.li, { children: [_jsx(_components.code, { children: "scope" }), ": Die Scopes (Berechtigungen) des Tokens. Der API-Dienst sollte prüfen, ob der erforderliche Scope im Token vorhanden ist."] }), "\n"] }), "\n", _jsxs(_components.p, { children: ["Andere Ansprüche, wie ", _jsx(_components.code, { children: "sub" }), " (Subjekt) und ", _jsx(_components.code, { children: "iat" }), " (ausgestellt um), sind in einigen Fällen ebenfalls wichtig. Wenn du zusätzliche Sicherheitsmaßnahmen hast, überprüfe die Ansprüche entsprechend."] }), "\n", _jsxs(_components.h2, { id: "autorisierung", children: ["Autorisierung", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#autorisierung", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsxs(_components.p, { children: ["Eine unbeantwortete Frage bleibt offen: Wie bestimmen wir, ob ein ", _jsx(_components.em, { children: "Scope" }), " (d.h. Berechtigung) einem Subjekt gewährt werden kann?"] }), "\n", _jsx(_components.p, { children: "Die einzelne Frage eröffnet eine völlig neue Welt der Autorisierung, die nicht im Rahmen dieses Artikels behandelt wird. Kurz gesagt, es gibt einige gängige Ansätze wie RBAC (Role-Based Access Control) und ABAC (Attribute-Based Access Control). Hier sind einige Ressourcen, um dir den Einstieg zu erleichtern:" }), "\n", _jsxs(_components.ul, { children: ["\n", _jsx(_components.li, { children: _jsx(_components.a, { href: "https://blog.logto.io/rbac-and-abac", children: "RBAC und ABAC: Die Zugriffssteuerungsmodelle, die du kennen solltest" }) }), "\n", _jsx(_components.li, { children: _jsx(_components.a, { href: "https://blog.logto.io/mastering-rbac", children: "Beherrschung von RBAC in Logto: Ein umfassendes Beispiel aus der Praxis" }) }), "\n"] }), "\n", _jsxs(_components.h2, { id: "abschließende-anmerkungen", children: ["Abschließende Anmerkungen", _jsx(_components.a, { "aria-hidden": "true", tabIndex: "-1", href: "#abschließende-anmerkungen", children: _jsx(_components.span, { children: "#" }) })] }), "\n", _jsx(_components.p, { children: "Die Einführung eines OIDC-Servers in dein Projekt ist ein großer Schritt. Es kann die Sicherheit und Skalierbarkeit deines Projekts erheblich verbessern. Gleichzeitig kann es einige Zeit dauern, die Konzepte und die Interaktionen zwischen den Komponenten zu verstehen." }), "\n", _jsx(_components.p, { children: "Die Wahl eines guten OIDC-Anbieters, der zu deinen Anforderungen und Vorlieben passt, kann die Komplexität des Integrationsprozesses erheblich reduzieren, da der Anbieter normalerweise das gesamte Paket anbietet, einschließlich des OIDC-Servers, der Autorisierungsmechanismen, der SDKs und der Unternehmensfunktionen, die du möglicherweise in der Zukunft benötigst." }), "\n", _jsxs(_components.p, { children: ["Ich hoffe, dieser Leitfaden hilft dir, die Grundlagen der Integration eines OIDC-Servers zu verstehen. Wenn du nach einem Anfangspunkt suchst, empfehle ich auf egoistische Weise ", _jsx(_components.a, { href: "https://logto.io", children: "Logto" }), ", unsere Identitätsinfrastruktur für Entwickler."] }), "\n", _jsx(LogtoCloudButton, {})] }); } function MDXContent(props = {}) { const {wrapper: MDXLayout} = { ..._provideComponents(), ...props.components }; return MDXLayout ? _jsx(MDXLayout, { ...props, children: _jsx(_createMdxContent, { ...props }) }) : _createMdxContent(props); } return { headings, readingTime, frontmatter, default: MDXContent }; function _missingMdxReference(id, component) { throw new Error("Expected " + (component ? "component" : "object") + " `" + id + "` to be defined: you likely forgot to import, pass, or provide it."); }