Jquery Mobile - Refresh results in a blank/white screen everytime

Question

So, I'm pretty new with JQuery Mobile. I got my web site mostly working, but I've hit a weird bug that rears its ugly head only sparingly and I can't seem to get any traction on it. This bug mainly appears when I use the iOS 7 Safari browser. I only have the iPhone 5 so I haven't been able to test on other versions of iOS.

The issue is as follows:

Navigating through the web site using JQuery mobile is mostly fine almost all the time. However, using a weird combination of manual browser refresh and back buttons (Can't nail down the exact combination) I will hit a page that fails to load and only get a white screen every time I refresh or go back to it. The only way to get that page to reload is to clear my browser history Or kill safari manually. So looking at my web server terminal output, the log says its rendering the *.mobile.erb files, but none of the assets are being retrieved.

Forgot to mentions what I'm using exactly. I'm using Ruby on Rails 4 with Ruby 2 and using jquery 1.10.2 with jquery mobile 1.4.2. I would happily post whatever code you think would be helpful in answering this question, but I truthfully don't know where to start. I've gotten this issue to repro on the Linux Chrome browser only once, but haven't been able to do it again. I can repro it quick on Safari for iOS 7. Has anybody seen or heard of an issue that is similar to this? Any sort of guidance would help so I can continue investigating. I've literally hit a brick wall on researching this.

Here is what the output from my webserver terminal looks like the when the page renders correctly:

Processing by ReviewsController#new as HTML
  Parameters: {"place_id"=>"90"}
  User Load (0.3ms)  SELECT `users`.* FROM `users` WHERE `users`.`id` = 2 ORDER BY `users`.`id` ASC LIMIT 1
  Place Load (0.2ms)  SELECT `places`.* FROM `places` WHERE `places`.`slug` = '90' ORDER BY `places`.`id` ASC LIMIT 1
  Place Load (0.2ms)  SELECT `places`.* FROM `places` WHERE `places`.`id` = 90 LIMIT 1
   (0.1ms)  SELECT COUNT(*) FROM `reviews` WHERE `reviews`.`user_id` = 2 AND `reviews`.`place_id` = 90
  Rendered layouts/_header.mobile.erb (1.5ms)
  Rendered layouts/_flash_message.mobile.erb (0.1ms)
  Rendered shared/_error_messages.mobile.erb (0.0ms)
  Rendered reviews/_form.mobile.erb (3.5ms)
  Rendered reviews/new.mobile.erb within layouts/application (9.5ms)
Completed 200 OK in 24ms (Views: 14.6ms | ActiveRecord: 0.7ms | Solr: 0.0ms)


Started GET "/assets/mobile/mobile.css" for 192.168.1.176 at 2014-04-24 13:17:28 -0700


Started GET "/assets/jquery.raty.min.js?body=1" for 192.168.1.176 at 2014-04-24 13:17:28 -0700


Started GET "/assets/mobile/places.mobile.js?body=1" for 192.168.1.176 at 2014-04-24 13:17:28 -0700


Started GET "/assets/joey.png" for 192.168.1.176 at 2014-04-24 13:17:28 -0700


Started GET "/assets/jquery.raty/star-off.png" for 192.168.1.176 at 2014-04-24 13:17:28 -0700

Here is what it looks like when I get the white screen on every refresh:

Processing by ReviewsController#new as HTML
  Parameters: {"place_id"=>"90"}
  User Load (0.3ms)  SELECT `users`.* FROM `users` WHERE `users`.`id` = 2 ORDER BY `users`.`id` ASC LIMIT 1
  Place Load (0.2ms)  SELECT `places`.* FROM `places` WHERE `places`.`slug` = '90' ORDER BY `places`.`id` ASC LIMIT 1
  Place Load (0.2ms)  SELECT `places`.* FROM `places` WHERE `places`.`id` = 90 LIMIT 1
   (0.2ms)  SELECT COUNT(*) FROM `reviews` WHERE `reviews`.`user_id` = 2 AND `reviews`.`place_id` = 90
  Rendered layouts/_header.mobile.erb (1.8ms)
  Rendered layouts/_flash_message.mobile.erb (0.1ms)
  Rendered shared/_error_messages.mobile.erb (0.1ms)
  Rendered reviews/_form.mobile.erb (3.7ms)
  Rendered reviews/new.mobile.erb within layouts/application (10.3ms)
Completed 200 OK in 26ms (Views: 15.8ms | ActiveRecord: 0.8ms | Solr: 0.0ms)

Notice the "Started Get" statements never come. Almost like the assets are all cached and don't need to be reloaded.

score 0 · Answer 1 · edited May 23 '17 at 12:28

So the hunch I had seems to be correct. For some reason certain pages get cached and the assets are never retrieved and I guess in the jquery mobile world, if this happens, you get a blank white screen. So I added some code to the application_controller.rb to prevent caching altogether. I got this from this link: How to prevent browser page caching in Rails

Here is the code.

before_filter :set_cache_buster

def set_cache_buster
  response.headers["Cache-Control"] = "no-cache, no-store, max-age=0, must-revalidate"
  response.headers["Pragma"] = "no-cache"
  response.headers["Expires"] = "Fri, 01 Jan 1990 00:00:00 GMT"
end

Jquery Mobile - Refresh results in a blank/white screen everytime

1 Answers1