Server Navigation Feature Documentation
16 min
overview the server navigation feature allows you to disable the default single page application (spa) behavior and force the app to use traditional server navigation instead when enabled, all navigation actions will trigger full page reloads rather than client side routing why was this feature created? this feature was specifically requested by customers for advertising related requirements some advertising networks and tracking systems work better with traditional page refreshes, as they can properly track page views, refresh ad content, and handle ad impressions more reliably when each navigation triggers a full page reload what is the behavior? default spa behavior (disabled) clicking links or navigating within the app loads new content without refreshing the page the browser back/forward buttons work instantly faster navigation experience page state is preserved during navigation server navigation behavior (enabled) clicking links or navigating triggers a full page reload each navigation request goes to the server similar to traditional websites where every click refreshes the entire page page state is reset with each navigation slower navigation but can be useful for debugging or specific requirements when to use this feature primary use case advertising requirements when customers need better ad tracking, impression counting, or ad refresh functionality that requires full page reloads additional use cases debugging when you need to isolate issues related to client side routing testing to test how the app behaves with traditional server side navigation legacy support when certain functionality requires full page reloads how to enable server navigation to enable this feature, you need to modify the experience config json file configuration example { "purple" { "features" { "forceservernavigation" true } } } complete configuration example here's a more complete example showing where the setting fits in a typical experience config json { "language" "en", "purple" { "leandom" true, "features" { "forceservernavigation" true }, "analytics" { "googleanalytics" { "trackingid" "ga tracking id" } } } } configuration options property type default description forceservernavigation boolean false when true , forces all navigation to use server navigation instead of spa routing what to expect when testing ✅ expected behavior when enabled full page reloads every navigation action causes a complete page refresh network requests each navigation generates a new http request to the server loading states you'll see browser loading indicators on each navigation url changes urls still change correctly, but with full page reloads state reset application state is completely reset with each navigation ad refresh advertisements will reload and refresh with each page navigation better ad tracking ad networks can properly count page views and impressions ⚠️ things to watch for performance navigation will be slower compared to spa behavior user experience users may notice the page "flashing" or reloading form data any unsaved form data will be lost during navigation scroll position page will always scroll to the top after navigation 🧪 testing checklist main navigation menu triggers full page reloads internal links cause page refreshes browser back/forward buttons reload pages search functionality works with page reloads deep linking to specific pages works correctly mobile navigation behaves consistently ads refresh properly with each page navigation ad impressions are counted correctly (check with ad network reports) page view tracking works as expected for analytics troubleshooting feature not working? check configuration ensure forceservernavigation true is correctly set in experience config json clear cache clear browser cache and reload the page check network tab in browser dev tools, verify that navigation requests are going to the server server environment feature only works in browser environment (not during server side rendering) still using spa navigation? the feature includes fallback logic if server navigation fails, it will fall back to spa navigation check browser console for any error messages verify the experience config json file is being loaded correctly technical notes for developers server navigation only applies in browser environment ( isbrowser() check) the feature wraps angular's router service and intercepts navigate() and navigatebyurl() calls urls are properly transformed and validated before redirection error handling ensures fallback to spa navigation if server navigation fails the implementation is in projects/storefront/src/app/routing/router service ts 26 48 disabling the feature to disable server navigation and return to default spa behavior { "purple" { "features" { "forceservernavigation" false } } } or simply remove the forceservernavigation property entirely from your configuration