{"id":2449,"date":"2018-04-10T11:30:33","date_gmt":"2018-04-10T09:30:33","guid":{"rendered":"https:\/\/www.angulararchitects.io\/?p=2449"},"modified":"2018-04-10T11:30:33","modified_gmt":"2018-04-10T09:30:33","slug":"new-library-version-authentication-and-authorization","status":"publish","type":"post","link":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/","title":{"rendered":"New Library Version: Authentication And Authorization"},"content":{"rendered":"<div class=\"article\">\n<p style=\"margin-top:0cm;margin-right:0cm;margin-bottom:7.5pt;margin-left:0cm\"><span lang=\"EN-US\">In the last days, I've updated my lib<br \/>\nthat allows to use OAuth 2 and OpenId Connect (OIDC) together with Angular 2 to<br \/>\nimplement modern auth scenarios. In order to align with the new naming<br \/>\nconventions (#JustAngular) it is called&nbsp;<i>angular-oauth2-oidc<\/i><span class=\"apple-converted-space\">&nbsp;<\/span>now. It can be downloaded via npm.<span class=\"apple-converted-space\">&nbsp;<\/span><\/span><span><a href=\"https:\/\/www.npmjs.com\/package\/angular-oauth2-oidc\" target=\"_blank\" rel=\"noopener\"><span lang=\"EN-US\">Same examples<\/span><\/a><\/span><span class=\"apple-converted-space\"><span lang=\"EN-US\">&nbsp;<\/span><\/span><span lang=\"EN-US\">showing how to use it can be found in<br \/>\nthe<span class=\"apple-converted-space\">&nbsp;<\/span><\/span><span><a href=\"https:\/\/www.npmjs.com\/package\/angular-oauth2-oidc\" target=\"_blank\" rel=\"noopener\"><span lang=\"EN-US\">npm repository<\/span><\/a><\/span><span lang=\"EN-US\">. The next sections describe the new features.<\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><b><\/b><\/p>\n<h2 lang=\"EN-US\"><b>Password Flow<\/b><\/h2>\n<p><span lang=\"EN-US\"><o:p><\/o:p><\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><span lang=\"EN-US\">The new version not only supports the<br \/>\nimplicit flow which redirects the user to the auth server for logging in, but also the password flow. This flow demands the users to enter their credentials into the client. The client in turn can exchange them for an access token. Although this undermines the ideas of OAuth 2 in some way, it is a popular approach for business applications where users don't have a problem with entrusting the client with their passwords.<\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><b><\/b><\/p>\n<h2 lang=\"EN-US\"><b>Discovery Document<\/b><\/h2>\n<p><span lang=\"EN-US\"><o:p><\/o:p><\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><span lang=\"EN-US\">To simplify the configuration of the library it can now read the discovery document that is described by OIDC.<\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><b><\/b><\/p>\n<h2 lang=\"EN-US\"><b>Refresh Tokens<\/b><\/h2>\n<p><span lang=\"EN-US\"><o:p><\/o:p><\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><span lang=\"EN-US\">The new version can also use refresh tokens to fetch a new access token, for instance after it expired. Using this approach sliding expiration can be implemented. It is important to note that the implicit flow doesn't allow for refresh tokens by design. Therefore, the lib only supports refresh tokens when using the password flow.<\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><b><\/b><\/p>\n<h2 lang=\"EN-US\"><b>Querying the userinfo endpoint<\/b><\/h2>\n<p><span lang=\"EN-US\"><o:p><\/o:p><\/span><\/p>\n<p style=\"margin: 0cm 0cm 7.5pt;\"><span lang=\"EN-US\">OIDC also defines a userinfo endpoint that returns some information about the current user. As the password flow does not support issuing an identity token, this endpoint can be used instead.<\/span><\/p>\n<p class=\"MsoNormal\">\n<h2 lang=\"EN-US\">Further information<\/h2>\n<\/p>\n<p class=\"MsoNormal\">\n<ul>\n<li><a href=\"https:\/\/www.npmjs.com\/package\/angular-oauth2-oidc\" target=\"_blank\" style=\"background-color: rgb(255, 255, 255);\" rel=\"noopener\">Documentation for angular-oauth2-oidc<\/a><\/li>\n<li>Blog:&nbsp;<a href=\"https:\/\/www.angulararchitects.io\/post\/2016\/07\/03\/authentication-in-angular-2-with-oauth2-oidc-and-guards-for-the-newest-new-router-english-version.aspx   \" target=\"_blank\" style=\"background-color: rgb(255, 255, 255);\" rel=\"noopener\">Protecting Routes with Guards<\/a><\/li>\n<\/ul>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>For Angular With OAuth 2 And OIDC<\/p>\n","protected":false},"author":9,"featured_media":2997,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_price":"","_stock":"","_tribe_ticket_header":"","_tribe_default_ticket_provider":"","_ticket_start_date":"","_ticket_end_date":"","_tribe_ticket_show_description":"","_tribe_ticket_show_not_going":false,"_tribe_ticket_use_global_stock":"","_tribe_ticket_global_stock_level":"","_global_stock_mode":"","_global_stock_cap":"","_tribe_rsvp_for_event":"","_tribe_ticket_going_count":"","_tribe_ticket_not_going_count":"","_tribe_tickets_list":"[]","_tribe_ticket_has_attendee_info_fields":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2449","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-unkategorisiert"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.1.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>New Library Version: Authentication And Authorization - ANGULARarchitects<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"New Library Version: Authentication And Authorization - ANGULARarchitects\" \/>\n<meta property=\"og:description\" content=\"For Angular With OAuth 2 And OIDC\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\" \/>\n<meta property=\"og:site_name\" content=\"ANGULARarchitects\" \/>\n<meta property=\"article:published_time\" content=\"2018-04-10T09:30:33+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"853\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Manfred Steyer, GDE\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@daniel\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Manfred Steyer, GDE\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\"},\"author\":{\"name\":\"Manfred Steyer, GDE\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951\"},\"headline\":\"New Library Version: Authentication And Authorization\",\"datePublished\":\"2018-04-10T09:30:33+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\"},\"wordCount\":288,\"publisher\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"articleSection\":[\"Unkategorisiert\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\",\"name\":\"New Library Version: Authentication And Authorization - ANGULARarchitects\",\"isPartOf\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"datePublished\":\"2018-04-10T09:30:33+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage\",\"url\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"contentUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg\",\"width\":1280,\"height\":853},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.angulararchitects.io\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"New Library Version: Authentication And Authorization\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#website\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/\",\"name\":\"ANGULARarchitects\",\"description\":\"AngularArchitects.io\",\"publisher\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.angulararchitects.io\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#organization\",\"name\":\"ANGULARarchitects\",\"alternateName\":\"SOFTWAREarchitects\",\"url\":\"https:\/\/www.angulararchitects.io\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg\",\"contentUrl\":\"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg\",\"width\":644,\"height\":216,\"caption\":\"ANGULARarchitects\"},\"image\":{\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/github.com\/angular-architects\",\"https:\/\/www.linkedin.com\/company\/angular-architects\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951\",\"name\":\"Manfred Steyer, GDE\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g\",\"caption\":\"Manfred Steyer, GDE\"},\"sameAs\":[\"https:\/\/x.com\/daniel\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"New Library Version: Authentication And Authorization - ANGULARarchitects","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/","og_locale":"en_US","og_type":"article","og_title":"New Library Version: Authentication And Authorization - ANGULARarchitects","og_description":"For Angular With OAuth 2 And OIDC","og_url":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/","og_site_name":"ANGULARarchitects","article_published_time":"2018-04-10T09:30:33+00:00","og_image":[{"width":1280,"height":853,"url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","type":"image\/jpeg"}],"author":"Manfred Steyer, GDE","twitter_card":"summary_large_image","twitter_creator":"@daniel","twitter_misc":{"Written by":"Manfred Steyer, GDE","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#article","isPartOf":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/"},"author":{"name":"Manfred Steyer, GDE","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951"},"headline":"New Library Version: Authentication And Authorization","datePublished":"2018-04-10T09:30:33+00:00","mainEntityOfPage":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/"},"wordCount":288,"publisher":{"@id":"https:\/\/www.angulararchitects.io\/en\/#organization"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage"},"thumbnailUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","articleSection":["Unkategorisiert"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/","url":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/","name":"New Library Version: Authentication And Authorization - ANGULARarchitects","isPartOf":{"@id":"https:\/\/www.angulararchitects.io\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage"},"thumbnailUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","datePublished":"2018-04-10T09:30:33+00:00","breadcrumb":{"@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#primaryimage","url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","contentUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2019\/04\/blog-2355684-1280.jpg","width":1280,"height":853},{"@type":"BreadcrumbList","@id":"https:\/\/www.angulararchitects.io\/en\/blog\/new-library-version-authentication-and-authorization\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.angulararchitects.io\/en\/"},{"@type":"ListItem","position":2,"name":"New Library Version: Authentication And Authorization"}]},{"@type":"WebSite","@id":"https:\/\/www.angulararchitects.io\/en\/#website","url":"https:\/\/www.angulararchitects.io\/en\/","name":"ANGULARarchitects","description":"AngularArchitects.io","publisher":{"@id":"https:\/\/www.angulararchitects.io\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.angulararchitects.io\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.angulararchitects.io\/en\/#organization","name":"ANGULARarchitects","alternateName":"SOFTWAREarchitects","url":"https:\/\/www.angulararchitects.io\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/","url":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg","contentUrl":"https:\/\/www.angulararchitects.io\/wp-content\/uploads\/2023\/07\/AA-Logo-RGB-horizontal-inside-knowledge-black.svg","width":644,"height":216,"caption":"ANGULARarchitects"},"image":{"@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/github.com\/angular-architects","https:\/\/www.linkedin.com\/company\/angular-architects\/"]},{"@type":"Person","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/15628efa7af4475ffaaeeb26c5112951","name":"Manfred Steyer, GDE","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.angulararchitects.io\/en\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a0b59539674d8b71ea1c1f4764b11244b5f499203f1d11b40f37d8f3f90be033?s=96&d=mm&r=g","caption":"Manfred Steyer, GDE"},"sameAs":["https:\/\/x.com\/daniel"]}]}},"_links":{"self":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts\/2449","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/comments?post=2449"}],"version-history":[{"count":0,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/posts\/2449\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/media\/2997"}],"wp:attachment":[{"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/media?parent=2449"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/categories?post=2449"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.angulararchitects.io\/en\/wp-json\/wp\/v2\/tags?post=2449"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}