Как использовать тип: POST в вызове jsonp ajax

Я использую JQuery ajax jsonp. У меня ниже Код JQuery:

 $.ajax({  
        type:"GET",        
        url: "Login.aspx",  // Send the login info to this page
        data: str, 
        dataType: "jsonp", 
        timeout: 200000,
        jsonp:"skywardDetails",
        success: function(result)
        { 
             // Show 'Submit' Button
            $('#loginButton').show();

            // Hide Gif Spinning Rotator
            $('#ajaxloading').hide();  
         } 

    });  

Приведенный выше код работает нормально, я просто хочу отправить запрос как «POST» вместо «GET». Пожалуйста, подскажите, как я могу этого добиться.

Спасибо


person Manoj Singh    schedule 22.12.2010    source источник


Ответы (6)


Вы не можете выполнить POST с помощью JSONP ... он просто так не работает, он создает элемент <script> для извлечения данных ... который имеет как GET-запрос. Вы мало что можете сделать, кроме публикации в своем собственном домене в качестве прокси-сервера, который отправляет сообщения другому ... но пользователь не сможет сделать это напрямую и увидеть ответ.

person Nick Craver    schedule 22.12.2010
comment
Не могли бы вы предложить, как я могу ограничить зашифрованный переданный URL, чтобы никто не мог видеть, что это POST. - person Manoj Singh; 22.12.2010
comment
@MKS - Вы действительно не можете, не проксируя его через свой собственный домен ... Запросы GET по своей сути открыты, гораздо больше, чем POST - person Nick Craver; 22.12.2010
comment
Спасибо @NICK, не могли бы вы предложить, безопасно ли использовать GET вместо POST, какие могут быть недостатки использования GET .. пожалуйста, предложите - person Manoj Singh; 22.12.2010
comment
@ T.J. - ну, с SSL это может быть значительно более безопасным, хотя, если ваша полезная нагрузка находится в POST, а не в URL-адресе, это было больше, к чему я стремился. - person Nick Craver; 22.12.2010
comment
@MKS - Если вы делаете что-то безопасное, используйте для начала SSL. В отсутствие этого нужны ли данные странице? хакерское <iframe> решение может быть единственным вариантом. - person Nick Craver; 22.12.2010
comment
Спасибо, @Nick, не могли бы вы предложить какой-нибудь пример, где для этого используется IFRAME! - person Manoj Singh; 22.12.2010
comment
@MKS - Я бы задал отдельный вопрос по этому поводу ... в комментариях будет очень грязно, и мне очень скоро придется проехать 100 миль на работу ... некоторые другие могут помочь еще долго. Сначала посмотрите, есть ли еще вопрос по этому поводу, например, междоменная публикация с помощью iframe. - person Nick Craver; 22.12.2010
comment
Спасибо, я пробовал эту невозможность около 8 часов ... Это объяснило бы все причины косяков. - person Érik Desjardins; 03.04.2012
comment
Представление о том, что GET-запросы через SSL менее безопасны, чем POST-запросы при передаче, неверно. Информация об URL, такая как путь, строка запроса и т. Д., Зашифрована как часть HTTP-запроса. Строку вашего запроса невозможно прослушать на уровне пакета. Однако есть и другие проблемы, как указано в ответе на этот вопрос SO - person Sean; 11.01.2013

Используйте json в dataType и отправьте так:

    $.ajax({
        url: "your url which return json",
        type: "POST",
        crossDomain: true,
        data: data,
        dataType: "json",
        success:function(result){
            alert(JSON.stringify(result));
        },
        error:function(xhr,status,error){
            alert(status);
        }
    });

и поместите эти строки в файл на стороне сервера:

если PHP:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: POST');
header('Access-Control-Max-Age: 1000');

если java:

response.addHeader( "Access-Control-Allow-Origin", "*" ); 
response.addHeader( "Access-Control-Allow-Methods", "POST" ); 
response.addHeader( "Access-Control-Max-Age", "1000" );
person Pratik Butani    schedule 18.07.2013
comment
Другой ответ объясняет причину этого кода: stackoverflow.com/a/4528304/102960 - person igorsantos07; 22.11.2013
comment
@PratikButani отличный ответ. - person Muhammad; 11.12.2013
comment
Существуют ли какие-либо потенциальные последствия для безопасности (например, CSRF) в разрешении любому стороннему сайту инициировать вызовы AJAX к приложению вашего сайта с помощью этих настроек заголовка ответа? - person Jon Schneider; 03.01.2014
comment
У меня это не сработало при использовании Chrome v.36.0.1985.125. Я получил стандартную ошибку - нет заголовка Access-Control-Allow-Origin, хотя он у меня есть в PHP и я вижу его под заголовками в полученном файле на вкладке сети. Тот же самый запрос работает при использовании GET. Я пробовал несколько вариантов перестановок, поэтому, если вы хотите использовать этот ответ, меня беспокоит то, что он может работать не во всех браузерах. - person Luke; 11.08.2014
comment
Обратите внимание, что отчасти jsonp позволяет браузеру отправлять файлы cookie. Код в том виде, как он здесь, этого не сделает. Для этого вам, возможно, придется включить учетные данные в соответствии с этим документом: developer.mozilla.org/en-US/docs/Web/HTTP/ - person ragamufin; 07.10.2014
comment
что, если мы используем ASP.NET c #? Серьезно, я застрял на этом шаге целую вечность, я не могу его пройти и вот-вот сойду с ума! :) - person ; 07.05.2015

