Slide 1

Slide 1 text

Securing your App with Auth0

Slide 2

Slide 2 text

Fabian Gosebrink https://offering.solutions @FabianGosebrink

Slide 3

Slide 3 text

Why?

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

Identity

Slide 13

Slide 13 text

{ "nickname": "testuser", "name": "[email protected]", "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", "updated_at": "2022-10-23T08:53:13.652Z", "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "iat": 1666515194, "exp": 1666551194, "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" } 1 2 3 4 5 6 7 8 9 10 11 12 13

Slide 14

Slide 14 text

{ "nickname": "testuser", "name": "[email protected]", "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", "updated_at": "2022-10-23T08:53:13.652Z", "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "iat": 1666515194, "exp": 1666551194, "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" } 1 2 3 4 5 6 7 8 9 10 11 12 13 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 "nickname": "testuser", 2 "name": "[email protected]", 3 "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", 4 "updated_at": "2022-10-23T08:53:13.652Z", 5 6 "sub": "auth0|626e4008908bab0069c8f20d", 7 "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 8 "iat": 1666515194, 9 "exp": 1666551194, 10 "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", 11 "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" 12 } 13

Slide 15

Slide 15 text

{ "nickname": "testuser", "name": "[email protected]", "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", "updated_at": "2022-10-23T08:53:13.652Z", "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "iat": 1666515194, "exp": 1666551194, "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" } 1 2 3 4 5 6 7 8 9 10 11 12 13 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 "nickname": "testuser", 2 "name": "[email protected]", 3 "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", 4 "updated_at": "2022-10-23T08:53:13.652Z", 5 6 "sub": "auth0|626e4008908bab0069c8f20d", 7 "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 8 "iat": 1666515194, 9 "exp": 1666551194, 10 "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", 11 "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" 12 } 13 "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", { 1 "nickname": "testuser", 2 "name": "[email protected]", 3 "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", 4 "updated_at": "2022-10-23T08:53:13.652Z", 5 "iss": "https://dev-2fwvrhka.us.auth0.com/", 6 "sub": "auth0|626e4008908bab0069c8f20d", 7 8 "iat": 1666515194, 9 "exp": 1666551194, 10 "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", 11 "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" 12 } 13

Slide 16

Slide 16 text

{ "nickname": "testuser", "name": "[email protected]", "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", "updated_at": "2022-10-23T08:53:13.652Z", "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "iat": 1666515194, "exp": 1666551194, "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" } 1 2 3 4 5 6 7 8 9 10 11 12 13 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 "nickname": "testuser", 2 "name": "[email protected]", 3 "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", 4 "updated_at": "2022-10-23T08:53:13.652Z", 5 6 "sub": "auth0|626e4008908bab0069c8f20d", 7 "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 8 "iat": 1666515194, 9 "exp": 1666551194, 10 "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", 11 "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" 12 } 13 "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", { 1 "nickname": "testuser", 2 "name": "[email protected]", 3 "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", 4 "updated_at": "2022-10-23T08:53:13.652Z", 5 "iss": "https://dev-2fwvrhka.us.auth0.com/", 6 "sub": "auth0|626e4008908bab0069c8f20d", 7 8 "iat": 1666515194, 9 "exp": 1666551194, 10 "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", 11 "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" 12 } 13 { "nickname": "testuser", "name": "[email protected]", "picture": "https://s.gravatar.com/[...]avatars%2Fte.png", "updated_at": "2022-10-23T08:53:13.652Z", "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "iat": 1666515194, "exp": 1666551194, "sid": "hVYUGB_VhqxQ2SDuaLuNjRKz0I2ViOQ0", "nonce": "3661cea8889816d9eeefd99e8a9a51c952WJ1OHaU" } 1 2 3 4 5 6 7 8 9 10 11 12 13

Slide 17

Slide 17 text

OAuth 2.0

Slide 18

Slide 18 text

Open Authorization

Slide 19

Slide 19 text

Access Tokens

Slide 20

Slide 20 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

Slide 21

Slide 21 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 22

Slide 22 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 23

Slide 23 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 4 5 6 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 24

Slide 24 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 4 5 6 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "iat": 1666515194, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 25

Slide 25 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 4 5 6 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "iat": 1666515194, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "exp": 1666601594, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 26

Slide 26 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 4 5 6 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "iat": 1666515194, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "exp": 1666601594, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 27

Slide 27 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 4 5 6 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "iat": 1666515194, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "exp": 1666601594, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "scope": "openid profile access:api offline_access", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16

Slide 28

Slide 28 text

{ "iss": "https://dev-2fwvrhka.us.auth0.com/", "sub": "auth0|626e4008908bab0069c8f20d", "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], "iat": 1666515194, "exp": 1666601594, "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", "scope": "openid profile access:api offline_access", "permissions": [ "access:api", "read:weather" ] } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 "iss": "https://dev-2fwvrhka.us.auth0.com/", { 1 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "sub": "auth0|626e4008908bab0069c8f20d", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "aud": [ "https://localhost:5001", "https://dev-2fwvrhka.us.auth0.com/userinfo" ], { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 4 5 6 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "iat": 1666515194, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "exp": 1666601594, { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 10 "scope": "openid profile access:api offline_access", 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "scope": "openid profile access:api offline_access", { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 11 "permissions": [ 12 "access:api", 13 "read:weather" 14 ] 15 } 16 "permissions": [ "access:api", "read:weather" ] { 1 "iss": "https://dev-2fwvrhka.us.auth0.com/", 2 "sub": "auth0|626e4008908bab0069c8f20d", 3 "aud": [ 4 "https://localhost:5001", 5 "https://dev-2fwvrhka.us.auth0.com/userinfo" 6 ], 7 "iat": 1666515194, 8 "exp": 1666601594, 9 "azp": "E7VCSlskwSPQvM1uwPRyyGvGYOc21MSg", 10 "scope": "openid profile access:api offline_access", 11 12 13 14 15 } 16

Slide 29

Slide 29 text

Flow

Slide 30

Slide 30 text

Code Flow

Slide 31

Slide 31 text

No content

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

Browser

Slide 34

Slide 34 text

Browser

Slide 35

Slide 35 text

Request Browser

Slide 36

Slide 36 text

Request Login Browser

Slide 37

Slide 37 text

Request Login Redirect & Code Browser

Slide 38

Slide 38 text

Request Login Redirect & Code Code Browser

Slide 39

Slide 39 text

Request Login Redirect & Code Code Browser Tokens

Slide 40

Slide 40 text

https://auth0.com/docs/get-started/authentication-and-authorization-flow/authorization-code-flow-with-proof-key-for-code-exchange-pkce

Slide 41

Slide 41 text

No content

Slide 42

Slide 42 text

Step 1

Slide 43

Slide 43 text

Redirect Step 1

Slide 44

Slide 44 text

Username Password Redirect Step 1

Slide 45

Slide 45 text

Username Password Redirect Step 1

Slide 46

Slide 46 text

Step 2

Slide 47

Slide 47 text

Tokens { ... } Step 2

Slide 48

Slide 48 text

Tokens { ... } Step 2

Slide 49

Slide 49 text

/home /status ...

Slide 50

Slide 50 text

/home /status /secure ...

Slide 51

Slide 51 text

/home /status ... User

Slide 52

Slide 52 text

/home /status /secure ... User

Slide 53

Slide 53 text

/home /status ... User

Slide 54

Slide 54 text

/home /status /secure ... User

Slide 55

Slide 55 text

No content

Slide 56

Slide 56 text

Redirect to Auth0 Process the code Request information Process information Set the state

Slide 57

Slide 57 text

Redirect to Auth0 Provide the login mask Provide social logins Create the code Turn code into user info Process the code Request information Process information Set the state

Slide 58

Slide 58 text

No content

Slide 59

Slide 59 text

Process the code Request information Process information Set the state ...more!

Slide 60

Slide 60 text

https://www.npmjs.com/package/angular-auth-oidc-client

Slide 61

Slide 61 text

https://github.com/auth0/auth0-angular

Slide 62

Slide 62 text

No content

Slide 63

Slide 63 text

No content

Slide 64

Slide 64 text

No content

Slide 65

Slide 65 text

No content

Slide 66

Slide 66 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

Slide 67

Slide 67 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24

Slide 68

Slide 68 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 69

Slide 69 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 70

Slide 70 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 71

Slide 71 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 72

Slide 72 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 responseType: 'code', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 73

Slide 73 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 responseType: 'code', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 silentRenew: true, useRefreshToken: true, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 14 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 74

Slide 74 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 responseType: 'code', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 silentRenew: true, useRefreshToken: true, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 14 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 postLogoutRedirectUri: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 75

Slide 75 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 responseType: 'code', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 silentRenew: true, useRefreshToken: true, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 14 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 postLogoutRedirectUri: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 customParamsAuthRequest: { audience: '...', }, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 17 18 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24

Slide 76

Slide 76 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 responseType: 'code', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 silentRenew: true, useRefreshToken: true, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 14 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 postLogoutRedirectUri: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 customParamsAuthRequest: { audience: '...', }, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 17 18 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 secureRoutes: ['...'], import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 20 }, 21 }), 22 ], 23 }; 24

