Связь JSONP в расширении Google Chrome - PullRequest
1 голос
/ 23 января 2012

Я пишу расширение Google Chrome.Я хочу использовать междоменную связь jsonp с jQuery.Вот код AJAX:

$.ajax({
    type : 'POST',
    url : $(this).attr('action'),
    data : $(this).serialize(),
    contentType: 'application/json; charset=utf-8',
    dataType : 'jsonp',
    success : function() {
        alert('A');
    }
});

Это вызывает этот URL:

http://sgsync.dev.kreatura.hu/api/signup/?callback=jQuery1710883696963544935_1327347078860&nick=&pass=&_=1327347087371

Сервер отвечает 200 OK с этими данными:

jQuery1710883696963544935_1327347078860({"messages":["Minden mez\u0151 kit\u00f6lt\u00e9se k\u00f6telez\u0151!"],"errorCount":1})

После этого я получил это сообщение об ошибке:

Can't find variable: jQuery1710883696963544935_1327347078860

Я попробовал все, и я не могу понять проблему.Пожалуйста, помогите мне!

Обратите внимание, что я запрограммировал код на стороне сервера, поэтому с ним тоже может быть проблема.

Заранее спасибо!

Ответы [ 3 ]

2 голосов
/ 24 января 2012

Одна из причин, по которой это так запутанно, заключается в том, что jQuery API путает проблему вызовов Ajax с вызовами JSONP. При использовании $.ajax с dataType: 'jsonp' это не делает Ajax-вызов (не используется связь XHR), вместо этого он использует динамическое внедрение сценария с обратным вызовом. Это означает, что type: 'POST' не будет иметь смысла (поскольку динамическое внедрение сценария работает только так, как будет работать GET), и что все data будут закодированы в URL запроса, а не отправлены как сообщение тело. Если это действительно предназначено для «POST» данных, то JSONP не должен использоваться (поскольку конфиденциальные данные будут отправлены в виде открытого текста).

Как упоминалось в одном из комментариев, этот вопрос был решен в этом ответе в отношении запросов JSONP из сценариев содержимого Chrome и использования XHR из сценария содержимого.

Запрос JSONP в расширении Chrome, функция обратного вызова не существует?

Что касается расширений Chrome, они заставляют вывести вас в песочницу при использовании «сценариев conten» в расширении Chrome. Вы можете удалить запрос формы dataType: 'jsonp' в скрипте содержимого Chrome Extension, и этот вызов должен работать. Если это не сработает, вы можете попытаться сделать вызов напрямую, используя XHRHttpRequest:

var xhr = new XMLHttpRequest();
xhr.setRequestHeader("Content-Type", "application/json; charset=utf-8");
xhr.open("POST", $(this).attr('action'), true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
       alert("A");
  }
}
xhr.send($(this).serialize());

Что касается других браузеров, я не уверен, как каждая из их специфических сред плагинов обрабатывает междоменные вызовы XHR (или вообще разрешают ли они это). Это то, что НЕ допускается в обычных браузерах (если только не используется что-то вроде easyXDM ).

1 голос
/ 24 января 2012

Посмотрите на этот вопрос и мой ответ, поскольку я думаю, что он может дать вам решение ...
Автоматически загружать букмарклет, когда он находится на веб-странице как расширение Google Chrome

0 голосов
/ 24 января 2012

Основные понятия JSON-P:

Вставить тег сценария, который загружает внешний файл javascript.
Этот файл не выполняет ничего, кроме выполнения предопределенного функция, с данными с сервера.

Как заставить это работать:

Сначала создайте функцию, связанную с глобальным объектом (окно) :

window.processMyData = function processMyData(data) {
  console.log(data);
}

Затем вставьте тег страницы на страницу: script = document.createElement ("script");

$('<script></script>')
  .prop({'type': 'text/javascript', 'src': 'http://your.url?with=possible&data=in_it'})
  .appendTo('body');

Видите?Нет необходимости в оболочке $ .ajax, JSON-P работает по-другому.

Удачи!

Редактировать: в ответ на Duskwuff Я хотел бы добавить, что яне хочу сказать, что $.ajax плохо или бесполезно.Я здесь не для того, чтобы дать вам фрагмент кода jQuery, я пытаюсь помочь вам понять вашу проблему с помощью немного более простого javascript / html.JSON-P - это не просто JSON с добавленной буквой P, он полностью отличается от обычного запроса.

...