Современные браузеры допускают междоменные запросы AJAX, это называется Cross-Origin Resource Sharing (см. Также < href = "https://developer.mozilla.org/En/HTTP_Access_Control" rel = "noreferrer"> этот документ для более короткого и практического введения), а последние версии jQuery поддерживают его прямо из коробки. ; вам нужна относительно последняя версия браузера (FF3.5 +, IE8 +, Safari 4+, Chrome4 +; Opera не поддерживает AFAIK).

person Tgr    schedule 24.12.2010
comment
И, чтобы придираться, JSONP - это не AJAX. - person Tgr; 24.12.2010
comment
На самом деле я бы немного придирался и сказал, что JSONP - это не XMLHttpRequest, а AJAX. В любом случае AJAX плохо определен, поскольку он не будет строго охватывать получение JSON, а не XML, или синхронную выборку. Итак, учитывая, что AJAX используется более широко, чем он уже определен, плюс тот факт, что JSONP в основном используется с асинхронным Javascript, я совершенно счастлив, что AJAX также охватывает JSNOP. - person hippietrail; 22.12.2011
comment
Важным моментом здесь, кажется, является установка HTTP-заголовка Access-Control-Allow-Origin: * или чего-то подобного. (Вы можете указать индивидуальное разрешенное происхождение) - person jocull; 22.05.2012
comment
Но вы по-прежнему [условно] ограничены использованием только GET, а не POST, с запросами JSONP, верно? То есть мне не хватает того, как этот ответ отвечает на вопрос ОП. Просто, если вам нужно использовать POST (что, вероятно, является настоящим вопросом здесь), у вас есть другие варианты, кроме JSONP? - person ruffin; 08.11.2013
comment
Если вам, как и мне, интересно, как это реализовать, поищите другой ответ в том же вопросе: stackoverflow.com/a/17722058 / 102960 - person igorsantos07; 22.11.2013

JsonP работает только с типом: GET,

Дополнительная информация (PHP) http://www.fbloggs.com/2010/07/09/how-to-access-cross-domain-data-with-ajax-using-jsonp-jquery-and-php/

.NET: http://www.west-wind.com/weblog/posts/2007/Jul/04/JSONP-for-crosssite-Callbacks

person jesramgue    schedule 07.05.2013

Если вы просто хотите выполнить POST формы на своем собственном сайте, используя $.ajax() (например, для имитации опыта AJAX), вы можете использовать Плагин jQuery Form. Однако, если вам нужно выполнить POST формы в другом домене или в своем собственном домене, но с использованием другого протокола (незащищенная http: публикация страницы на защищенную https: страницу), тогда вы столкнетесь с междоменным скриптингом. ограничения, которые вы не сможете устранить с помощью одного лишь jQuery (подробнее). В таких случаях вам нужно использовать главное оружие: YQL. Проще говоря, YQL - это язык веб-парсинга с синтаксисом, подобным SQL, который позволяет запрашивать весь Интернет как одну большую таблицу. В нынешнем виде, по моему скромному мнению, YQL - единственный [простой] путь, если вы хотите выполнять междоменные POST-сообщения с использованием клиентского JavaScript.

В частности, вам необходимо использовать таблицу открытых данных YQL. содержащий блок Execute, чтобы это произошло. Подробное описание того, как это сделать, можно найти в статье "Очистка документов HTML, требующих данных POST, с помощью YQL". К счастью для нас, гуру YQL Кристиан Хейльманн уже создал таблицу открытых данных. который обрабатывает данные POST. Вы можете поиграть с таблицей "htmlpost" Кристиана в YQL Console. Вот разбивка синтаксиса YQL:

  • select * - выбрать все столбцы, аналогично SQL, но в этом случае столбцы являются элементами XML или объектами JSON, возвращаемыми запросом. В контексте очистки веб-страниц эти «столбцы» обычно соответствуют элементам HTML, поэтому, если вы хотите получить только заголовок страницы, вы должны использовать select head.title.
  • from htmlpost - какую таблицу запрашивать; в этом случае используйте таблицу открытых данных «htmlpost» (вы можете использовать свою собственную таблицу, если она вам не подходит).
  • url="..." - action URI формы.
  • postdata="..." - сериализованные данные формы.
  • xpath="..." - XPath узлов, которые вы хотите включить в ответ. Это действует как механизм фильтрации, поэтому, если вы хотите включить только теги <p>, вы должны использовать xpath="//p"; чтобы включить все, что вы бы использовали xpath="//*".

