Merge pull request #19569 from abpframework/liangshiwei/authenticationSessionstateMVC

Add authentication-state-listener js to logout from other tabs for MVC UI

framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/AbpAspNetCoreMvcUiThemeSharedModule.cs

@@ -30,7 +30,7 @@ public class AbpAspNetCoreMvcUiThemeSharedModule : AbpModule
         {
             options.FileSets.AddEmbedded<AbpAspNetCoreMvcUiThemeSharedModule>("Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared");
         });
-
+        
         Configure<AbpBundlingOptions>(options =>
         {
             options

framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/Bundling/SharedThemeGlobalScriptContributor.cs

@@ -49,7 +49,8 @@ public class SharedThemeGlobalScriptContributor : BundleContributor
             "/libs/abp/aspnetcore-mvc-ui-theme-shared/datatables/datatables-extensions.js",
             "/libs/abp/aspnetcore-mvc-ui-theme-shared/sweetalert2/abp-sweetalert2.js",
             "/libs/abp/aspnetcore-mvc-ui-theme-shared/toastr/abp-toastr.js",
-            "/libs/abp/aspnetcore-mvc-ui-theme-shared/date-range-picker/date-range-picker-extensions.js"
+            "/libs/abp/aspnetcore-mvc-ui-theme-shared/date-range-picker/date-range-picker-extensions.js",
+            "/libs/abp/aspnetcore-mvc-ui-theme-shared/authentication-state/authentication-state-listener.js"
         });
     }
 }

framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/wwwroot/libs/abp/aspnetcore-mvc-ui-theme-shared/authentication-state/authentication-state-listener.js

@@ -0,0 +1,30 @@
+(function () {
+
+    const stateKey = 'authentication-state-id';
+
+    window.addEventListener('load', function () {
+        if (!abp || !abp.currentUser) {
+            return;
+        }
+
+        if (!abp.currentUser.isAuthenticated) {
+            localStorage.removeItem(stateKey);
+        } else {
+            localStorage.setItem(stateKey, abp.currentUser.id);
+        }
+
+        window.addEventListener('storage', function (event) {
+
+            if (event.key !== stateKey || event.oldValue === event.newValue) {
+                return;
+            }
+
+            if (event.oldValue || !event.newValue) {
+                window.location.reload();
+            } else {
+                location.assign('/')
+            }
+        });
+    });
+
+}());