Add PKCE verification

Author: CorruptComputer

BlazorWasmOsmOauth/Infrastructure/LocalStorageService.cs

@@ -19,6 +19,12 @@ public sealed class LocalStorageService(IJSRuntime jsRuntime)
     /// </summary>
     public const string OsmStateKey = "osm-state";
 
+    /// <summary>
+    ///   The localstorage key for the osm pkce value, used to prevent MITM attacks
+    ///   See: https://developer.okta.com/blog/2019/05/01/is-the-oauth-implicit-flow-dead#does-the-authorization-code-flow-make-browser-based-apps-totally-secure
+    /// </summary>
+    public const string OsmPkceKey = "osm-pkce";
+
     /// <summary>
     ///   Gets the specified value from localstorage
     /// </summary>

BlazorWasmOsmOauth/Layout/MainLayout.razor.cs

@@ -1,3 +1,4 @@
+using System.Security.Cryptography;
 using BlazorWasmOsmOauth.Infrastructure;
 using BlazorWasmOsmOauth.Models;
 
@@ -14,12 +15,19 @@ public partial class MainLayout(AppConfig config, NavigationManager navManager,
     LocalStorageService localStorageService) : LayoutComponentBase
 {
     private string SourceRevisionId => config.SourceRevisionId;
-    
+
     private async Task GoToLogin()
     {
         Guid state = Guid.NewGuid();
         await localStorageService.SetItemAsync(LocalStorageService.OsmStateKey, state, CancellationToken.None);
 
+        Guid pkce1 = Guid.NewGuid();
+        Guid pkce2 = Guid.NewGuid();
+        string pkce = pkce1.ToString("N") + pkce2.ToString("N");
+        await localStorageService.SetItemAsync(LocalStorageService.OsmPkceKey, pkce, CancellationToken.None);
+
+        byte[] pkceSha256 = SHA256.HashData(System.Text.Encoding.UTF8.GetBytes(pkce));
+
         navManager.NavigateTo(
             navManager.GetUriWithQueryParameters($"{config.OsmAuthBaseUrl}/oauth2/authorize",
                 new Dictionary<string, object?>
@@ -28,7 +36,9 @@ private async Task GoToLogin()
                     { "client_id", config.ClientId },
                     { "redirect_uri", config.RedirectUri },
                     { "scope", "read_prefs" },
-                    { "state", state }
+                    { "state", state },
+                    { "code_challenge", Convert.ToBase64String(pkceSha256).Replace('+', '-').Replace('/', '_').TrimEnd('=') },
+                    { "code_challenge_method", "S256" }
                 }.AsReadOnly()
             )
         );

BlazorWasmOsmOauth/Osm/OsmApiClient.cs

@@ -29,12 +29,13 @@ public class OsmApiClient(IHttpClientFactory httpClientFactory)
     ///   Get the user token from the OSM API, using the code from the OAuth2 flow. Or null if the request fails.
     /// </summary>
     /// <returns></returns>
-    public async Task<TokenResponse?> GetTokenAsync(string code, string redirectUri, string clientId)
+    public async Task<TokenResponse?> GetTokenAsync(string code, string redirectUri, string clientId, string pkce)
     {
         string queryStr = "grant_type=authorization_code"
                             + $"&code={HttpUtility.UrlEncode(code)}"
                             + $"&redirect_uri={HttpUtility.UrlEncode(redirectUri)}"
-                            + $"&client_id={HttpUtility.UrlEncode(clientId)}";
+                            + $"&client_id={HttpUtility.UrlEncode(clientId)}"
+                            + $"&code_verifier={HttpUtility.UrlEncode(pkce)}";
 
         HttpResponseMessage response = await _authClient.PostAsync($"/oauth2/token?{queryStr}", new StringContent(string.Empty, Encoding.UTF8, "application/x-www-form-urlencoded"));
 

BlazorWasmOsmOauth/Pages/AuthCompletePage.razor.cs

@@ -63,7 +63,19 @@ private async Task GetToken()
             return;
         }
 
-        TokenResponse? tokenResp = await osmClient.GetTokenAsync(Code, config.RedirectUri, config.ClientId);
+        string? pkce = await localStorageService.GetItemAsync<string>(LocalStorageService.OsmPkceKey, CancellationToken.None);
+
+        if (string.IsNullOrWhiteSpace(pkce))
+        {
+            // Wait for the dialog to close, then redirect to the home page
+            IDialogReference dialogReference = await dialogService.ShowErrorAsync("The PKCE value is missing.", title: "Missing PKCE");
+            await dialogReference.Result;
+
+            navManager.NavigateTo("/");
+            return;
+        }
+
+        TokenResponse? tokenResp = await osmClient.GetTokenAsync(Code, config.RedirectUri, config.ClientId, pkce);
 
         if (tokenResp != null)
         {