Call to jQuery AJAX from firefox extension not working

Question

Here is my code:

$.ajax({
          url: 'xxx',
          success: function(data) 
          {
             if (data.trim() == '0')
             {
                //IF CODE
             } 
            else
            {
              //ELSE CODE
            }
         }
    });

This code working fine everywhere where I want to use, but not working in case of Firefox extension.

I read the following stackoverflow articles but no avail: Call to $.ajax from firefox extension not working and Ajax In Firefox Plugin

Also try to use xmlHTTPRequest but the result is same.

Answer 1

You should use the request module given by the addon sdk. You can call and use this module only in the add-on script and not in content script.

If you need to do an ajax request from a content script use the communication between content script and addon-script. You can find the documentation here.

If you want, I have an example of code (I assume it can be difficult to read it) but it can be help you.

Answer 2

Just in case it might help others of future, I would like to share a simple wrapper for the ajax Request. In most cases, the same jQuery Ajax configuration could be passed to function. (But it's not a complete conversion).

function sendAjax(ajaxConfig) {
  var request = Request({
    url: ajaxConfig.url,
    contentType: ajaxConfig.contentType,
    content: ajaxConfig.data,
    headers: ajaxConfig.headers,
    onComplete: function(response){
      var data = response.json;
      if(!data)
        data = response.text;

      //console.log("Ajax complete", response.status, ajaxConfig.url, response.text);    
      if(ajaxConfig.complete){
        ajaxConfig.complete(data);

      }

      if(response.status >= 400){ //got error
        if(ajaxConfig.error){
          //console.log("Ajax error", response.status, ajaxConfig.url, response.text);
          ajaxConfig.error(data);
        }
      }
      else{ //success
        if(ajaxConfig.success){
          //console.log("Ajax success", ajaxConfig.url, response.text);
          ajaxConfig.success(data);
        }
      }

    }

  });

  switch(ajaxConfig.type){
    case "POST":
      request.post();
      break;
    case "PUT":
      request.put();
    case "DELETE":
      request.delete();
    default:
      request.get();
  }

}

Answer 3

In manifest.json , You should add the url to the permissions : example:

"permissions": [
    "tabs",
    "webRequest",
    "webRequestBlocking",
    "activeTab",
    "*://xxx/*"
],