Нажмите «Тест», чтобы выполнить YQL-запрос. Если вы довольны результатами, обязательно (1) нажмите «JSON», чтобы установить формат ответа JSON, и (2) снимите флажок «Диагностика», чтобы минимизировать размер полезной нагрузки JSON путем удаления посторонней диагностической информации. Самый важный бит - это URL-адрес внизу страницы - это URL-адрес, который вы бы использовали в выражении $.ajax().

Здесь я собираюсь показать вам точные шаги для выполнения междоменной формы POST через запрос YQL, используя этот образец формы:

<form id="form-post" action="https://www.example.com/add/member" method="post">
  <input type="text" name="firstname">
  <input type="text" name="lastname">
  <button type="button" onclick="doSubmit()">Add Member</button>
</form>

Ваш JavaScript будет выглядеть так:

function doSubmit() {
  $.ajax({
    url: '//query.yahooapis.com/v1/public/yql?q=select%20*%20from%20htmlpost%20where%0Aurl%3D%22' +
         encodeURIComponent($('#form-post').attr('action')) + '%22%20%0Aand%20postdata%3D%22' +
         encodeURIComponent($('#form-post').serialize()) +
         '%22%20and%20xpath%3D%22%2F%2F*%22&format=json&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=',
    dataType: 'json', /* Optional - jQuery autodetects this by default */
    success: function(response) {
      console.log(response);
    }
  });
}

Строка url - это URL-адрес запроса, скопированный из консоли YQL, за исключением закодированного action URI формы и динамически вставленных сериализованных входных данных.

ПРИМЕЧАНИЕ. Помните о последствиях для безопасности при передаче конфиденциальной информации через Интернет. Убедитесь, что страница, с которой вы отправляете конфиденциальную информацию, безопасна (https:) и с использованием TLS 1.x вместо SSL 3.0.

person thdoan    schedule 20.04.2015

Вот JSONP, который я написал, чтобы поделиться со всеми:

страница для отправки запроса
http://c64.tw/r20/eqDiv/fr64.html

пожалуйста, сохраните srec ниже в .html youself
c64.tw/r20/eqDiv/src/fr64.txt
соответствующую страницу, пожалуйста, сохраните srec ниже в .jsp самостоятельно
c64. tw / r20 / eqDiv / src / doFr64.txt

или встроили код на свою страницу:

function callbackForJsonp (resp) {

var elemDivResp = $("#idForDivResp");
elemDivResp.empty();

try {

    elemDivResp.html($("#idForF1").val() + " + " + $("#idForF2").val() + "<br/>");
    elemDivResp.append(" = " + resp.ans + "<br/>");
    elemDivResp.append(" = " + resp.ans2 + "<br/>");

} catch (e) {

    alert("callbackForJsonp=" + e);

}

}

$ (документ) .ready (функция () {

var testUrl = "http://c64.tw/r20/eqDiv/doFr64.jsp?callback=?";

$(document.body).prepend("post to " + testUrl + "<br/><br/>");

$("#idForBtnToGo").click(function() {

    $.ajax({

        url : testUrl,
        type : "POST",

        data : {
            f1 : $("#idForF1").val(),
            f2 : $("#idForF2").val(),
            op : "add"
        },

        dataType : "jsonp",
        crossDomain : true,
        //jsonpCallback : "callbackForJsonp",
        success : callbackForJsonp,

        //success : function(resp) {

        //console.log("Yes, you success");
        //callbackForJsonp(resp);

        //},

        error : function(XMLHttpRequest, status, err) {

            console.log(XMLHttpRequest.status + "\n" + err);
            //alert(XMLHttpRequest.status + "\n" + err);

        }

    });

});

});

person user7420965    schedule 15.01.2017
comment
Я попробовал это, и все данные были получены как параметры $ _GET на сервере (php) - person Dika; 12.09.2017
comment
ну, я исправил ссылку url (c64.tw/r20/eqDiv/fr64.html), затем попробуйте еще раз. Спасибо - person user7420965; 13.09.2017