Fix 404 issue: Add GitHub Pages SPA redirect for Angular routing

deniz.dundar · deniz.dundar · commit 2903b9b304c1 · 2025-07-07T22:14:13.000+03:00
diff --git a/README.md b/README.md
diff --git a/public/404.html b/public/404.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <title>Ahmet Deniz Dündar - Frontend Developer</title>
+  <script type="text/javascript">
+    // GitHub Pages hack for single page applications
+    // Redirect from 404 page to index.html with the route encoded in the query string
+    var pathSegmentsToKeep = 0;
+    var l = window.location;
+    l.replace(
+      l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
+      l.pathname.split('/').slice(0, 1 + pathSegmentsToKeep).join('/') + '/?/' +
+      l.pathname.slice(1).split('/').slice(pathSegmentsToKeep).join('/').replace(/&/g, '~and~') +
+      (l.search ? '&' + l.search.slice(1).replace(/&/g, '~and~') : '') +
+      l.hash
+    );
+
+  </script>
+</head>
+
+<body>
+  <!-- GitHub Pages 404 redirect for Single Page Applications -->
+</body>
+
+</html>
diff --git a/src/index.html b/src/index.html
@@ -218,6 +218,32 @@
 
   </style>
 
+  <!-- GitHub Pages Redirect Script for SPA -->
+  <script type="text/javascript">
+    // Decode URL parameters from 404.html redirect
+    (function () {
+      var redirect = sessionStorage.redirect;
+      delete sessionStorage.redirect;
+      if (redirect && redirect != location.href) {
+        history.replaceState(null, null, redirect);
+      }
+    })();
+
+    // Check for redirect parameter in URL
+    (function () {
+      var l = window.location;
+      if (l.search && l.search[1] === '/') {
+        var decoded = decodeURIComponent(l.search.slice(1)).split('&').map(function (s) {
+          return s.replace(/~and~/g, '&')
+        }).join('?');
+        window.history.replaceState(null, null,
+          l.pathname.slice(0, -1) + decoded + l.hash
+        );
+      }
+    })();
+
+  </script>
+
 </head>
 
 <body>
