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