admin管理员组

文章数量:1287192

I have requirements for a legacy site where I can't redesign the screens, I can't use header no-cache tags and I have to prevent the user from seeing cached screens after they logged out and pressed their back button.

I am almost to a solution ( see the code bit below )

When the page loads, I use a JQuery AJAX function to call the web app and see if the user is still logged in. If not, the user gets redirected to the login screen

<html>
<head>
 <!-- all the usual header stuff, plus links to the jQuery libaries, first script tag on page below -->

<script language = "javascript">

 $.get("/acme/confirm_authentication",function(data){
            if( data != "confirmed"){
                location.href = "logout";
            }
  }); 



</script>
</head>
<body>

blah blah blah
</body>
</html>

The big thing I don't like about this workaround is that for a split second I can the content before the JQuery function pletes.

Is there a way I can keep the page from loading/rendering until the JQuery AJAX function es to a stop?

Thanks


Update: Answer:


I modified the accepted answer below to include a "cache: false" option. In Firefox and Chrome, cached copies of the page that were reached via the back button would run the .ajax(), but would use a cached copy of the variable "data", which would give me an out of date answer.

$.ajax({
 url: "/acme/confirm_authentication",
 async:false,
 cache: false,
 success: function(data) {
     if( data != "confirmed"){
         location.href = "logout";
     }
 }         

});

I have requirements for a legacy site where I can't redesign the screens, I can't use header no-cache tags and I have to prevent the user from seeing cached screens after they logged out and pressed their back button.

I am almost to a solution ( see the code bit below )

When the page loads, I use a JQuery AJAX function to call the web app and see if the user is still logged in. If not, the user gets redirected to the login screen

<html>
<head>
 <!-- all the usual header stuff, plus links to the jQuery libaries, first script tag on page below -->

<script language = "javascript">

 $.get("/acme/confirm_authentication",function(data){
            if( data != "confirmed"){
                location.href = "logout";
            }
  }); 



</script>
</head>
<body>

blah blah blah
</body>
</html>

The big thing I don't like about this workaround is that for a split second I can the content before the JQuery function pletes.

Is there a way I can keep the page from loading/rendering until the JQuery AJAX function es to a stop?

Thanks


Update: Answer:


I modified the accepted answer below to include a "cache: false" option. In Firefox and Chrome, cached copies of the page that were reached via the back button would run the .ajax(), but would use a cached copy of the variable "data", which would give me an out of date answer.

$.ajax({
 url: "/acme/confirm_authentication",
 async:false,
 cache: false,
 success: function(data) {
     if( data != "confirmed"){
         location.href = "logout";
     }
 }         

});

Share Improve this question edited Aug 15, 2013 at 17:17 Steve asked Aug 14, 2013 at 21:20 SteveSteve 2,81814 gold badges60 silver badges98 bronze badges 6
  • 2 IMHO, I feel you should avoid blocking the UI at all costs. "Waiting" for something to load can really ruin a site and a person's feelings towards said site. – Dom Commented Aug 14, 2013 at 21:23
  • 2 Out of curiosity: If a user disables Javascript, can they access the content without logging in? – Pete Scott Commented Aug 14, 2013 at 21:23
  • 1 You need to do this at the server instead. – SLaks Commented Aug 14, 2013 at 21:24
  • 1 Nope. We have full server side authentication. This is about them using their back button to see cached content. I can't turn caching off server side because we have legacy multi-screen forms, each screen having data, which should not be seen after logging out. Setting no cache on those screens results in the user back buttoning to a blank screen and having no screen to go forward to.....sitting dead. – Steve Commented Aug 14, 2013 at 21:25
  • Like @Jean-Philippe Bond said below, why use Async (ajax) calls then? You are better off making the call synchronously and wait for the response to determine your next action. – blurfus Commented Aug 14, 2013 at 21:37
 |  Show 1 more ment

1 Answer 1

Reset to default 8

You can do it with the ajax function with the async property set to false.

  $.ajax({
     url: "/acme/confirm_authentication",
     success: function(data) {
         if( data != "confirmed"){
             location.href = "logout";
         }
     },
     async:false
  });

本文标签: javascriptStop A Web Page From Loading Until A JQuery AJAX Call CompletesStack Overflow