├── .gitignore ├── LICENSE ├── README.md └── src ├── GraphApiLibrary ├── GraphApiLibrary.csproj └── GraphApiUserService.cs ├── Server ├── BlazorAuthFromScratch.csproj ├── BlazorAuthFromScratch.sln ├── Components │ ├── Account │ │ └── IdentityEndpointExtensions.cs │ ├── App.razor │ ├── GoogleExternalLogin.razor │ ├── Layout │ │ ├── MainLayout.razor │ │ ├── MainLayout.razor.css │ │ ├── NavMenu.razor │ │ └── NavMenu.razor.css │ ├── MicrosoftExternalLogin.razor │ ├── MyOwnLogin.razor │ ├── MyOwnLogout.razor │ ├── Pages │ │ ├── Error.razor │ │ ├── Home.razor │ │ └── Weather.razor │ ├── Routes.razor │ └── _Imports.razor ├── Program.cs ├── Properties │ └── launchSettings.json ├── Services │ └── BlazorAuthFromScratchClaimsTransformation.cs ├── appsettings.Development.json ├── appsettings.json └── wwwroot │ ├── app.css │ ├── bootstrap │ ├── bootstrap.min.css │ └── bootstrap.min.css.map │ └── favicon.png └── WebAssembly └── BlazorAuthFromScratchWasm ├── BlazorAuthFromScratchWasm.sln └── BlazorAuthFromScratchWasm ├── BlazorAuthFromScratchWasm.Client ├── BlazorAuthFromScratchWasm.Client.csproj ├── Layout │ ├── MainLayout.razor │ ├── MainLayout.razor.css │ ├── NavMenu.razor │ └── NavMenu.razor.css ├── Pages │ ├── Counter.razor │ ├── Home.razor │ └── Weather.razor ├── PersistentAuthenticationStateProvider.cs ├── Program.cs ├── Routes.razor ├── UserInfo.cs ├── _Imports.razor └── wwwroot │ ├── appsettings.Development.json │ └── appsettings.json └── BlazorAuthFromScratchWasm ├── BlazorAuthFromScratchWasm.csproj ├── Components ├── Account │ ├── IdentityEndpointExtensions.cs │ ├── Login.razor │ └── PersistingServerAuthenticationStateProvider.cs ├── App.razor ├── Pages │ └── Error.razor └── _Imports.razor ├── Program.cs ├── Properties └── launchSettings.json ├── appsettings.Development.json ├── appsettings.json └── wwwroot ├── app.css ├── bootstrap ├── bootstrap.min.css └── bootstrap.min.css.map └── favicon.png /.gitignore: -------------------------------------------------------------------------------- 1 | ## Ignore Visual Studio temporary files, build results, and 2 | ## files generated by popular Visual Studio add-ons. 3 | ## 4 | ## Get latest from https://github.com/github/gitignore/blob/main/VisualStudio.gitignore 5 | 6 | # User-specific files 7 | *.rsuser 8 | *.suo 9 | *.user 10 | *.userosscache 11 | *.sln.docstates 12 | 13 | # User-specific files (MonoDevelop/Xamarin Studio) 14 | *.userprefs 15 | 16 | # Mono auto generated files 17 | mono_crash.* 18 | 19 | # Build results 20 | [Dd]ebug/ 21 | [Dd]ebugPublic/ 22 | [Rr]elease/ 23 | [Rr]eleases/ 24 | x64/ 25 | x86/ 26 | [Ww][Ii][Nn]32/ 27 | [Aa][Rr][Mm]/ 28 | [Aa][Rr][Mm]64/ 29 | bld/ 30 | [Bb]in/ 31 | [Oo]bj/ 32 | [Ll]og/ 33 | [Ll]ogs/ 34 | 35 | # Visual Studio 2015/2017 cache/options directory 36 | .vs/ 37 | # Uncomment if you have tasks that create the project's static files in wwwroot 38 | #wwwroot/ 39 | 40 | # Visual Studio 2017 auto generated files 41 | Generated\ Files/ 42 | 43 | # MSTest test Results 44 | [Tt]est[Rr]esult*/ 45 | [Bb]uild[Ll]og.* 46 | 47 | # NUnit 48 | *.VisualState.xml 49 | TestResult.xml 50 | nunit-*.xml 51 | 52 | # Build Results of an ATL Project 53 | [Dd]ebugPS/ 54 | [Rr]eleasePS/ 55 | dlldata.c 56 | 57 | # Benchmark Results 58 | BenchmarkDotNet.Artifacts/ 59 | 60 | # .NET Core 61 | project.lock.json 62 | project.fragment.lock.json 63 | artifacts/ 64 | 65 | # ASP.NET Scaffolding 66 | ScaffoldingReadMe.txt 67 | 68 | # StyleCop 69 | StyleCopReport.xml 70 | 71 | # Files built by Visual Studio 72 | *_i.c 73 | *_p.c 74 | *_h.h 75 | *.ilk 76 | *.meta 77 | *.obj 78 | *.iobj 79 | *.pch 80 | *.pdb 81 | *.ipdb 82 | *.pgc 83 | *.pgd 84 | *.rsp 85 | *.sbr 86 | *.tlb 87 | *.tli 88 | *.tlh 89 | *.tmp 90 | *.tmp_proj 91 | *_wpftmp.csproj 92 | *.log 93 | *.tlog 94 | *.vspscc 95 | *.vssscc 96 | .builds 97 | *.pidb 98 | *.svclog 99 | *.scc 100 | 101 | # Chutzpah Test files 102 | _Chutzpah* 103 | 104 | # Visual C++ cache files 105 | ipch/ 106 | *.aps 107 | *.ncb 108 | *.opendb 109 | *.opensdf 110 | *.sdf 111 | *.cachefile 112 | *.VC.db 113 | *.VC.VC.opendb 114 | 115 | # Visual Studio profiler 116 | *.psess 117 | *.vsp 118 | *.vspx 119 | *.sap 120 | 121 | # Visual Studio Trace Files 122 | *.e2e 123 | 124 | # TFS 2012 Local Workspace 125 | $tf/ 126 | 127 | # Guidance Automation Toolkit 128 | *.gpState 129 | 130 | # ReSharper is a .NET coding add-in 131 | _ReSharper*/ 132 | *.[Rr]e[Ss]harper 133 | *.DotSettings.user 134 | 135 | # TeamCity is a build add-in 136 | _TeamCity* 137 | 138 | # DotCover is a Code Coverage Tool 139 | *.dotCover 140 | 141 | # AxoCover is a Code Coverage Tool 142 | .axoCover/* 143 | !.axoCover/settings.json 144 | 145 | # Coverlet is a free, cross platform Code Coverage Tool 146 | coverage*.json 147 | coverage*.xml 148 | coverage*.info 149 | 150 | # Visual Studio code coverage results 151 | *.coverage 152 | *.coveragexml 153 | 154 | # NCrunch 155 | _NCrunch_* 156 | .*crunch*.local.xml 157 | nCrunchTemp_* 158 | 159 | # MightyMoose 160 | *.mm.* 161 | AutoTest.Net/ 162 | 163 | # Web workbench (sass) 164 | .sass-cache/ 165 | 166 | # Installshield output folder 167 | [Ee]xpress/ 168 | 169 | # DocProject is a documentation generator add-in 170 | DocProject/buildhelp/ 171 | DocProject/Help/*.HxT 172 | DocProject/Help/*.HxC 173 | DocProject/Help/*.hhc 174 | DocProject/Help/*.hhk 175 | DocProject/Help/*.hhp 176 | DocProject/Help/Html2 177 | DocProject/Help/html 178 | 179 | # Click-Once directory 180 | publish/ 181 | 182 | # Publish Web Output 183 | *.[Pp]ublish.xml 184 | *.azurePubxml 185 | # Note: Comment the next line if you want to checkin your web deploy settings, 186 | # but database connection strings (with potential passwords) will be unencrypted 187 | *.pubxml 188 | *.publishproj 189 | 190 | # Microsoft Azure Web App publish settings. Comment the next line if you want to 191 | # checkin your Azure Web App publish settings, but sensitive information contained 192 | # in these scripts will be unencrypted 193 | PublishScripts/ 194 | 195 | # NuGet Packages 196 | *.nupkg 197 | # NuGet Symbol Packages 198 | *.snupkg 199 | # The packages folder can be ignored because of Package Restore 200 | **/[Pp]ackages/* 201 | # except build/, which is used as an MSBuild target. 202 | !**/[Pp]ackages/build/ 203 | # Uncomment if necessary however generally it will be regenerated when needed 204 | #!**/[Pp]ackages/repositories.config 205 | # NuGet v3's project.json files produces more ignorable files 206 | *.nuget.props 207 | *.nuget.targets 208 | 209 | # Microsoft Azure Build Output 210 | csx/ 211 | *.build.csdef 212 | 213 | # Microsoft Azure Emulator 214 | ecf/ 215 | rcf/ 216 | 217 | # Windows Store app package directories and files 218 | AppPackages/ 219 | BundleArtifacts/ 220 | Package.StoreAssociation.xml 221 | _pkginfo.txt 222 | *.appx 223 | *.appxbundle 224 | *.appxupload 225 | 226 | # Visual Studio cache files 227 | # files ending in .cache can be ignored 228 | *.[Cc]ache 229 | # but keep track of directories ending in .cache 230 | !?*.[Cc]ache/ 231 | 232 | # Others 233 | ClientBin/ 234 | ~$* 235 | *~ 236 | *.dbmdl 237 | *.dbproj.schemaview 238 | *.jfm 239 | *.pfx 240 | *.publishsettings 241 | orleans.codegen.cs 242 | 243 | # Including strong name files can present a security risk 244 | # (https://github.com/github/gitignore/pull/2483#issue-259490424) 245 | #*.snk 246 | 247 | # Since there are multiple workflows, uncomment next line to ignore bower_components 248 | # (https://github.com/github/gitignore/pull/1529#issuecomment-104372622) 249 | #bower_components/ 250 | 251 | # RIA/Silverlight projects 252 | Generated_Code/ 253 | 254 | # Backup & report files from converting an old project file 255 | # to a newer Visual Studio version. Backup files are not needed, 256 | # because we have git ;-) 257 | _UpgradeReport_Files/ 258 | Backup*/ 259 | UpgradeLog*.XML 260 | UpgradeLog*.htm 261 | ServiceFabricBackup/ 262 | *.rptproj.bak 263 | 264 | # SQL Server files 265 | *.mdf 266 | *.ldf 267 | *.ndf 268 | 269 | # Business Intelligence projects 270 | *.rdl.data 271 | *.bim.layout 272 | *.bim_*.settings 273 | *.rptproj.rsuser 274 | *- [Bb]ackup.rdl 275 | *- [Bb]ackup ([0-9]).rdl 276 | *- [Bb]ackup ([0-9][0-9]).rdl 277 | 278 | # Microsoft Fakes 279 | FakesAssemblies/ 280 | 281 | # GhostDoc plugin setting file 282 | *.GhostDoc.xml 283 | 284 | # Node.js Tools for Visual Studio 285 | .ntvs_analysis.dat 286 | node_modules/ 287 | 288 | # Visual Studio 6 build log 289 | *.plg 290 | 291 | # Visual Studio 6 workspace options file 292 | *.opt 293 | 294 | # Visual Studio 6 auto-generated workspace file (contains which files were open etc.) 295 | *.vbw 296 | 297 | # Visual Studio 6 auto-generated project file (contains which files were open etc.) 298 | *.vbp 299 | 300 | # Visual Studio 6 workspace and project file (working project files containing files to include in project) 301 | *.dsw 302 | *.dsp 303 | 304 | # Visual Studio 6 technical files 305 | *.ncb 306 | *.aps 307 | 308 | # Visual Studio LightSwitch build output 309 | **/*.HTMLClient/GeneratedArtifacts 310 | **/*.DesktopClient/GeneratedArtifacts 311 | **/*.DesktopClient/ModelManifest.xml 312 | **/*.Server/GeneratedArtifacts 313 | **/*.Server/ModelManifest.xml 314 | _Pvt_Extensions 315 | 316 | # Paket dependency manager 317 | .paket/paket.exe 318 | paket-files/ 319 | 320 | # FAKE - F# Make 321 | .fake/ 322 | 323 | # CodeRush personal settings 324 | .cr/personal 325 | 326 | # Python Tools for Visual Studio (PTVS) 327 | __pycache__/ 328 | *.pyc 329 | 330 | # Cake - Uncomment if you are using it 331 | # tools/** 332 | # !tools/packages.config 333 | 334 | # Tabs Studio 335 | *.tss 336 | 337 | # Telerik's JustMock configuration file 338 | *.jmconfig 339 | 340 | # BizTalk build output 341 | *.btp.cs 342 | *.btm.cs 343 | *.odx.cs 344 | *.xsd.cs 345 | 346 | # OpenCover UI analysis results 347 | OpenCover/ 348 | 349 | # Azure Stream Analytics local run output 350 | ASALocalRun/ 351 | 352 | # MSBuild Binary and Structured Log 353 | *.binlog 354 | 355 | # NVidia Nsight GPU debugger configuration file 356 | *.nvuser 357 | 358 | # MFractors (Xamarin productivity tool) working folder 359 | .mfractor/ 360 | 361 | # Local History for Visual Studio 362 | .localhistory/ 363 | 364 | # Visual Studio History (VSHistory) files 365 | .vshistory/ 366 | 367 | # BeatPulse healthcheck temp database 368 | healthchecksdb 369 | 370 | # Backup folder for Package Reference Convert tool in Visual Studio 2017 371 | MigrationBackup/ 372 | 373 | # Ionide (cross platform F# VS Code tools) working folder 374 | .ionide/ 375 | 376 | # Fody - auto-generated XML schema 377 | FodyWeavers.xsd 378 | 379 | # VS Code files for those working on multiple tools 380 | .vscode/* 381 | !.vscode/settings.json 382 | !.vscode/tasks.json 383 | !.vscode/launch.json 384 | !.vscode/extensions.json 385 | *.code-workspace 386 | 387 | # Local History for Visual Studio Code 388 | .history/ 389 | 390 | # Windows Installer files from build outputs 391 | *.cab 392 | *.msi 393 | *.msix 394 | *.msm 395 | *.msp 396 | 397 | # JetBrains Rider 398 | *.sln.iml -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 TheDevTalkShow 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # BlazorAuthFromScratch 2 | A repository chronicling adding authentication/authorization to a project from scratch 3 | -------------------------------------------------------------------------------- /src/GraphApiLibrary/GraphApiLibrary.csproj: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | net9.0 5 | enable 6 | enable 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /src/GraphApiLibrary/GraphApiUserService.cs: -------------------------------------------------------------------------------- 1 | using System.Net.Http.Headers; 2 | 3 | namespace GraphApiLibrary 4 | { 5 | public class GraphApiUserService 6 | { 7 | private readonly HttpClient _httpClient; 8 | private readonly string _accessToken; 9 | 10 | public GraphApiUserService(HttpClient httpClient, string accessToken) 11 | { 12 | _httpClient = httpClient; 13 | _accessToken = accessToken; 14 | } 15 | 16 | public async Task GetUserPhoto() 17 | { 18 | var request = new HttpRequestMessage(HttpMethod.Get, "https://graph.microsoft.com/v1.0/me/photo/$value"); 19 | request.Headers.Authorization = new AuthenticationHeaderValue("Bearer", _accessToken); 20 | 21 | var response = await _httpClient.SendAsync(request); 22 | if (response.IsSuccessStatusCode) 23 | { 24 | var photoBytes = await response.Content.ReadAsByteArrayAsync(); 25 | return Convert.ToBase64String(photoBytes); 26 | } 27 | return null; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/Server/BlazorAuthFromScratch.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | net9.0 5 | enable 6 | enable 7 | 77162421-ccda-4d88-8f38-b2d3856e62d0 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /src/Server/BlazorAuthFromScratch.sln: -------------------------------------------------------------------------------- 1 |  2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio Version 17 4 | VisualStudioVersion = 17.10.34916.146 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "BlazorAuthFromScratch", "BlazorAuthFromScratch.csproj", "{ABD3BD13-950C-4C34-BFCF-8249B92F7F9F}" 7 | EndProject 8 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "GraphApiLibrary", "..\GraphApiLibrary\GraphApiLibrary.csproj", "{C5E2084D-9E6F-4CAD-8757-DB89CBC7F105}" 9 | EndProject 10 | Global 11 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 12 | Debug|Any CPU = Debug|Any CPU 13 | Release|Any CPU = Release|Any CPU 14 | EndGlobalSection 15 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 16 | {ABD3BD13-950C-4C34-BFCF-8249B92F7F9F}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 17 | {ABD3BD13-950C-4C34-BFCF-8249B92F7F9F}.Debug|Any CPU.Build.0 = Debug|Any CPU 18 | {ABD3BD13-950C-4C34-BFCF-8249B92F7F9F}.Release|Any CPU.ActiveCfg = Release|Any CPU 19 | {ABD3BD13-950C-4C34-BFCF-8249B92F7F9F}.Release|Any CPU.Build.0 = Release|Any CPU 20 | {C5E2084D-9E6F-4CAD-8757-DB89CBC7F105}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 21 | {C5E2084D-9E6F-4CAD-8757-DB89CBC7F105}.Debug|Any CPU.Build.0 = Debug|Any CPU 22 | {C5E2084D-9E6F-4CAD-8757-DB89CBC7F105}.Release|Any CPU.ActiveCfg = Release|Any CPU 23 | {C5E2084D-9E6F-4CAD-8757-DB89CBC7F105}.Release|Any CPU.Build.0 = Release|Any CPU 24 | EndGlobalSection 25 | GlobalSection(SolutionProperties) = preSolution 26 | HideSolutionNode = FALSE 27 | EndGlobalSection 28 | GlobalSection(ExtensibilityGlobals) = postSolution 29 | SolutionGuid = {2E42199C-60D7-416E-A0DA-628C735AE54C} 30 | EndGlobalSection 31 | EndGlobal 32 | -------------------------------------------------------------------------------- /src/Server/Components/Account/IdentityEndpointExtensions.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.AspNetCore.Authentication; 2 | using Microsoft.AspNetCore.Identity; 3 | using Microsoft.AspNetCore.Mvc; 4 | using System.Security.Claims; 5 | 6 | namespace Microsoft.AspNetCore.Routing; 7 | 8 | internal static class IdentityEndpointExtensions 9 | { 10 | public static IEndpointConventionBuilder MapIdentityEndpoints(this IEndpointRouteBuilder endpoints) 11 | { 12 | ArgumentNullException.ThrowIfNull(endpoints); 13 | 14 | var accountGroup = endpoints.MapGroup("/Account"); 15 | 16 | accountGroup.MapGet("/Logout", async (HttpContext context) => 17 | { 18 | await context.SignOutAsync("TdtsCookie"); 19 | return TypedResults.LocalRedirect($"/"); 20 | }); 21 | 22 | accountGroup.MapPost("/PerformGoogleLogin", async ( 23 | HttpContext context, 24 | [FromForm] string returnUrl 25 | ) => 26 | { 27 | // a more generic implementation would pass the provider as well but we know it's Google here 28 | string provider = "Google"; 29 | 30 | var properties = new AuthenticationProperties { RedirectUri = returnUrl }; 31 | 32 | // Sign out any existing user 33 | await context.SignOutAsync("TdtsCookie"); 34 | 35 | return TypedResults.Challenge(properties, [provider]); 36 | }); 37 | 38 | accountGroup.MapPost("/PerformMicrosoftLogin", async ( 39 | HttpContext context, 40 | [FromForm] string returnUrl 41 | ) => 42 | { 43 | // a more generic implementation would pass the provider as well but we know it's Google here 44 | string provider = "Microsoft"; 45 | 46 | var properties = new AuthenticationProperties { RedirectUri = returnUrl }; 47 | 48 | // Sign out any existing user 49 | await context.SignOutAsync("TdtsCookie"); 50 | 51 | return TypedResults.Challenge(properties, [provider]); 52 | }); 53 | 54 | return accountGroup; 55 | } 56 | } 57 | 58 | -------------------------------------------------------------------------------- /src/Server/Components/App.razor: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | -------------------------------------------------------------------------------- /src/Server/Components/GoogleExternalLogin.razor: -------------------------------------------------------------------------------- 1 | @using System.Security.Claims 2 | @using Microsoft.AspNetCore.Authentication 3 | 4 | @inject NavigationManager NavigationManager 5 | 6 |