Slide 77

Slide 77 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 provideAuth({ }), import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 22 ], 23 }; 24 authority: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 redirectUrl: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 clientId: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 scope: '...', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 responseType: 'code', import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 silentRenew: true, useRefreshToken: true, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 14 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 postLogoutRedirectUri: window.location.origin, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 customParamsAuthRequest: { audience: '...', }, import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 17 18 19 secureRoutes: ['...'], 20 }, 21 }), 22 ], 23 }; 24 secureRoutes: ['...'], import { authInterceptor, provideAuth } 1 from 'angular-auth-oidc-client'; 2 3 export const appConfig = { 4 providers: [ 5 // ... 6 provideAuth({ 7 config: { 8 authority: '...', 9 redirectUrl: window.location.origin, 10 clientId: '...', 11 scope: '...', 12 responseType: 'code', 13 silentRenew: true, 14 useRefreshToken: true, 15 postLogoutRedirectUri: window.location.origin, 16 customParamsAuthRequest: { 17 audience: '...', 18 }, 19 20 }, 21 }), 22 ], 23 }; 24 import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

Slide 78

Slide 78 text

const appRoutes: Routes = [ { path: 'protected', component: , canActivate: [isAuthenticated] }, // ... ]; 1 2 3 4 5 6 7 8

Slide 79

Slide 79 text

import { OidcSecurityService } from 'angular-auth-oidc-client'; export const isAuthenticated = () => { const oidcSecurityService = inject(OidcSecurityService); const router = inject(Router); return oidcSecurityService.isAuthenticated$.pipe( take(1), map(({ isAuthenticated }) => { if (!isAuthenticated) { router.navigate(['/unauthorized']); return false; } return true; }) ); }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

Slide 80

Slide 80 text

import { OidcSecurityService } from 'angular-auth-oidc-client'; export const isAuthenticated = () => { const oidcSecurityService = inject(OidcSecurityService); const router = inject(Router); return oidcSecurityService.isAuthenticated$.pipe( take(1), map(({ isAuthenticated }) => { if (!isAuthenticated) { router.navigate(['/unauthorized']); return false; } return true; }) ); }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 import { OidcSecurityService } from 'angular-auth-oidc-client'; const oidcSecurityService = inject(OidcSecurityService); 1 2 3 export const isAuthenticated = () => { 4 5 const router = inject(Router); 6 7 return oidcSecurityService.isAuthenticated$.pipe( 8 take(1), 9 map(({ isAuthenticated }) => { 10 if (!isAuthenticated) { 11 router.navigate(['/unauthorized']); 12 13 return false; 14 } 15 16 return true; 17 }) 18 ); 19 }; 20

Slide 81

Slide 81 text

import { OidcSecurityService } from 'angular-auth-oidc-client'; export const isAuthenticated = () => { const oidcSecurityService = inject(OidcSecurityService); const router = inject(Router); return oidcSecurityService.isAuthenticated$.pipe( take(1), map(({ isAuthenticated }) => { if (!isAuthenticated) { router.navigate(['/unauthorized']); return false; } return true; }) ); }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 import { OidcSecurityService } from 'angular-auth-oidc-client'; const oidcSecurityService = inject(OidcSecurityService); 1 2 3 export const isAuthenticated = () => { 4 5 const router = inject(Router); 6 7 return oidcSecurityService.isAuthenticated$.pipe( 8 take(1), 9 map(({ isAuthenticated }) => { 10 if (!isAuthenticated) { 11 router.navigate(['/unauthorized']); 12 13 return false; 14 } 15 16 return true; 17 }) 18 ); 19 }; 20 if (!isAuthenticated) { router.navigate(['/unauthorized']); return false; } import { OidcSecurityService } 1 from 'angular-auth-oidc-client'; 2 3 export const isAuthenticated = () => { 4 const oidcSecurityService = inject(OidcSecurityService); 5 const router = inject(Router); 6 7 return oidcSecurityService.isAuthenticated$.pipe( 8 take(1), 9 map(({ isAuthenticated }) => { 10 11 12 13 14 15 16 return true; 17 }) 18 ); 19 }; 20

Slide 82

Slide 82 text

import { OidcSecurityService } from 'angular-auth-oidc-client'; export const isAuthenticated = () => { const oidcSecurityService = inject(OidcSecurityService); const router = inject(Router); return oidcSecurityService.isAuthenticated$.pipe( take(1), map(({ isAuthenticated }) => { if (!isAuthenticated) { router.navigate(['/unauthorized']); return false; } return true; }) ); }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 import { OidcSecurityService } from 'angular-auth-oidc-client'; const oidcSecurityService = inject(OidcSecurityService); 1 2 3 export const isAuthenticated = () => { 4 5 const router = inject(Router); 6 7 return oidcSecurityService.isAuthenticated$.pipe( 8 take(1), 9 map(({ isAuthenticated }) => { 10 if (!isAuthenticated) { 11 router.navigate(['/unauthorized']); 12 13 return false; 14 } 15 16 return true; 17 }) 18 ); 19 }; 20 if (!isAuthenticated) { router.navigate(['/unauthorized']); return false; } import { OidcSecurityService } 1 from 'angular-auth-oidc-client'; 2 3 export const isAuthenticated = () => { 4 const oidcSecurityService = inject(OidcSecurityService); 5 const router = inject(Router); 6 7 return oidcSecurityService.isAuthenticated$.pipe( 8 take(1), 9 map(({ isAuthenticated }) => { 10 11 12 13 14 15 16 return true; 17 }) 18 ); 19 }; 20 return true; import { OidcSecurityService } 1 from 'angular-auth-oidc-client'; 2 3 export const isAuthenticated = () => { 4 const oidcSecurityService = inject(OidcSecurityService); 5 const router = inject(Router); 6 7 return oidcSecurityService.isAuthenticated$.pipe( 8 take(1), 9 map(({ isAuthenticated }) => { 10 if (!isAuthenticated) { 11 router.navigate(['/unauthorized']); 12 13 return false; 14 } 15 16 17 }) 18 ); 19 }; 20

Slide 83

Slide 83 text

Demo

Slide 84

Slide 84 text

No content

Slide 85

Slide 85 text

import { authInterceptor, provideAuth } from 'angular-auth-oidc-client'; export const appConfig = { providers: [ // ... provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

Slide 86

Slide 86 text

export const appConfig = { providers: [ importProvidersFrom(BrowserModule), provideHttpClient(withInterceptors([authInterceptor()])), provideRouter(APP_ROUTES), provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

Slide 87

Slide 87 text

export const appConfig = { providers: [ importProvidersFrom(BrowserModule), provideHttpClient(withInterceptors([authInterceptor()])), provideRouter(APP_ROUTES), provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 provideHttpClient(withInterceptors([authInterceptor()])), export const appConfig = { 1 providers: [ 2 importProvidersFrom(BrowserModule), 3 4 provideRouter(APP_ROUTES), 5 provideAuth({ 6 config: { 7 authority: '...', 8 redirectUrl: window.location.origin, 9 clientId: '...', 10 scope: '...', 11 responseType: 'code', 12 silentRenew: true, 13 useRefreshToken: true, 14 postLogoutRedirectUri: window.location.origin, 15 customParamsAuthRequest: { 16 audience: '...', 17 }, 18 secureRoutes: ['...'], 19 }, 20 }), 21 ], 22 }; 23

Slide 88

Slide 88 text

export const appConfig = { providers: [ importProvidersFrom(BrowserModule), provideHttpClient(withInterceptors([authInterceptor()])), provideRouter(APP_ROUTES), provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], }; 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 provideHttpClient(withInterceptors([authInterceptor()])), export const appConfig = { 1 providers: [ 2 importProvidersFrom(BrowserModule), 3 4 provideRouter(APP_ROUTES), 5 provideAuth({ 6 config: { 7 authority: '...', 8 redirectUrl: window.location.origin, 9 clientId: '...', 10 scope: '...', 11 responseType: 'code', 12 silentRenew: true, 13 useRefreshToken: true, 14 postLogoutRedirectUri: window.location.origin, 15 customParamsAuthRequest: { 16 audience: '...', 17 }, 18 secureRoutes: ['...'], 19 }, 20 }), 21 ], 22 }; 23 provideAuth({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '...', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), export const appConfig = { 1 providers: [ 2 importProvidersFrom(BrowserModule), 3 provideHttpClient(withInterceptors([authInterceptor()])), 4 provideRouter(APP_ROUTES), 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 ], 22 }; 23

Slide 89

Slide 89 text

@Injectable() export class AuthInterceptor implements HttpInterceptor { private secureRoutes = ['https://localhost:44390']; constructor(private authService: AuthService) {} intercept( request: HttpRequest, next: HttpHandler ) { if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } const token = this.authService.token; if (!token) { return next.handle(request); } request = request.clone({ headers: request.headers.set('Authorization', 'Bearer ' + token), }); return next.handle(request); } } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27

Slide 90

Slide 90 text

@Injectable() export class AuthInterceptor implements HttpInterceptor { private secureRoutes = ['https://localhost:44390']; constructor(private authService: AuthService) {} intercept( request: HttpRequest, next: HttpHandler ) { if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } const token = this.authService.token; if (!token) { return next.handle(request); } request = request.clone({ headers: request.headers.set('Authorization', 'Bearer ' + token), }); return next.handle(request); } } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } @Injectable() 1 export class AuthInterceptor implements HttpInterceptor { 2 private secureRoutes = ['https://localhost:44390']; 3 4 constructor(private authService: AuthService) {} 5 6 intercept( 7 request: HttpRequest, 8 next: HttpHandler 9 ) { 10 11 12 13 14 const token = this.authService.token; 15 16 if (!token) { 17 return next.handle(request); 18 } 19 20 request = request.clone({ 21 headers: request.headers.set('Authorization', 'Bearer ' + token), 22 }); 23 24 return next.handle(request); 25 } 26 } 27

Slide 91

Slide 91 text

@Injectable() export class AuthInterceptor implements HttpInterceptor { private secureRoutes = ['https://localhost:44390']; constructor(private authService: AuthService) {} intercept( request: HttpRequest, next: HttpHandler ) { if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } const token = this.authService.token; if (!token) { return next.handle(request); } request = request.clone({ headers: request.headers.set('Authorization', 'Bearer ' + token), }); return next.handle(request); } } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } @Injectable() 1 export class AuthInterceptor implements HttpInterceptor { 2 private secureRoutes = ['https://localhost:44390']; 3 4 constructor(private authService: AuthService) {} 5 6 intercept( 7 request: HttpRequest, 8 next: HttpHandler 9 ) { 10 11 12 13 14 const token = this.authService.token; 15 16 if (!token) { 17 return next.handle(request); 18 } 19 20 request = request.clone({ 21 headers: request.headers.set('Authorization', 'Bearer ' + token), 22 }); 23 24 return next.handle(request); 25 } 26 } 27 const token = this.authService.token; if (!token) { return next.handle(request); } @Injectable() 1 export class AuthInterceptor implements HttpInterceptor { 2 private secureRoutes = ['https://localhost:44390']; 3 4 constructor(private authService: AuthService) {} 5 6 intercept( 7 request: HttpRequest, 8 next: HttpHandler 9 ) { 10 if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { 11 return next.handle(request); 12 } 13 14 15 16 17 18 19 20 request = request.clone({ 21 headers: request.headers.set('Authorization', 'Bearer ' + token), 22 }); 23 24 return next.handle(request); 25 } 26 } 27

Slide 92

Slide 92 text

@Injectable() export class AuthInterceptor implements HttpInterceptor { private secureRoutes = ['https://localhost:44390']; constructor(private authService: AuthService) {} intercept( request: HttpRequest, next: HttpHandler ) { if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } const token = this.authService.token; if (!token) { return next.handle(request); } request = request.clone({ headers: request.headers.set('Authorization', 'Bearer ' + token), }); return next.handle(request); } } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { return next.handle(request); } @Injectable() 1 export class AuthInterceptor implements HttpInterceptor { 2 private secureRoutes = ['https://localhost:44390']; 3 4 constructor(private authService: AuthService) {} 5 6 intercept( 7 request: HttpRequest, 8 next: HttpHandler 9 ) { 10 11 12 13 14 const token = this.authService.token; 15 16 if (!token) { 17 return next.handle(request); 18 } 19 20 request = request.clone({ 21 headers: request.headers.set('Authorization', 'Bearer ' + token), 22 }); 23 24 return next.handle(request); 25 } 26 } 27 const token = this.authService.token; if (!token) { return next.handle(request); } @Injectable() 1 export class AuthInterceptor implements HttpInterceptor { 2 private secureRoutes = ['https://localhost:44390']; 3 4 constructor(private authService: AuthService) {} 5 6 intercept( 7 request: HttpRequest, 8 next: HttpHandler 9 ) { 10 if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { 11 return next.handle(request); 12 } 13 14 15 16 17 18 19 20 request = request.clone({ 21 headers: request.headers.set('Authorization', 'Bearer ' + token), 22 }); 23 24 return next.handle(request); 25 } 26 } 27 request = request.clone({ headers: request.headers.set('Authorization', 'Bearer ' + token), }); return next.handle(request); @Injectable() 1 export class AuthInterceptor implements HttpInterceptor { 2 private secureRoutes = ['https://localhost:44390']; 3 4 constructor(private authService: AuthService) {} 5 6 intercept( 7 request: HttpRequest, 8 next: HttpHandler 9 ) { 10 if (!this.secureRoutes.find((x) => request.url.startsWith(x))) { 11 return next.handle(request); 12 } 13 14 const token = this.authService.token; 15 16 if (!token) { 17 return next.handle(request); 18 } 19 20 21 22 23 24 25 } 26 } 27

Slide 93

Slide 93 text

No content

Slide 94

Slide 94 text

No content

Slide 95

Slide 95 text

var app = builder.Build(); app.UseSwagger(); app.UseSwaggerUI(); app.UseCors("AllowAllOrigins"); app.UseHttpsRedirection(); app.UseAuthentication(); app.UseAuthorization(); app.MapControllers(); app.Run(); 1 2 3 4 5 6 7 8 9 10 11 12 13 14

Slide 96

Slide 96 text

var app = builder.Build(); app.UseSwagger(); app.UseSwaggerUI(); app.UseCors("AllowAllOrigins"); app.UseHttpsRedirection(); app.UseAuthentication(); app.UseAuthorization(); app.MapControllers(); app.Run(); 1 2 3 4 5 6 7 8 9 10 11 12 13 14 app.UseAuthentication(); app.UseAuthorization(); var app = builder.Build(); 1 2 app.UseSwagger(); 3 app.UseSwaggerUI(); 4 5 app.UseCors("AllowAllOrigins"); 6 app.UseHttpsRedirection(); 7 8 9 10 11 app.MapControllers(); 12 13 app.Run(); 14

Slide 97

Slide 97 text

builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme) .AddJwtBearer(JwtBearerDefaults.AuthenticationScheme, c => { c.Authority = auth0Domain; c.Audience = auth0Audience; c.TokenValidationParameters = new TokenValidationParameters { ValidAudience = auth0Audience, ValidIssuer = auth0Domain, NameClaimType = ClaimTypes.NameIdentifier }; }); 1 2 3 4 5 6 7 8 9 10 11 12

Slide 98

Slide 98 text

[ApiController] [Route("[controller]")] [Authorize] public class SomeDataController : ControllerBase { // Some HTTP Methods only accessible // When authorized }; 1 2 3 4 5 6 7 8

Slide 99

Slide 99 text

[ApiController] [Route("[controller]")] [Authorize] public class SomeDataController : ControllerBase { // Some HTTP Methods only accessible // When authorized }; 1 2 3 4 5 6 7 8 [Authorize] [ApiController] 1 [Route("[controller]")] 2 3 public class SomeDataController : ControllerBase 4 { 5 // Some HTTP Methods only accessible 6 // When authorized 7 }; 8

Slide 100

Slide 100 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8

Slide 101

Slide 101 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8 options.AddPolicy("access:api", policy => builder.Services.AddAuthorization(options => 1 { 2 3 { 4 policy.RequireClaim("azp", clientId); 5 policy.RequireClaim("iss", auth0Domain); 6 }); 7 }); 8

Slide 102

Slide 102 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8 options.AddPolicy("access:api", policy => builder.Services.AddAuthorization(options => 1 { 2 3 { 4 policy.RequireClaim("azp", clientId); 5 policy.RequireClaim("iss", auth0Domain); 6 }); 7 }); 8 policy.RequireClaim("azp", clientId); builder.Services.AddAuthorization(options => 1 { 2 options.AddPolicy("access:api", policy => 3 { 4 5 policy.RequireClaim("iss", auth0Domain); 6 }); 7 }); 8

Slide 103

Slide 103 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8 options.AddPolicy("access:api", policy => builder.Services.AddAuthorization(options => 1 { 2 3 { 4 policy.RequireClaim("azp", clientId); 5 policy.RequireClaim("iss", auth0Domain); 6 }); 7 }); 8 policy.RequireClaim("azp", clientId); builder.Services.AddAuthorization(options => 1 { 2 options.AddPolicy("access:api", policy => 3 { 4 5 policy.RequireClaim("iss", auth0Domain); 6 }); 7 }); 8 policy.RequireClaim("iss", auth0Domain); builder.Services.AddAuthorization(options => 1 { 2 options.AddPolicy("access:api", policy => 3 { 4 policy.RequireClaim("azp", clientId); 5 6 }); 7 }); 8

Slide 104

Slide 104 text

[ApiController] [Route("[controller]")] [Authorize("access:api")] public class SomeDataController : ControllerBase { // Some HTTP Methods only accessible // When authorized }; 1 2 3 4 5 6 7 8

Slide 105

Slide 105 text

[ApiController] [Route("[controller]")] [Authorize("access:api")] public class SomeDataController : ControllerBase { // Some HTTP Methods only accessible // When authorized }; 1 2 3 4 5 6 7 8 [Authorize("access:api")] [ApiController] 1 [Route("[controller]")] 2 3 public class SomeDataController : ControllerBase 4 { 5 // Some HTTP Methods only accessible 6 // When authorized 7 }; 8

Slide 106

Slide 106 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8

Slide 107

Slide 107 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy .Requirements .Add(new UserApiScopeHandlerRequirement("access:api")); policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8 9 10 11

Slide 108

Slide 108 text

builder.Services.AddAuthorization(options => { options.AddPolicy("access:api", policy => { policy .Requirements .Add(new UserApiScopeHandlerRequirement("access:api")); policy.RequireClaim("azp", clientId); policy.RequireClaim("iss", auth0Domain); }); }); 1 2 3 4 5 6 7 8 9 10 11 policy .Requirements .Add(new UserApiScopeHandlerRequirement("access:api")); builder.Services.AddAuthorization(options => 1 { 2 options.AddPolicy("access:api", policy => 3 { 4 5 6 7 policy.RequireClaim("azp", clientId); 8 policy.RequireClaim("iss", auth0Domain); 9 }); 10 }); 11

Slide 109

Slide 109 text

import { AuthModule } from 'angular-auth-oidc-client'; @NgModule({ imports: [ AuthModule.forRoot({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '... access:api', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], exports: [AuthModule], }) export class AuthConfigModule {} 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

Slide 110

Slide 110 text

import { AuthModule } from 'angular-auth-oidc-client'; @NgModule({ imports: [ AuthModule.forRoot({ config: { authority: '...', redirectUrl: window.location.origin, clientId: '...', scope: '... access:api', responseType: 'code', silentRenew: true, useRefreshToken: true, postLogoutRedirectUri: window.location.origin, customParamsAuthRequest: { audience: '...', }, secureRoutes: ['...'], }, }), ], exports: [AuthModule], }) export class AuthConfigModule {} 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 scope: '... access:api', import { AuthModule } from 'angular-auth-oidc-client'; 1 2 @NgModule({ 3 imports: [ 4 AuthModule.forRoot({ 5 config: { 6 authority: '...', 7 redirectUrl: window.location.origin, 8 clientId: '...', 9 10 responseType: 'code', 11 silentRenew: true, 12 useRefreshToken: true, 13 postLogoutRedirectUri: window.location.origin, 14 customParamsAuthRequest: { 15 audience: '...', 16 }, 17 secureRoutes: ['...'], 18 }, 19 }), 20 ], 21 exports: [AuthModule], 22 }) 23 export class AuthConfigModule {} 24

Slide 111

Slide 111 text

Demo

Slide 112

Slide 112 text

No content

Slide 113

Slide 113 text

No content

Slide 114

Slide 114 text

BFF

Slide 115

Slide 115 text

No content

Slide 116

Slide 116 text

Demo

Slide 117

Slide 117 text

No content

Slide 118

Slide 118 text

No content

Slide 119

Slide 119 text

No content

Slide 120

Slide 120 text

No content

Slide 121

Slide 121 text

No content

Slide 122

Slide 122 text

No content