function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
mattpopeftusamattpopeftusa 

Redirect to community login on session expire for single page AngularJS app

Hello, we are building an AngularJS single page application that is hosted on the force.com platform and served to users through a community. It's all working great other than a situation where the users session expires and they try to navigate the Angular app. Since there is no page load when they navigate the app but it does make a JS remoting call to an Apex method the call to the method fails but the user doesn't get redirected to the community login page. 

Has anyone applied a straight forward solution to this challenge? Figuring it will come down to catching certain errors in AngularJS related to remoting errors and then redirecting in those conditions.

Thanks

TylerYoungbloodTylerYoungblood
We are also building an angular app and having the same issue. After a session expiration occurs (client goes home for the evening, returns the following morning, wakes their computer from sleep and the app is still open in their browser) there is nothign to indicate to the user that their session has expired. They try to navigate around the app and console errors occur, but nothing visible to the user. It isn't until the user clicks on the "reload browser" button that they are greeted with the login screen.

Another issue I'm trying to figure out is that they are taken to the SF login screen, and not to the custom URL (to our branded website) we have set up for them when they actively logout. So if they log out, they are taken to our website (which has a login link that takes them to our branded login screen). But if they timeout, nothing happens unless they refresh. And if they refresh they are taken to the SF login screen, not to the custom URL.

So it's doubly confusing for our users because they don't understand why the app isnt working, eventually hit refresh, and then they don't recognize the login.salesforce.com style login screen (since they are used to logging in through our website's branded login page). 

Any advice on either issue would be greatly appreciated!
mattpopeftusamattpopeftusa
Hello, I was able to resolve this I believe by adding this JS block inside the head tag in the Visualforce page that contains the Angular App. 
<script>
$(function(){ 
    // this is an SPA problem. We need to make sure they're still logged in so we can 
    // make JS remoting calls without page reloads.
    var originalOnError = Visualforce.remoting.Util.error; 
    Visualforce.remoting.Util.error = function(a,b){ 
        // If and only if we get the characteristic page not allowed message, 
        // reload the page to send them to the login page 
        if (a&&(a.indexOf('Page not allowed') !== -1) || a&&(a.indexOf('Invalid session') !== -1)){ 
            window.top.location = '{!$CurrentPage.URL}';
        } else { 
            // Perform the normal behavior 
            originalOnError && originalOnError(a,b); 
        }
    } 
});   
</script>

This hopefully solves your first problem of detecting expired sessions, but it just reloads the current page so sounds like in your case it will take them to the main Salesforce login page. First thought, there may be some issues with your Site settings if this is a Community. I'm no expert on that but it's maybe worth another look.

Another option may be to set the window.top.location in this script to your custom login page. Only issue I see is that if you hard code this URL then it won't work in sandboxes.  

Hope this helps! Best of luck.