Failed to clear temp storage: SecurityError in Chrome [duplicate]

Question

Failed to clear temp storage: It was determined that certain files are unsafe for access within a Web application, or that too many calls are being made on file resources. SecurityError

I'm getting this error in console. I have a script name script.js which makes ajax calls to retrieve data from php.

Any idea why?

Here's my jQuery script

$(document).ready(function() {

  var loading = false;
  var docHeight = $(window).height();

  $('.timeline').css({minHeight: docHeight});

  function get_tl_post() {

    if (loading==false) {

      loading = true;

      $.ajax({
        type:"POST",
        url:"timeline.php",
        data:"data=instagram",
        beforeSend:function(){
           $('.loader').fadeIn("slow");
        },
        complete:function(){
          loading = false;
          $('.loader').fadeOut("slow");
        },
        success:function(data) {
          if(data=="error")
          {
            get_tl_post();
          }
          $(data).hide().appendTo(".timeline").fadeIn(1000); 
        }
      });
    }
  }

  $(window).scroll(function(){
    if ($(window).scrollTop() == $(document).height() - $(window).height()) {
      get_tl_post();
    }
  });
});

Answer 1

This is Due to Network Mapping of your resources.

In other words, you might have added workspace folder in your chrome dev tools. Now when you are trying to make changes in some files it makes the Request to the File-System. This works fine for a while. However in some scenarios you remove your network mapping.

Then when you trying to open that web page on the browser, it might or might not ask for remapping of network resources and still try to update the File System. And that's when you get this error. There is nothing wrong with your script.

Now the only solution to this could be Removing cache, then restarting System. If the problem still persist, you can simply re install chrome and this should be fixed.

Moreover, sometimes network mapping can cause several other issues as well. For example, making the CSS file size to whooping 75MB or above. So you have to take precautions when playing with network mapping.

Optionally if you are on Mac... or Even on Windows and have sh commands available.

sudo find / -type f -size +50000k -exec ls -lh {} \; | awk '{ print $9 ": " $5 }'

Hit this in your Terminal to find out the culprit individual file which is over 50MB. you could then remove them.

Note : What the above command does it, it will find all the individual files which are more than 50MB and print them on your terminal one by one.

Answer 2

If I was to guess I would say your timeline.php script is always returning "error" so you are making too many calls recursively and the browser blocks them.

Try to eliminate the recursive function call and see if that will fix the problem.

Remove the following 3 lines and try again:

if (data == "error")
{
    get_tl_post();
}

Answer 3

If your ajax call fails for some reason, this could lead to too many recursive calls of the get_tl_post();.

I suggest that you use the error property for error handling, and to avoid situations of recursively calling your function. An idea could be to set a policy like "if the request failed/data are with errors, wait for an amount of time, then retry. If X retries are made, then show an error code and stop requesting".

Below is an example of untested code, in order to show you the idea:

var attempts = 0;
$.ajax({
  //Rest of properties
  success: function(data) {

    if(data == "error") {
      if(attempts < 3) {
        setTimeout(function(){
          get_tl_post();
          ++attempts;
        }, 2000);
      } else {
        //output failure here.
      }

    }

    //Rest of code....
  }
});