Chrome extension external ajax call by jquery not working

Question

I really googled a lot but found no answer which covers my question.

I'm developing a chrome extension and I want to make an ajax call by jquery.
I make it like this:
popup.js

$(function()
{
    $('#btn').click(function()
    {
        $('#wait').html('loading...');
        jQuery.getJSON("http://domain.com/extension_php_files/generate.php?callback=?",
        {id:25}, 
        function(data) 
        {
            $('#wait').html('');
            console.log( JSON.stringify(data) ) 
            $.each(data, function(key, val) 
            {
                alert(key + '  ' + val);
            });
        });
    });
});

And here is my popup.html

<!doctype html>
<html>
  <head>
    <title></title>
    <script src="jquery.js"></script>
    <script src="popup.js"></script>
  </head>
  <body>
  <a href="#" id="btn">SEND</a><br /><br /><br /><br />
  <span id="wait"></span>
  </body>
</html>

And manifest.json

{
  "manifest_version": 2,

  "name": "black",
  "description": "black here",
  "version": "1.0",

  "permissions": [
    "http://domain.com/*"
  ],
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  }
}

When I click on the SEND button, I see Loading... but it never goes into success function. I googled but couldn't figure out the problem.
What am I doing wrong?

PS: My server side code works just fine.

Asked and answered before: [Get JSON in chrome plugin](http://stackoverflow.com/questions/11842954/get-json-in-chrome-plugin) — Rob W, Mar 25 '13 at 08:29
@RobW I've been read all questions about my problem in stackoverflow. — Siamak Motlagh, Mar 25 '13 at 08:32
I understand. I've got lots of experience with writing extensions, and posted many answers in the google-chrome-extension tag, so I can easily identify the core issue and find the corresponding Q&A, even if the wording of the question is slightly different. The answer on the linked question exactly targets your specific problem. If you apply the [proposed solution](http://stackoverflow.com/a/11845618/938089), your extension will start working like a charm. — Rob W, Mar 25 '13 at 08:34
@RobW So what should i do if my problem still exists? (even when i read that answers) — Siamak Motlagh, Mar 25 '13 at 08:39
Try the answer first, and post a *tested* demo with the problem. Your question says that the button etc. show up, but I know that the posted example might not be accurate since the syntax of the manifest file is invalid (if you used this file literally, your extension won't load at all). — Rob W, Mar 25 '13 at 08:42
@RobW thanks for your comments. but it was happened during the copy-paste. I corrected it. — Siamak Motlagh, Mar 25 '13 at 08:45
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/26848/discussion-between-siamak-a-m-and-rob-w) — Siamak Motlagh, Mar 25 '13 at 08:46

score 2 · Answer 1 · edited Feb 16 '16 at 07:46

2

I'm also sometimes have hard time with jquery ajax request, and I the best solution for me is just to replace that code with native javascript Ajax code. Try to make request using XMLHttpRequest like this:

var xhr = new XMLHttpRequest();
     xhr.open("GET", "http://domain.com/", true);
     xhr.onreadystatechange = function() {
      if (xhr.readyState == 4) {

          // paste your code here 
       }
     }
     xhr.send();

replace the http://domain.com/ with your complete url

edited Feb 16 '16 at 07:46

Siamak Motlagh

5,028
7
41
65

answered Mar 25 '13 at 08:54

Jigberto

1,513
7
27
50

Thanks for your answer but i really Insisted to do it with jquery ajax method. thanks for your answer :) – Siamak Motlagh Mar 25 '13 at 09:53
i was using $.getJSON and it`s async state was driving me crazy. Going vanilla xhr this way has brougth my mind back to sanity :) – pojda Aug 06 '17 at 21:00

score 0 · Accepted Answer · edited May 23 '17 at 11:45

0

Thanks for Rob W's helps.

I removed ?callback=? at the end of the url. And on server side page I did something like this:

$id = $_GET['$id'];
$arr = array ("id"=>$id,"name"=>"Siamak","lname"=>"Aghaeipour","age"=>"24");
$jsonData =  json_encode($arr);
echo $jsonData;

It works fine.

edited May 23 '17 at 11:45

Community

1
1

answered Mar 25 '13 at 09:51

Siamak Motlagh

5,028
7
41
65

Chrome extension external ajax call by jquery not working

2 Answers2