Google External Login

7 | 8 |
9 | You can log in using your Google account.
10 |
11 | 12 | 13 | 14 | 15 |
16 | -------------------------------------------------------------------------------- /src/Server/Components/Layout/MainLayout.razor: -------------------------------------------------------------------------------- 1 | @inherits LayoutComponentBase 2 | 3 |
4 | 7 | 8 |
9 |
10 | About 11 |
12 | 13 |
14 | @Body 15 |
16 |
17 |
18 | -------------------------------------------------------------------------------- /src/Server/Components/Layout/MainLayout.razor.css: -------------------------------------------------------------------------------- 1 | .page { 2 | position: relative; 3 | display: flex; 4 | flex-direction: column; 5 | } 6 | 7 | main { 8 | flex: 1; 9 | } 10 | 11 | .sidebar { 12 | background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%); 13 | } 14 | 15 | .top-row { 16 | background-color: #f7f7f7; 17 | border-bottom: 1px solid #d6d5d5; 18 | justify-content: flex-end; 19 | height: 3.5rem; 20 | display: flex; 21 | align-items: center; 22 | } 23 | 24 | .top-row ::deep a, .top-row ::deep .btn-link { 25 | white-space: nowrap; 26 | margin-left: 1.5rem; 27 | text-decoration: none; 28 | } 29 | 30 | .top-row ::deep a:hover, .top-row ::deep .btn-link:hover { 31 | text-decoration: underline; 32 | } 33 | 34 | .top-row ::deep a:first-child { 35 | overflow: hidden; 36 | text-overflow: ellipsis; 37 | } 38 | 39 | @media (max-width: 640.98px) { 40 | .top-row { 41 | justify-content: space-between; 42 | } 43 | 44 | .top-row ::deep a, .top-row ::deep .btn-link { 45 | margin-left: 0; 46 | } 47 | } 48 | 49 | @media (min-width: 641px) { 50 | .page { 51 | flex-direction: row; 52 | } 53 | 54 | .sidebar { 55 | width: 250px; 56 | height: 100vh; 57 | position: sticky; 58 | top: 0; 59 | } 60 | 61 | .top-row { 62 | position: sticky; 63 | top: 0; 64 | z-index: 1; 65 | } 66 | 67 | .top-row.auth ::deep a:first-child { 68 | flex: 1; 69 | text-align: right; 70 | width: 0; 71 | } 72 | 73 | .top-row, article { 74 | padding-left: 2rem !important; 75 | padding-right: 1.5rem !important; 76 | } 77 | } 78 | 79 | #blazor-error-ui { 80 | background: lightyellow; 81 | bottom: 0; 82 | box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); 83 | display: none; 84 | left: 0; 85 | padding: 0.6rem 1.25rem 0.7rem 1.25rem; 86 | position: fixed; 87 | width: 100%; 88 | z-index: 1000; 89 | } 90 | 91 | #blazor-error-ui .dismiss { 92 | cursor: pointer; 93 | position: absolute; 94 | right: 0.75rem; 95 | top: 0.5rem; 96 | } 97 | -------------------------------------------------------------------------------- /src/Server/Components/Layout/NavMenu.razor: -------------------------------------------------------------------------------- 1 |  6 | 7 | 8 | 9 | 24 | 25 | -------------------------------------------------------------------------------- /src/Server/Components/Layout/NavMenu.razor.css: -------------------------------------------------------------------------------- 1 | .navbar-toggler { 2 | appearance: none; 3 | cursor: pointer; 4 | width: 3.5rem; 5 | height: 2.5rem; 6 | color: white; 7 | position: absolute; 8 | top: 0.5rem; 9 | right: 1rem; 10 | border: 1px solid rgba(255, 255, 255, 0.1); 11 | background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1); 12 | } 13 | 14 | .navbar-toggler:checked { 15 | background-color: rgba(255, 255, 255, 0.5); 16 | } 17 | 18 | .top-row { 19 | height: 3.5rem; 20 | background-color: rgba(0,0,0,0.4); 21 | } 22 | 23 | .navbar-brand { 24 | font-size: 1.1rem; 25 | } 26 | 27 | .bi { 28 | display: inline-block; 29 | position: relative; 30 | width: 1.25rem; 31 | height: 1.25rem; 32 | margin-right: 0.75rem; 33 | top: -1px; 34 | background-size: cover; 35 | } 36 | 37 | .bi-house-door-fill-nav-menu { 38 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); 39 | } 40 | 41 | .bi-plus-square-fill-nav-menu { 42 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); 43 | } 44 | 45 | .bi-list-nested-nav-menu { 46 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); 47 | } 48 | 49 | .nav-item { 50 | font-size: 0.9rem; 51 | padding-bottom: 0.5rem; 52 | } 53 | 54 | .nav-item:first-of-type { 55 | padding-top: 1rem; 56 | } 57 | 58 | .nav-item:last-of-type { 59 | padding-bottom: 1rem; 60 | } 61 | 62 | .nav-item ::deep .nav-link { 63 | color: #d7d7d7; 64 | background: none; 65 | border: none; 66 | border-radius: 4px; 67 | height: 3rem; 68 | display: flex; 69 | align-items: center; 70 | line-height: 3rem; 71 | width: 100%; 72 | } 73 | 74 | .nav-item ::deep a.active { 75 | background-color: rgba(255,255,255,0.37); 76 | color: white; 77 | } 78 | 79 | .nav-item ::deep .nav-link:hover { 80 | background-color: rgba(255,255,255,0.1); 81 | color: white; 82 | } 83 | 84 | .nav-scrollable { 85 | display: none; 86 | } 87 | 88 | .navbar-toggler:checked ~ .nav-scrollable { 89 | display: block; 90 | } 91 | 92 | @media (min-width: 641px) { 93 | .navbar-toggler { 94 | display: none; 95 | } 96 | 97 | .nav-scrollable { 98 | /* Never collapse the sidebar for wide screens */ 99 | display: block; 100 | 101 | /* Allow sidebar to scroll for tall menus */ 102 | height: calc(100vh - 3.5rem); 103 | overflow-y: auto; 104 | } 105 | } 106 | -------------------------------------------------------------------------------- /src/Server/Components/MicrosoftExternalLogin.razor: -------------------------------------------------------------------------------- 1 | @using System.Security.Claims 2 | @using Microsoft.AspNetCore.Authentication 3 | 4 | @inject NavigationManager NavigationManager 5 | 6 |

Microsoft External Login

7 | 8 |

The current Uri is: @NavigationManager.Uri

9 | 10 |
11 | You can log in using your Microsoft account.
12 |
13 | 14 | 15 | 16 | 17 |
-------------------------------------------------------------------------------- /src/Server/Components/MyOwnLogin.razor: -------------------------------------------------------------------------------- 1 | @using System.Security.Claims 2 | @using Microsoft.AspNetCore.Authentication 3 | @inject NavigationManager NavigationManager 4 |

MyOwnLogin

5 |

MyOwnLogin component is not a production-ready sample. 6 | It was a demonstration of creating a ClaimsPrincipal and using SignInAsync() to start the simplest possible cookie based login session.

7 | 8 | 9 | Name:
10 | 11 |
12 | 13 | @code { 14 | [SupplyParameterFromForm] 15 | public Credential? Model { get; set; } 16 | 17 | [CascadingParameter] 18 | private HttpContext HttpContext { get; set; } = default!; 19 | 20 | protected override void OnInitialized() 21 | { 22 | Model ??= new(); 23 | } 24 | 25 | private void Submit() 26 | { 27 | if (Model is not null) 28 | { 29 | Console.WriteLine($"User Name: {Model.Name}"); 30 | // Create security context 31 | var claims = new List 32 | { 33 | new Claim(ClaimTypes.Name, Model.Name!), 34 | }; 35 | 36 | var identity = new ClaimsIdentity(claims, "TdtsCookie"); 37 | var claimsPrincipal = new ClaimsPrincipal(identity); 38 | 39 | HttpContext.SignInAsync("TdtsCookie", claimsPrincipal); 40 | 41 | NavigationManager.NavigateTo("/"); 42 | } 43 | } 44 | 45 | public class Credential 46 | { 47 | public string? Name { get; set; } 48 | 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /src/Server/Components/MyOwnLogout.razor: -------------------------------------------------------------------------------- 1 | @using Microsoft.AspNetCore.Authentication 2 |

MyOwnLogout

3 | 4 | Logout 5 | 6 | @code { 7 | [CascadingParameter] 8 | private HttpContext HttpContext { get; set; } = default!; 9 | } 10 | -------------------------------------------------------------------------------- /src/Server/Components/Pages/Error.razor: -------------------------------------------------------------------------------- 1 | @page "/Error" 2 | @using System.Diagnostics 3 | 4 | Error 5 | 6 |

Error.

7 |

An error occurred while processing your request.

8 | 9 | @if (ShowRequestId) 10 | { 11 |

12 | Request ID: @RequestId 13 |

14 | } 15 | 16 |

Development Mode

17 |

18 | Swapping to Development environment will display more detailed information about the error that occurred. 19 |

20 |

21 | The Development environment shouldn't be enabled for deployed applications. 22 | It can result in displaying sensitive information from exceptions to end users. 23 | For local debugging, enable the Development environment by setting the ASPNETCORE_ENVIRONMENT environment variable to Development 24 | and restarting the app. 25 |

26 | 27 | @code{ 28 | [CascadingParameter] 29 | private HttpContext? HttpContext { get; set; } 30 | 31 | private string? RequestId { get; set; } 32 | private bool ShowRequestId => !string.IsNullOrEmpty(RequestId); 33 | 34 | protected override void OnInitialized() => 35 | RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier; 36 | } 37 | -------------------------------------------------------------------------------- /src/Server/Components/Pages/Home.razor: -------------------------------------------------------------------------------- 1 | @page "/" 2 | @using Microsoft.AspNetCore.Authentication 3 | @using Microsoft.AspNetCore.Components.Authorization 4 | @using System.Security.Claims 5 | 6 | Home 7 | 8 |

Hello, world!

9 | 10 | Welcome to your new app. 11 | 12 | 13 | 14 | 15 |

You are authorized.

16 |

You are logged in as: @context?.User.Identity?.Name

17 | 18 | @if (context?.User.Claims.FirstOrDefault(c => c.Type == "urn:google:picture") is not null) 19 | { 20 |

Google Account Picture: Profile Picture

21 | } 22 | 23 | @if (context?.User.Claims.FirstOrDefault(c => c.Type == "urn:microsoft:picture") is not null) 24 | { 25 |

Microsoft Account Picture: Profile Picture

26 | } 27 | 28 |

User Claims

29 |
    30 | @foreach (var claim in context.User.Claims) 31 | { 32 |
  • @claim.Type: @claim.Value
  • 33 | } 34 |
35 | 36 | 37 |
38 | 39 |

You are not authorized.

40 | 41 |

42 | 43 | 44 |
45 |
-------------------------------------------------------------------------------- /src/Server/Components/Pages/Weather.razor: -------------------------------------------------------------------------------- 1 | @page "/weather" 2 | @attribute [StreamRendering] 3 | 4 | Weather 5 | 6 |

Weather

7 | 8 |

This component demonstrates showing data.

9 | 10 | @if (forecasts == null) 11 | { 12 |

Loading...

13 | } 14 | else 15 | { 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | @foreach (var forecast in forecasts) 27 | { 28 | 29 | 30 | 31 | 32 | 33 | 34 | } 35 | 36 |
DateTemp. (C)Temp. (F)Summary
@forecast.Date.ToShortDateString()@forecast.TemperatureC@forecast.TemperatureF@forecast.Summary
37 | } 38 | 39 | @code { 40 | private WeatherForecast[]? forecasts; 41 | 42 | protected override async Task OnInitializedAsync() 43 | { 44 | // Simulate asynchronous loading to demonstrate streaming rendering 45 | await Task.Delay(500); 46 | 47 | var startDate = DateOnly.FromDateTime(DateTime.Now); 48 | var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" }; 49 | forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast 50 | { 51 | Date = startDate.AddDays(index), 52 | TemperatureC = Random.Shared.Next(-20, 55), 53 | Summary = summaries[Random.Shared.Next(summaries.Length)] 54 | }).ToArray(); 55 | } 56 | 57 | private class WeatherForecast 58 | { 59 | public DateOnly Date { get; set; } 60 | public int TemperatureC { get; set; } 61 | public string? Summary { get; set; } 62 | public int TemperatureF => 32 + (int)(TemperatureC / 0.5556); 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /src/Server/Components/Routes.razor: -------------------------------------------------------------------------------- 1 | @using Microsoft.AspNetCore.Components.Authorization 2 | 3 | 4 | 5 | 6 |

Sorry, you're not authorized to view this page.

7 |
8 |
9 | 10 |
11 |
12 | -------------------------------------------------------------------------------- /src/Server/Components/_Imports.razor: -------------------------------------------------------------------------------- 1 | @using System.Net.Http 2 | @using System.Net.Http.Json 3 | @using Microsoft.AspNetCore.Components.Forms 4 | @using Microsoft.AspNetCore.Components.Routing 5 | @using Microsoft.AspNetCore.Components.Web 6 | @using static Microsoft.AspNetCore.Components.Web.RenderMode 7 | @using Microsoft.AspNetCore.Components.Web.Virtualization 8 | @using Microsoft.JSInterop 9 | @using BlazorAuthFromScratch 10 | @using BlazorAuthFromScratch.Components 11 | -------------------------------------------------------------------------------- /src/Server/Program.cs: -------------------------------------------------------------------------------- 1 | using BlazorAuthFromScratch.Components; 2 | using BlazorAuthFromScratch.Services; 3 | using GraphApiLibrary; 4 | using Microsoft.AspNetCore.Authentication; 5 | using Microsoft.AspNetCore.Components.Authorization; 6 | using Microsoft.AspNetCore.Components.Server; 7 | using System.Net.Http.Headers; 8 | using System.Security.Claims; 9 | using System.Text.Json; 10 | 11 | var builder = WebApplication.CreateBuilder(args); 12 | 13 | // Add services to the container. 14 | builder.Services.AddRazorComponents(); 15 | 16 | builder.Services.AddScoped(); 17 | 18 | builder.Services.AddAuthorization(); 19 | builder.Services.AddAuthentication("TdtsCookie") 20 | .AddCookie("TdtsCookie") 21 | .AddGoogle(options => 22 | { 23 | options.ClientId = builder.Configuration["Authentication:Google:ClientId"]!; 24 | options.ClientSecret = builder.Configuration["Authentication:Google:ClientSecret"]!; 25 | options.ClaimActions.MapJsonKey("urn:google:picture", "picture", "url"); 26 | }) 27 | .AddMicrosoftAccount(options => 28 | { 29 | options.ClientId = builder.Configuration["Authentication:Microsoft:ClientId"]!; 30 | options.ClientSecret = builder.Configuration["Authentication:Microsoft:ClientSecret"]!; 31 | options.TokenEndpoint = builder.Configuration["Authentication:Microsoft:TokenEndpoint"]!; 32 | options.AuthorizationEndpoint = builder.Configuration["Authentication:Microsoft:AuthorizationEndpoint"]!; 33 | options.Events.OnCreatingTicket = async context => 34 | { 35 | var something = new GraphApiUserService(context.Backchannel, context.AccessToken!); 36 | string? photoBase64 = await something.GetUserPhoto(); 37 | 38 | if (string.IsNullOrEmpty(photoBase64) == false) 39 | { 40 | context.Identity!.AddClaim(new Claim("urn:microsoft:picture", photoBase64)); 41 | } 42 | }; 43 | }); 44 | 45 | builder.Services.AddTransient(); 46 | 47 | var app = builder.Build(); 48 | 49 | // Configure the HTTP request pipeline. 50 | if (!app.Environment.IsDevelopment()) 51 | { 52 | app.UseExceptionHandler("/Error", createScopeForErrors: true); 53 | // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts. 54 | app.UseHsts(); 55 | } 56 | 57 | app.UseHttpsRedirection(); 58 | 59 | app.UseStaticFiles(); 60 | app.UseAntiforgery(); 61 | 62 | app.MapRazorComponents(); 63 | app.MapIdentityEndpoints(); 64 | 65 | app.Run(); 66 | -------------------------------------------------------------------------------- /src/Server/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "http://json.schemastore.org/launchsettings.json", 3 | "iisSettings": { 4 | "windowsAuthentication": false, 5 | "anonymousAuthentication": true, 6 | "iisExpress": { 7 | "applicationUrl": "http://localhost:19589", 8 | "sslPort": 44365 9 | } 10 | }, 11 | "profiles": { 12 | "http": { 13 | "commandName": "Project", 14 | "dotnetRunMessages": true, 15 | "launchBrowser": true, 16 | "applicationUrl": "http://localhost:5115", 17 | "environmentVariables": { 18 | "ASPNETCORE_ENVIRONMENT": "Development" 19 | } 20 | }, 21 | "https": { 22 | "commandName": "Project", 23 | "dotnetRunMessages": true, 24 | "launchBrowser": true, 25 | "applicationUrl": "https://localhost:7130;http://localhost:5115", 26 | "environmentVariables": { 27 | "ASPNETCORE_ENVIRONMENT": "Development" 28 | } 29 | }, 30 | "IIS Express": { 31 | "commandName": "IISExpress", 32 | "launchBrowser": true, 33 | "environmentVariables": { 34 | "ASPNETCORE_ENVIRONMENT": "Development" 35 | } 36 | } 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /src/Server/Services/BlazorAuthFromScratchClaimsTransformation.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.AspNetCore.Authentication; 2 | using System.Security.Claims; 3 | 4 | namespace BlazorAuthFromScratch.Services 5 | { 6 | public class BlazorAuthFromScratchClaimsTransformation : IClaimsTransformation 7 | { 8 | public Task TransformAsync(ClaimsPrincipal principal) 9 | { 10 | if (principal?.Identity?.AuthenticationType == "Microsoft") 11 | { 12 | if (principal.HasClaim(claim => claim.Type == ClaimTypes.NameIdentifier)) 13 | { 14 | // theoretically we could use the graph api here to 15 | // get more information about the user, but we don't have 16 | // the user's access token, so we can't use delegated permissions 17 | // here. We could give the app permission to read profiles in the tenant 18 | // and look up by name identifier, but that might be considered more 19 | // privileged than necessary. 20 | } 21 | } 22 | 23 | // add new claims this way: 24 | 25 | //ClaimsIdentity claimsIdentity = new ClaimsIdentity(); 26 | //var claimType = "myNewClaim"; 27 | //if (!principal.HasClaim(claim => claim.Type == claimType)) 28 | //{ 29 | // claimsIdentity.AddClaim(new Claim(claimType, "myClaimValue")); 30 | //} 31 | 32 | //principal.AddIdentity(claimsIdentity); 33 | return Task.FromResult(principal!); 34 | } 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /src/Server/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft.AspNetCore": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/Server/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft.AspNetCore": "Warning" 6 | } 7 | }, 8 | "AllowedHosts": "*" 9 | } 10 | -------------------------------------------------------------------------------- /src/Server/wwwroot/app.css: -------------------------------------------------------------------------------- 1 | html, body { 2 | font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 3 | } 4 | 5 | a, .btn-link { 6 | color: #006bb7; 7 | } 8 | 9 | .btn-primary { 10 | color: #fff; 11 | background-color: #1b6ec2; 12 | border-color: #1861ac; 13 | } 14 | 15 | .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus { 16 | box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb; 17 | } 18 | 19 | .content { 20 | padding-top: 1.1rem; 21 | } 22 | 23 | h1:focus { 24 | outline: none; 25 | } 26 | 27 | .valid.modified:not([type=checkbox]) { 28 | outline: 1px solid #26b050; 29 | } 30 | 31 | .invalid { 32 | outline: 1px solid #e50000; 33 | } 34 | 35 | .validation-message { 36 | color: #e50000; 37 | } 38 | 39 | .blazor-error-boundary { 40 | background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121; 41 | padding: 1rem 1rem 1rem 3.7rem; 42 | color: white; 43 | } 44 | 45 | .blazor-error-boundary::after { 46 | content: "An error has occurred." 47 | } 48 | 49 | .darker-border-checkbox.form-check-input { 50 | border-color: #929292; 51 | } 52 | -------------------------------------------------------------------------------- /src/Server/wwwroot/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/thedevtalkshow/BlazorAuthFromScratch/f080f5a84502a139257fed387f9b9d4a61f253fa/src/Server/wwwroot/favicon.png -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.sln: -------------------------------------------------------------------------------- 1 |  2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio Version 17 4 | VisualStudioVersion = 17.10.34916.146 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "BlazorAuthFromScratchWasm", "BlazorAuthFromScratchWasm\BlazorAuthFromScratchWasm\BlazorAuthFromScratchWasm.csproj", "{AAD448A4-039E-4874-A654-805C1127C5C3}" 7 | EndProject 8 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "BlazorAuthFromScratchWasm.Client", "BlazorAuthFromScratchWasm\BlazorAuthFromScratchWasm.Client\BlazorAuthFromScratchWasm.Client.csproj", "{94C5E3AA-EC83-4039-A2EC-0C2C5E2D8F25}" 9 | EndProject 10 | Global 11 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 12 | Debug|Any CPU = Debug|Any CPU 13 | Release|Any CPU = Release|Any CPU 14 | EndGlobalSection 15 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 16 | {AAD448A4-039E-4874-A654-805C1127C5C3}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 17 | {AAD448A4-039E-4874-A654-805C1127C5C3}.Debug|Any CPU.Build.0 = Debug|Any CPU 18 | {AAD448A4-039E-4874-A654-805C1127C5C3}.Release|Any CPU.ActiveCfg = Release|Any CPU 19 | {AAD448A4-039E-4874-A654-805C1127C5C3}.Release|Any CPU.Build.0 = Release|Any CPU 20 | {94C5E3AA-EC83-4039-A2EC-0C2C5E2D8F25}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 21 | {94C5E3AA-EC83-4039-A2EC-0C2C5E2D8F25}.Debug|Any CPU.Build.0 = Debug|Any CPU 22 | {94C5E3AA-EC83-4039-A2EC-0C2C5E2D8F25}.Release|Any CPU.ActiveCfg = Release|Any CPU 23 | {94C5E3AA-EC83-4039-A2EC-0C2C5E2D8F25}.Release|Any CPU.Build.0 = Release|Any CPU 24 | EndGlobalSection 25 | GlobalSection(SolutionProperties) = preSolution 26 | HideSolutionNode = FALSE 27 | EndGlobalSection 28 | GlobalSection(ExtensibilityGlobals) = postSolution 29 | SolutionGuid = {F91D3479-B2C6-4275-879A-11DD415C1E20} 30 | EndGlobalSection 31 | EndGlobal 32 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/BlazorAuthFromScratchWasm.Client.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | net8.0 5 | enable 6 | enable 7 | true 8 | Default 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Layout/MainLayout.razor: -------------------------------------------------------------------------------- 1 | @inherits LayoutComponentBase 2 | 3 |
4 | 7 | 8 |
9 |
10 | About 11 |
12 | 13 |
14 | @Body 15 |
16 |
17 |
18 | 19 |
20 | An unhandled error has occurred. 21 | Reload 22 | 🗙 23 |
24 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Layout/MainLayout.razor.css: -------------------------------------------------------------------------------- 1 | .page { 2 | position: relative; 3 | display: flex; 4 | flex-direction: column; 5 | } 6 | 7 | main { 8 | flex: 1; 9 | } 10 | 11 | .sidebar { 12 | background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%); 13 | } 14 | 15 | .top-row { 16 | background-color: #f7f7f7; 17 | border-bottom: 1px solid #d6d5d5; 18 | justify-content: flex-end; 19 | height: 3.5rem; 20 | display: flex; 21 | align-items: center; 22 | } 23 | 24 | .top-row ::deep a, .top-row ::deep .btn-link { 25 | white-space: nowrap; 26 | margin-left: 1.5rem; 27 | text-decoration: none; 28 | } 29 | 30 | .top-row ::deep a:hover, .top-row ::deep .btn-link:hover { 31 | text-decoration: underline; 32 | } 33 | 34 | .top-row ::deep a:first-child { 35 | overflow: hidden; 36 | text-overflow: ellipsis; 37 | } 38 | 39 | @media (max-width: 640.98px) { 40 | .top-row { 41 | justify-content: space-between; 42 | } 43 | 44 | .top-row ::deep a, .top-row ::deep .btn-link { 45 | margin-left: 0; 46 | } 47 | } 48 | 49 | @media (min-width: 641px) { 50 | .page { 51 | flex-direction: row; 52 | } 53 | 54 | .sidebar { 55 | width: 250px; 56 | height: 100vh; 57 | position: sticky; 58 | top: 0; 59 | } 60 | 61 | .top-row { 62 | position: sticky; 63 | top: 0; 64 | z-index: 1; 65 | } 66 | 67 | .top-row.auth ::deep a:first-child { 68 | flex: 1; 69 | text-align: right; 70 | width: 0; 71 | } 72 | 73 | .top-row, article { 74 | padding-left: 2rem !important; 75 | padding-right: 1.5rem !important; 76 | } 77 | } 78 | 79 | #blazor-error-ui { 80 | background: lightyellow; 81 | bottom: 0; 82 | box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); 83 | display: none; 84 | left: 0; 85 | padding: 0.6rem 1.25rem 0.7rem 1.25rem; 86 | position: fixed; 87 | width: 100%; 88 | z-index: 1000; 89 | } 90 | 91 | #blazor-error-ui .dismiss { 92 | cursor: pointer; 93 | position: absolute; 94 | right: 0.75rem; 95 | top: 0.5rem; 96 | } 97 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Layout/NavMenu.razor: -------------------------------------------------------------------------------- 1 |  6 | 7 | 8 | 9 | 36 | 37 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Layout/NavMenu.razor.css: -------------------------------------------------------------------------------- 1 | .navbar-toggler { 2 | appearance: none; 3 | cursor: pointer; 4 | width: 3.5rem; 5 | height: 2.5rem; 6 | color: white; 7 | position: absolute; 8 | top: 0.5rem; 9 | right: 1rem; 10 | border: 1px solid rgba(255, 255, 255, 0.1); 11 | background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1); 12 | } 13 | 14 | .navbar-toggler:checked { 15 | background-color: rgba(255, 255, 255, 0.5); 16 | } 17 | 18 | .top-row { 19 | height: 3.5rem; 20 | background-color: rgba(0,0,0,0.4); 21 | } 22 | 23 | .navbar-brand { 24 | font-size: 1.1rem; 25 | } 26 | 27 | .bi { 28 | display: inline-block; 29 | position: relative; 30 | width: 1.25rem; 31 | height: 1.25rem; 32 | margin-right: 0.75rem; 33 | top: -1px; 34 | background-size: cover; 35 | } 36 | 37 | .bi-house-door-fill-nav-menu { 38 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E"); 39 | } 40 | 41 | .bi-plus-square-fill-nav-menu { 42 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E"); 43 | } 44 | 45 | .bi-list-nested-nav-menu { 46 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E"); 47 | } 48 | 49 | .nav-item { 50 | font-size: 0.9rem; 51 | padding-bottom: 0.5rem; 52 | } 53 | 54 | .nav-item:first-of-type { 55 | padding-top: 1rem; 56 | } 57 | 58 | .nav-item:last-of-type { 59 | padding-bottom: 1rem; 60 | } 61 | 62 | .nav-item ::deep .nav-link { 63 | color: #d7d7d7; 64 | background: none; 65 | border: none; 66 | border-radius: 4px; 67 | height: 3rem; 68 | display: flex; 69 | align-items: center; 70 | line-height: 3rem; 71 | width: 100%; 72 | } 73 | 74 | .nav-item ::deep a.active { 75 | background-color: rgba(255,255,255,0.37); 76 | color: white; 77 | } 78 | 79 | .nav-item ::deep .nav-link:hover { 80 | background-color: rgba(255,255,255,0.1); 81 | color: white; 82 | } 83 | 84 | .nav-scrollable { 85 | display: none; 86 | } 87 | 88 | .navbar-toggler:checked ~ .nav-scrollable { 89 | display: block; 90 | } 91 | 92 | @media (min-width: 641px) { 93 | .navbar-toggler { 94 | display: none; 95 | } 96 | 97 | .nav-scrollable { 98 | /* Never collapse the sidebar for wide screens */ 99 | display: block; 100 | 101 | /* Allow sidebar to scroll for tall menus */ 102 | height: calc(100vh - 3.5rem); 103 | overflow-y: auto; 104 | } 105 | } 106 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Pages/Counter.razor: -------------------------------------------------------------------------------- 1 | @page "/counter" 2 | 3 | Counter 4 | 5 |

Counter

6 | 7 |

Current count: @currentCount

8 | 9 | 10 | 11 | @code { 12 | private int currentCount = 0; 13 | 14 | private void IncrementCount() 15 | { 16 | currentCount++; 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Pages/Home.razor: -------------------------------------------------------------------------------- 1 | @page "/" 2 | 3 | Home 4 | 5 |

Hello, world!

6 | 7 | Welcome to your new app. 8 | 9 | 10 | 11 |

Hello, @context.User.Identity?.Name!

12 |
13 | 14 |

You're Not Signed In.

15 |
16 |
17 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Pages/Weather.razor: -------------------------------------------------------------------------------- 1 | @page "/weather" 2 | 3 | Weather 4 | 5 |

Weather

6 | 7 |

This component demonstrates showing data.

8 | 9 | @if (forecasts == null) 10 | { 11 |

Loading...

12 | } 13 | else 14 | { 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | @foreach (var forecast in forecasts) 26 | { 27 | 28 | 29 | 30 | 31 | 32 | 33 | } 34 | 35 |
DateTemp. (C)Temp. (F)Summary
@forecast.Date.ToShortDateString()@forecast.TemperatureC@forecast.TemperatureF@forecast.Summary
36 | } 37 | 38 | @code { 39 | private WeatherForecast[]? forecasts; 40 | 41 | protected override async Task OnInitializedAsync() 42 | { 43 | // Simulate asynchronous loading to demonstrate a loading indicator 44 | await Task.Delay(500); 45 | 46 | var startDate = DateOnly.FromDateTime(DateTime.Now); 47 | var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" }; 48 | forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast 49 | { 50 | Date = startDate.AddDays(index), 51 | TemperatureC = Random.Shared.Next(-20, 55), 52 | Summary = summaries[Random.Shared.Next(summaries.Length)] 53 | }).ToArray(); 54 | } 55 | 56 | private class WeatherForecast 57 | { 58 | public DateOnly Date { get; set; } 59 | public int TemperatureC { get; set; } 60 | public string? Summary { get; set; } 61 | public int TemperatureF => 32 + (int)(TemperatureC / 0.5556); 62 | } 63 | } 64 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/PersistentAuthenticationStateProvider.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.AspNetCore.Components; 2 | using Microsoft.AspNetCore.Components.Authorization; 3 | using System.Security.Claims; 4 | 5 | namespace BlazorAuthFromScratchWasm.Client 6 | { 7 | // This is a client-side AuthenticationStateProvider that determines the user's authentication state by 8 | // looking for data persisted in the page when it was rendered on the server. This authentication state will 9 | // be fixed for the lifetime of the WebAssembly application. So, if the user needs to log in or out, a full 10 | // page reload is required. 11 | // 12 | // This only provides a user name and email for display purposes. It does not actually include any tokens 13 | // that authenticate to the server when making subsequent requests. That works separately using a 14 | // cookie that will be included on HttpClient requests to the server. 15 | internal class PersistentAuthenticationStateProvider : AuthenticationStateProvider 16 | { 17 | private static readonly Task defaultUnauthenticatedTask = 18 | Task.FromResult(new AuthenticationState(new ClaimsPrincipal(new ClaimsIdentity()))); 19 | 20 | private readonly Task authenticationStateTask = defaultUnauthenticatedTask; 21 | 22 | public PersistentAuthenticationStateProvider(PersistentComponentState state) 23 | { 24 | if (!state.TryTakeFromJson(nameof(UserInfo), out var userInfo) || userInfo is null) 25 | { 26 | return; 27 | } 28 | 29 | Claim[] claims = [ 30 | new Claim(ClaimTypes.Name, userInfo.UserId) 31 | ]; 32 | 33 | authenticationStateTask = Task.FromResult( 34 | new AuthenticationState(new ClaimsPrincipal(new ClaimsIdentity(claims, 35 | authenticationType: nameof(PersistentAuthenticationStateProvider))))); 36 | } 37 | 38 | public override Task GetAuthenticationStateAsync() => authenticationStateTask; 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Program.cs: -------------------------------------------------------------------------------- 1 | using BlazorAuthFromScratchWasm.Client; 2 | using Microsoft.AspNetCore.Components.Authorization; 3 | using Microsoft.AspNetCore.Components.WebAssembly.Hosting; 4 | 5 | var builder = WebAssemblyHostBuilder.CreateDefault(args); 6 | 7 | builder.Services.AddAuthorizationCore(); 8 | builder.Services.AddSingleton(); 9 | 10 | await builder.Build().RunAsync(); 11 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/Routes.razor: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/UserInfo.cs: -------------------------------------------------------------------------------- 1 | namespace BlazorAuthFromScratchWasm.Client 2 | { 3 | // Add properties to this class and update the server and client AuthenticationStateProviders 4 | // to expose more information about the authenticated user to the client. 5 | public class UserInfo 6 | { 7 | public required string UserId { get; set; } 8 | } 9 | } 10 | 11 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/_Imports.razor: -------------------------------------------------------------------------------- 1 | @using System.Net.Http 2 | @using System.Net.Http.Json 3 | @using Microsoft.AspNetCore.Components.Authorization 4 | @using Microsoft.AspNetCore.Components.Forms 5 | @using Microsoft.AspNetCore.Components.Routing 6 | @using Microsoft.AspNetCore.Components.Web 7 | @using static Microsoft.AspNetCore.Components.Web.RenderMode 8 | @using Microsoft.AspNetCore.Components.Web.Virtualization 9 | @using Microsoft.JSInterop 10 | @using BlazorAuthFromScratchWasm.Client 11 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/wwwroot/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft.AspNetCore": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.Client/wwwroot/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft.AspNetCore": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm.csproj: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | net8.0 5 | enable 6 | enable 7 | 991d80e5-2d1a-4341-a1cb-e7cf3cfa4ea5 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | true 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Components/Account/IdentityEndpointExtensions.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.AspNetCore.Authentication; 2 | using Microsoft.AspNetCore.Mvc; 3 | 4 | namespace BlazorAuthFromScratchWasm.Components.Account 5 | { 6 | internal static class IdentityEndpointExtensions 7 | { 8 | public static IEndpointConventionBuilder MapIdentityEndpoints(this IEndpointRouteBuilder endpoints) 9 | { 10 | ArgumentNullException.ThrowIfNull(endpoints); 11 | 12 | var accountGroup = endpoints.MapGroup("/Account"); 13 | 14 | accountGroup.MapPost("/PerformMicrosoftLogin", async ( 15 | HttpContext context, 16 | [FromForm] string returnUrl 17 | ) => 18 | { 19 | // a more generic implementation would pass the provider as well but we know it's Microsoft here 20 | string provider = "Microsoft"; 21 | 22 | var properties = new AuthenticationProperties { RedirectUri = returnUrl }; 23 | 24 | // Sign out any existing user 25 | await context.SignOutAsync("TdtsCookie"); 26 | 27 | return TypedResults.Challenge(properties, [provider]); 28 | }); 29 | 30 | return accountGroup; 31 | } 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Components/Account/Login.razor: -------------------------------------------------------------------------------- 1 | @page "/account/login" 2 | @using System.Security.Claims 3 | @using Microsoft.AspNetCore.Authentication 4 | 5 | @inject NavigationManager navMgr 6 | 7 |

Login

8 | 9 | This will be the page to login. 10 |
11 | 12 |

Login

13 | 14 | 15 | 16 | 17 | 18 |

Microsoft Login

19 |
20 | You can log in using your Microsoft account.
21 |
22 | 23 | 24 | 25 | 26 |
27 | 28 | @code { 29 | [CascadingParameter] 30 | private HttpContext HttpContext { get; set; } = default!; 31 | 32 | [SupplyParameterFromForm] 33 | public Credential? MyFormModel { get; set; } 34 | 35 | protected override void OnInitialized() 36 | { 37 | MyFormModel ??= new(); 38 | 39 | Console.WriteLine("Login page initialized"); 40 | } 41 | 42 | private void Submit() 43 | { 44 | Console.WriteLine("Form Submitted"); 45 | 46 | if (MyFormModel is not null) 47 | { 48 | Console.WriteLine($"User Name: {MyFormModel.Name}"); 49 | // Create security context 50 | var claims = new List 51 | { 52 | new Claim(ClaimTypes.Name, MyFormModel.Name!), 53 | }; 54 | 55 | var identity = new ClaimsIdentity(claims, "TdtsCookie"); 56 | var claimsPrincipal = new ClaimsPrincipal(identity); 57 | 58 | HttpContext.SignInAsync("TdtsCookie", claimsPrincipal); 59 | } 60 | } 61 | 62 | public class Credential 63 | { 64 | public string? Name { get; set; } 65 | } 66 | } 67 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Components/Account/PersistingServerAuthenticationStateProvider.cs: -------------------------------------------------------------------------------- 1 | using BlazorAuthFromScratchWasm.Client; 2 | using Microsoft.AspNetCore.Components; 3 | using Microsoft.AspNetCore.Components.Authorization; 4 | using Microsoft.AspNetCore.Components.Server; 5 | using Microsoft.AspNetCore.Components.Web; 6 | using Microsoft.AspNetCore.Identity; 7 | using Microsoft.Extensions.Options; 8 | using System.Diagnostics; 9 | 10 | namespace BlazorAuthFromScratchWasm.Components.Account 11 | { 12 | // This is a server-side AuthenticationStateProvider that uses PersistentComponentState to flow the 13 | // authentication state to the client which is then fixed for the lifetime of the WebAssembly application. 14 | internal sealed class PersistingServerAuthenticationStateProvider : ServerAuthenticationStateProvider, IDisposable 15 | { 16 | private readonly PersistentComponentState state; 17 | private readonly IdentityOptions options; 18 | 19 | private readonly PersistingComponentStateSubscription subscription; 20 | 21 | private Task? authenticationStateTask; 22 | 23 | public PersistingServerAuthenticationStateProvider( 24 | PersistentComponentState persistentComponentState, 25 | IOptions optionsAccessor) 26 | { 27 | state = persistentComponentState; 28 | options = optionsAccessor.Value; 29 | 30 | AuthenticationStateChanged += OnAuthenticationStateChanged; 31 | subscription = state.RegisterOnPersisting(OnPersistingAsync, RenderMode.InteractiveWebAssembly); 32 | } 33 | 34 | private void OnAuthenticationStateChanged(Task task) 35 | { 36 | authenticationStateTask = task; 37 | } 38 | 39 | private async Task OnPersistingAsync() 40 | { 41 | if (authenticationStateTask is null) 42 | { 43 | throw new UnreachableException($"Authentication state not set in {nameof(OnPersistingAsync)}()."); 44 | } 45 | 46 | var authenticationState = await authenticationStateTask; 47 | var principal = authenticationState.User; 48 | 49 | if (principal.Identity?.IsAuthenticated == true) 50 | { 51 | var userId = principal.FindFirst(options.ClaimsIdentity.UserNameClaimType)?.Value; 52 | 53 | if (userId != null) 54 | { 55 | state.PersistAsJson(nameof(UserInfo), new UserInfo 56 | { 57 | UserId = userId, 58 | }); 59 | } 60 | } 61 | } 62 | 63 | public void Dispose() 64 | { 65 | subscription.Dispose(); 66 | AuthenticationStateChanged -= OnAuthenticationStateChanged; 67 | } 68 | } 69 | } 70 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Components/App.razor: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | @code { 23 | [CascadingParameter] 24 | private HttpContext HttpContext { get; set; } = default!; 25 | 26 | private IComponentRenderMode? RenderModeForPage => HttpContext.Request.Path.StartsWithSegments("/Account") 27 | ? null 28 | : InteractiveWebAssembly; 29 | } 30 | 31 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Components/Pages/Error.razor: -------------------------------------------------------------------------------- 1 | @page "/Error" 2 | @using System.Diagnostics 3 | 4 | Error 5 | 6 |

Error.

7 |

An error occurred while processing your request.

8 | 9 | @if (ShowRequestId) 10 | { 11 |

12 | Request ID: @RequestId 13 |

14 | } 15 | 16 |

Development Mode

17 |

18 | Swapping to Development environment will display more detailed information about the error that occurred. 19 |

20 |

21 | The Development environment shouldn't be enabled for deployed applications. 22 | It can result in displaying sensitive information from exceptions to end users. 23 | For local debugging, enable the Development environment by setting the ASPNETCORE_ENVIRONMENT environment variable to Development 24 | and restarting the app. 25 |

26 | 27 | @code{ 28 | [CascadingParameter] 29 | private HttpContext? HttpContext { get; set; } 30 | 31 | private string? RequestId { get; set; } 32 | private bool ShowRequestId => !string.IsNullOrEmpty(RequestId); 33 | 34 | protected override void OnInitialized() => 35 | RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier; 36 | } 37 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Components/_Imports.razor: -------------------------------------------------------------------------------- 1 | @using System.Net.Http 2 | @using System.Net.Http.Json 3 | @using Microsoft.AspNetCore.Components.Forms 4 | @using Microsoft.AspNetCore.Components.Routing 5 | @using Microsoft.AspNetCore.Components.Web 6 | @using static Microsoft.AspNetCore.Components.Web.RenderMode 7 | @using Microsoft.AspNetCore.Components.Web.Virtualization 8 | @using Microsoft.JSInterop 9 | @using BlazorAuthFromScratchWasm 10 | @using BlazorAuthFromScratchWasm.Client 11 | @using BlazorAuthFromScratchWasm.Components 12 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Program.cs: -------------------------------------------------------------------------------- 1 | using BlazorAuthFromScratchWasm.Client.Pages; 2 | using BlazorAuthFromScratchWasm.Components; 3 | using BlazorAuthFromScratchWasm.Components.Account; 4 | using Microsoft.AspNetCore.Components.Authorization; 5 | using Microsoft.AspNetCore.Components.Server; 6 | 7 | var builder = WebApplication.CreateBuilder(args); 8 | 9 | // Add services to the container. 10 | builder.Services.AddRazorComponents() 11 | .AddInteractiveWebAssemblyComponents(); 12 | 13 | builder.Services.AddScoped(); 14 | 15 | builder.Services.AddAuthentication("TdtsCookie") 16 | .AddCookie("TdtsCookie") 17 | .AddMicrosoftAccount(options => 18 | { 19 | options.ClientId = builder.Configuration["Authentication:Microsoft:ClientId"]; 20 | options.ClientSecret = builder.Configuration["Authentication:Microsoft:ClientSecret"]; 21 | options.TokenEndpoint = builder.Configuration["Authentication:Microsoft:TokenEndpoint"]; 22 | options.AuthorizationEndpoint = builder.Configuration["Authentication:Microsoft:AuthorizationEndpoint"]; 23 | }); 24 | 25 | builder.Services.AddAuthorization(); 26 | 27 | var app = builder.Build(); 28 | 29 | // Configure the HTTP request pipeline. 30 | if (app.Environment.IsDevelopment()) 31 | { 32 | app.UseWebAssemblyDebugging(); 33 | } 34 | else 35 | { 36 | app.UseExceptionHandler("/Error", createScopeForErrors: true); 37 | // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts. 38 | app.UseHsts(); 39 | } 40 | 41 | app.UseHttpsRedirection(); 42 | 43 | app.UseStaticFiles(); 44 | app.UseAntiforgery(); 45 | 46 | app.MapRazorComponents() 47 | .AddInteractiveWebAssemblyRenderMode() 48 | .AddAdditionalAssemblies(typeof(BlazorAuthFromScratchWasm.Client._Imports).Assembly); 49 | 50 | app.MapIdentityEndpoints(); 51 | 52 | app.Run(); 53 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "http://json.schemastore.org/launchsettings.json", 3 | "iisSettings": { 4 | "windowsAuthentication": false, 5 | "anonymousAuthentication": true, 6 | "iisExpress": { 7 | "applicationUrl": "http://localhost:60308", 8 | "sslPort": 44313 9 | } 10 | }, 11 | "profiles": { 12 | "http": { 13 | "commandName": "Project", 14 | "dotnetRunMessages": true, 15 | "launchBrowser": true, 16 | "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}", 17 | "applicationUrl": "http://localhost:5066", 18 | "environmentVariables": { 19 | "ASPNETCORE_ENVIRONMENT": "Development" 20 | } 21 | }, 22 | "https": { 23 | "commandName": "Project", 24 | "dotnetRunMessages": true, 25 | "launchBrowser": true, 26 | "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}", 27 | "applicationUrl": "https://localhost:7185;http://localhost:5066", 28 | "environmentVariables": { 29 | "ASPNETCORE_ENVIRONMENT": "Development" 30 | } 31 | }, 32 | "IIS Express": { 33 | "commandName": "IISExpress", 34 | "launchBrowser": true, 35 | "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}", 36 | "environmentVariables": { 37 | "ASPNETCORE_ENVIRONMENT": "Development" 38 | } 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft.AspNetCore": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "LogLevel": { 4 | "Default": "Information", 5 | "Microsoft.AspNetCore": "Warning" 6 | } 7 | }, 8 | "AllowedHosts": "*" 9 | } 10 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/wwwroot/app.css: -------------------------------------------------------------------------------- 1 | html, body { 2 | font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 3 | } 4 | 5 | a, .btn-link { 6 | color: #006bb7; 7 | } 8 | 9 | .btn-primary { 10 | color: #fff; 11 | background-color: #1b6ec2; 12 | border-color: #1861ac; 13 | } 14 | 15 | .btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus { 16 | box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb; 17 | } 18 | 19 | .content { 20 | padding-top: 1.1rem; 21 | } 22 | 23 | h1:focus { 24 | outline: none; 25 | } 26 | 27 | .valid.modified:not([type=checkbox]) { 28 | outline: 1px solid #26b050; 29 | } 30 | 31 | .invalid { 32 | outline: 1px solid #e50000; 33 | } 34 | 35 | .validation-message { 36 | color: #e50000; 37 | } 38 | 39 | .blazor-error-boundary { 40 | background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121; 41 | padding: 1rem 1rem 1rem 3.7rem; 42 | color: white; 43 | } 44 | 45 | .blazor-error-boundary::after { 46 | content: "An error has occurred." 47 | } 48 | 49 | .darker-border-checkbox.form-check-input { 50 | border-color: #929292; 51 | } 52 | -------------------------------------------------------------------------------- /src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/wwwroot/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/thedevtalkshow/BlazorAuthFromScratch/f080f5a84502a139257fed387f9b9d4a61f253fa/src/WebAssembly/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/BlazorAuthFromScratchWasm/wwwroot/favicon.png --------------------------------------------------------------------------------