Support switching to local js/css from an option in LocalTest (#8562)

Co-authored-by: Ole Martin Handeland <[email protected]>

docker-compose.yml

@@ -16,7 +16,6 @@ services:
     environment:
       - NGINX_HOST=localhost
       - NGINX_PORT=80
-      - SUB_FILTER=${SUB_FILTER:-}
       - TEST_DOMAIN=${TEST_DOMAIN:-altinn3local.no}
       - ALTINN3LOCAL_PORT=${ALTINN3LOCAL_PORT:-80}
       - NGINX_ENVSUBST_OUTPUT_DIR=/etc/nginx

loadbalancer/Dockerfile

@@ -1,4 +1,4 @@
-FROM nginx:1.21.6-alpine
+FROM nginx:1.21.6-alpine-perl
 
 # Copy to template in order for Environment variable substitutions to run
 COPY nginx.conf /etc/nginx/templates/nginx.conf.template

loadbalancer/nginx.conf

@@ -1,9 +1,26 @@
+load_module /etc/nginx/modules/ngx_http_perl_module.so;
+
 worker_processes 1;
 
 events { worker_connections 1024; }
 
 http {
 
+
+    # perl_modules perl/lib;
+    # Support replacing reference to altinn js and css in app with local hosted webpack dev server
+    perl_set $LOCAL_SUB_FILTER 'sub {
+      my $r = shift;
+      my $cookie = $r->header_in("cookie");
+      my $url = $1 if ($cookie =~ /.*frontendVersion=(http.*?);/);
+      if($url)
+      {
+        $uri = $r->unescape($url);
+        return $uri;
+      }
+      return "https://altinncdn.no/toolkits/altinn-app-frontend/3/"
+    }';
+
     client_max_body_size 50M;
 
     sendfile on;
@@ -43,9 +60,9 @@ http {
 		}
 
 		location / {
-        # Support sub_filter declaration trough environment variable substitution
-        # default empty
-        ${SUB_FILTER}
+        #Support using Local js, when a cookie value is set
+        sub_filter_once off;
+        sub_filter 'https://altinncdn.no/toolkits/altinn-app-frontend/3/' $LOCAL_SUB_FILTER;
         proxy_pass          http://app/;
         error_page 502 /502App.html;
 		}

src/Controllers/HomeController.cs

@@ -4,6 +4,7 @@
 using System.IO;
 using System.Linq;
 using System.Net.Http;
+using System.Text.Json;
 using System.Threading.Tasks;
 using System.Security.Claims;
 using System.Xml;
@@ -78,6 +79,7 @@ public async Task<IActionResult> Index()
             model.LocalAppUrl = _localPlatformSettings.LocalAppUrl;
             var defaultAuthLevel = _localPlatformSettings.LocalAppMode == "http" ? await GetAppAuthLevel(model.TestApps) : 2;
             model.AuthenticationLevels = GetAuthenticationLevels(defaultAuthLevel);
+            model.LocalFrontendUrl = HttpContext.Request.Cookies[FRONTEND_URL_COOKIE_NAME];
 
             if (!model.TestApps?.Any() ?? true)
             {
@@ -92,11 +94,6 @@ public async Task<IActionResult> Index()
             return View(model);
         }
 
-        public IActionResult Privacy()
-        {
-            return View();
-        }
-
         [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
         public IActionResult Error()
         {
@@ -197,6 +194,77 @@ public async Task<ActionResult> GetTestOrgToken(string id, [FromQuery] string or
             return await Task.FromResult(Ok(token));
         }
 
+        /// <summary>
+        ///  See src\development\loadbalancer\nginx.conf
+        /// </summary>
+        public static readonly string FRONTEND_URL_COOKIE_NAME = "frontendVersion";
+
+        [HttpGet]
+        public async Task<ActionResult> FrontendVersion([FromServices]HttpClient client)
+        {
+            var versionFromCookie = HttpContext.Request.Cookies[FRONTEND_URL_COOKIE_NAME];
+
+
+
+            var frontendVersion = new FrontendVersion()
+            {
+                Version = versionFromCookie,
+                Versions = new List<SelectListItem>()
+                {
+                    new ()
+                    {
+                        Text = "Keep as is",
+                        Value = "",
+                    },
+                    new ()
+                    {
+                        Text = "localhost:8080 (local dev)",
+                        Value = "http://localhost:8080/"
+                    }
+                }
+            };
+            var cdnVersionsString = await client.GetStringAsync("https://altinncdn.no/toolkits/altinn-app-frontend/index.json");
+            var groupCdnVersions = new SelectListGroup() { Name = "Specific version from cdn" };
+            var versions = JsonSerializer.Deserialize<List<string>>(cdnVersionsString);
+            versions.Reverse();
+            versions.ForEach(version =>
+            {
+                frontendVersion.Versions.Add(new()
+                {
+                    Text = version,
+                    Value = $"https://altinncdn.no/toolkits/altinn-app-frontend/{version}/",
+                    Group = groupCdnVersions
+                });
+            });
+
+            return View(frontendVersion);
+        }
+        public ActionResult FrontendVersion(FrontendVersion frontendVersion)
+        {
+            var options = new CookieOptions
+            {
+                Expires = DateTime.MaxValue,
+                HttpOnly = true,
+            };
+            ICookieManager cookieManager = new ChunkingCookieManager();
+            if (string.IsNullOrWhiteSpace(frontendVersion.Version))
+            {
+                cookieManager.DeleteCookie(HttpContext, FRONTEND_URL_COOKIE_NAME, options);
+            }
+            else
+            {
+                cookieManager.AppendResponseCookie(
+                    HttpContext,
+                    FRONTEND_URL_COOKIE_NAME,
+                    frontendVersion.Version,
+                    options
+                    );
+            }
+
+            return RedirectToAction("Index");
+        }
+
+
         private async Task<List<UserProfile>> GetTestUsers()
         {
             List<UserProfile> users = new List<UserProfile>();
@@ -241,7 +309,8 @@ private async Task<IEnumerable<SelectListItem>> GetTestUsersForList()
         }
         private async Task<int> GetAppAuthLevel(IEnumerable<SelectListItem> testApps)
         {
-            try {
+            try
+            {
                 var appId = testApps.Single().Value;
                 var policyString = await _localApp.GetXACMLPolicy(appId);
                 var document = new XmlDocument();
@@ -251,7 +320,7 @@ private async Task<int> GetAppAuthLevel(IEnumerable<SelectListItem> testApps)
                 var authLevelNode = document.SelectSingleNode("/xacml:Policy/xacml:ObligationExpressions/xacml:ObligationExpression[@ObligationId='urn:altinn:obligation:authenticationLevel1']/xacml:AttributeAssignmentExpression[@Category='urn:altinn:minimum-authenticationlevel']/xacml:AttributeValue", nsMngr);
                 return int.Parse(authLevelNode.InnerText);
             }
-            catch(Exception)
+            catch (Exception)
             {
                 // Return default auth level if Single app auth level can't be found.
                 return 2;

src/Models/FrontendVersion.cs

@@ -0,0 +1,12 @@
+using Microsoft.AspNetCore.Mvc.Rendering;
+
+using System.Collections.Generic;
+
+namespace LocalTest.Models
+{
+    public class FrontendVersion
+    {
+        public string Version { get; set; }
+        public List<SelectListItem> Versions { get; set; }
+    }
+}

src/Models/StartAppModel.cs

@@ -69,6 +69,12 @@ public class StartAppModel
         /// </summary>
         public string AuthenticationLevel { get; set; }
 
+        /// <summary>
+        /// Url for where to load the local frontend from
+        /// (implemented as a cookie that nginx reads and substitutes the content in index.html)
+        /// </summary>
+        public string LocalFrontendUrl { get; set; }
+
         /// <summary>
         /// List of TestUsers for dropdown
         /// </summary>

src/Views/Home/FrontendVersion.cshtml

@@ -0,0 +1,16 @@
+@model FrontendVersion
+
+@{
+    ViewData["Title"] = "Frontend version";
+}
+<h1>@ViewData["Title"]</h1>
+
+@using (Html.BeginForm("FrontendVersion", "Home", FormMethod.Post, new { Class = "form-signin" }))
+{
+  @Html.AntiForgeryToken();
+  <div class="form-group">
+    <label for="exampleInputEmail1">Select your desired frontend version</label>
+    @Html.DropDownListFor(model => model.Version, Model.Versions, new { Class = "form-control" })
+  </div>
+  <button type="submit" class="btn btn-primary">Select</button>
+}

src/Views/Home/Index.cshtml

@@ -86,6 +86,19 @@
     <div class="alert alert-light" role="alert">
       To access attachments XML and other data, visit <a href="/LocalPlatformStorage/">/LocalPlatformStorage</a>
     </div>
+
+    @if(string.IsNullOrWhiteSpace(Model.LocalFrontendUrl))
+    {
+      <div class="alert alert-light" role="alert">
+        @Html.ActionLink("Use a different frontend version", "FrontendVersion", "Home")
+      </div>
+    }
+    else
+    {
+      <div class="alert alert-primary" role="alert">
+        You are using frontend js and css from @(Model.LocalFrontendUrl). @Html.ActionLink("Use a different frontend version", "FrontendVersion", "Home")
+      </div>
+    }
   </div>
   }
 }