Как использовать тип: "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();
}
});
приведенный выше код работает нормально, я просто хочу отправить запрос в виде "должность" вместо "GET", пожалуйста, предложите, как я могу этого достичь.
спасибо
6 ответов:
вы не можете опубликовать с помощью JSONP...it просто не работает таким образом, он создает
<script>
элемент для выборки данных...который и в GET запрос. Там не так много вы можете сделать, кроме размещения на свой собственный домен в качестве прокси-сервера, который публикует на другой...но пользователь не сможет сделать это напрямую и увидеть ответ, хотя.
использовать
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" );
современные браузеры позволяют междоменные AJAX-запросы, это называется Совместное Использование Ресурсов Из Разных Источников (см. Также документ для более короткого и более практического введения), а последние версии jQuery поддерживают его из коробки; вам нужна относительно недавняя версия браузера (FF3.5+, IE8+, Safari 4+, Chrome4+; нет поддержки Opera AFAIK).
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
если вы просто хотите сделать сообщение формы на свой собственный сайт с помощью
$.ajax()
(например, для эмуляции опыта AJAX), то вы можете использовать jQuery Form Plugin. Однако, если вам нужно сделать запись формы в другой домен или в свой собственный домен, но с использованием другого протокола (небезопасныйhttp:
размещение страницы в безопасномhttps:
страница), то вы столкнетесь с ограничениями междоменных сценариев, которые вы не сможете решить только с помощью jQuery (больше информация). В таких случаях вам нужно будет вывести большие пушки:YQL. Проще говоря, YQL-это язык веб-скребков с синтаксисом, подобным SQL, который позволяет вам запрашивать весь интернет как одну большую таблицу. В настоящее время, по моему скромному мнению, YQL-это единственный [простой] способ пойти, если вы хотите сделать междоменную публикацию формы с использованием клиентского JavaScript.более конкретно, вам нужно будет использовать YQL Открыть Таблицу Данных содержащий выполнить блок, чтобы это произошло. Для хорошего резюме о том, как это сделать, вы можете прочитать статью "выскабливание HTML-документов, требующих POST-данных с помощью YQL". К счастью для нас, гуру YQL Кристиан Хейльман уже создал открыть таблицу данных, которая обрабатывает данные POST. Вы можете поиграть с таблицей "htmlpost" Кристиана на консоль YQL. Вот разбивка синтаксиса YQL:
select *
- выбрать все столбцы похожи на SQL, но в этом случае столбцы являются элементами XML или объектами JSON, возвращаемыми запросом. В контексте очистки веб-страниц эти "столбцы" обычно соответствуют элементам HTML, поэтому, если вы хотите получить только заголовок страницы, вы должны использоватьselect head.title
.from htmlpost
- какую таблицу запрашивать; в этом случае используйте таблицу открытых данных "htmlpost" (вы можете использовать свою собственную таблицу, если она не соответствует вашим потребностям).url="..."
- формыaction
URI.postdata="..."
- сериализованные данные формы.xpath="..."
- the XPath узлы, которые вы хотите включить в ответ. Это действует как механизм фильтрации, так что если вы хотите включить только<p>
теги, то вы бы использовалиxpath="//p"
; включить все, что вы должны использоватьxpath="//*"
.Нажмите кнопку "Тест", чтобы выполнить запрос YQL. Как только вы будете довольны результатами, обязательно (1) Нажмите "JSON", чтобы установить ответ форматирование в JSON и (2) снимите флажок "диагностика", чтобы минимизировать размер полезной нагрузки JSON путем удаления посторонней диагностической информации. Самый важный бит-это URL в нижней части страницы - это URL, который вы будете использовать в
$.ajax()
заявление.здесь я собираюсь показать вам точные шаги, чтобы сделать междоменную форму сообщения через запрос 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); } }); }
The
url
строка-это URL-адрес запроса, скопированный с консоли YQL, за исключением закодированной формыaction
URI и сериализованные входные данные динамически вставляются.Примечание: пожалуйста, имейте в виду последствия для безопасности при передаче конфиденциальной информации через интернет. Убедитесь, что страница, с которой вы отправляете конфиденциальную информацию, защищена (
https:
) и использование TLS 1.x вместо SSL 3.0.
вот JSONP, который я написал, чтобы поделиться со всеми:
страница для отправки req
http://c64.tw/r20/eqDiv/fr64.htmlпожалуйста, сохраните srec ниже .html youself
c64.tw/r20/eqDiv/src/fr64.txt
страница для resp, пожалуйста, сохраните srec ниже .ССП сами
c64.tw/r20/eqDiv/src/doFr64.txtили встроить код в вашу страницу:
функция 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); }
}
$(документ).готовые(функция() {
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); } }); });
});