Полная Версия: jsonp jquery пример
Здравствуйте, не могу никак найти нормальный пример по jsonp jquery... как просто работать с json это понятно, а вот как еще прикручивается функция обратного вызова
"Функция обратного вызова" - это ты про аякс?
_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL
* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.
* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)
_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL
* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.
* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)
sergeiss, да
sergeiss, никак не въеду как работает эта функция обратного вызова, я иммею ввиду jquery,,, ее надо прописывать, или этот калбек только идентификатор дает,,,и в ответе от сервера он должен быть
mmsgold
Что именно не понятно?
Функция обратного вызова может указываься вручную, либо, если ты не указал ее явно, то она прикрутится автоматом.
js
http://www.site.com/script.php
Важно! при отправке из скрипта-обработчика отсылаеть хеадер Content-Type: application/javascript, т.к. jsonp - это не json, а чистый JavaScript код.
_____________
[продано копирайтерам]
Что именно не понятно?
Функция обратного вызова может указываься вручную, либо, если ты не указал ее явно, то она прикрутится автоматом.
js
$.ajax({
type: "get",
url: 'http://www.site.com/script.php',
dataType: "jsonp",
error: function ()
{
console.log('Error Ajax');
},
success: function(data)
{
console.log(data);
},
complete: function()
{
console.log('Complet Ajax');
}
});
http://www.site.com/script.php
$data = array('bla', 'bla', 'bla');
header('Content-Type: application/javascript');
echo (isset($_GET['callback']) ? $_GET['callback'] : '').'(' . json_encode($data) . ')';
Важно! при отправке из скрипта-обработчика отсылаеть хеадер Content-Type: application/javascript, т.к. jsonp - это не json, а чистый JavaScript код.
_____________
[продано копирайтерам]
| Цитата |
| Важно! при отправке из скрипта-обработчика отсылаеть хеадер Content-Type: application/javascript, т.к. jsonp - это не json, а чистый JavaScript код. |
Интересно,,а в документации не слова, разве dataType: "jsonp" не хватит для этого?
echo (isset($_GET['callback']) ? $_GET['callback'] : '').'(' . json_encode($data) . ')';
и зачем здесь в случае ложь выводится пустая строка... не вижу смысла...и самое главное, а где callback ?... функция обратного вызова?
mmsgold
| Цитата |
| разве dataType: "jsonp" не хватит для этого? |
dataType: "jsonp" - Это ты указываешь в javascript файле в каком виде отправлять данные.
Content-Type: application/javascript - это mime-type ответа php скрипта. Т.е. в каком виде скрипт должен ответить.
Это физически два разных файла. Яваскрипт спросил, php ответил. Они должны "разговаривать" на понятном друг-другу языке.
| Цитата |
| и зачем здесь в случае ложь выводится пустая строка. |
php скрипт должен коректно отработать в любом случае. Хоть война!
Если ему не будет передан параметр $_GET['callback'], то без этого условия он вывалит тебе Warnung, а оно нам не нужно. Обработка ошибок, так сказать.
| Цитата |
| .и самое главное, а где callback ?... функция обратного вызова? |
jQuery автоматом подставляет идентификатор этой функции в url вызова. Это будет идентификатор функции success.
Посмотри в консоли, какой url вызывается.
Явно нужно указывать колбак фукцию только в том случае, если ты ответ хочешь ловить не в success, а в другой функции.
_____________
[продано копирайтерам]
| Цитата |
| dataType: "jsonp" - Это ты указываешь в javascript файле в каком виде отправлять данные. Content-Type: application/javascript - это mime-type ответа php скрипта. Т.е. в каком виде скрипт должен ответить. Это физически два разных файла. Яваскрипт спросил, php ответил. Они должны "разговаривать" на понятном друг-другу языке. |
не согласен,,, сделал пример, отправил данные скрипту джейсоном, ответил текстом,,, ответ не прошел,,, когда отправлял тектом,,, ответ проходил... я так понимаю браузер ожидает ответа именно в том типе в котором мы указываем dataType: "jsonp"
| Цитата |
| Явно нужно указывать колбак фукцию только в том случае, если ты ответ хочешь ловить не в success, а в другой функции. |
вот бы увидеть пример и пояснение,,,) вот это как раз для меня как то туманно,,,и вообще этот вопрос заслуживает отдельного семинара я думаю...
mmsgold
нуу... мало ли, с чем ты не согласен :) Разработчикам javascript и php это фиолетово :) ссори :)
Пример показывай, чего о порожнем рассуждать.
нуу... мало ли, с чем ты не согласен :) Разработчикам javascript и php это фиолетово :) ссори :)
Пример показывай, чего о порожнем рассуждать.
| Цитата |
| вот бы увидеть пример и пояснение,,,) вот это как раз для меня как то туманно,,,и вообще этот вопрос заслуживает отдельного семинара я думаю... |
$.ajax({
url: 'http://www.domain.com/script.php?callback=?',
type: "GET",
dataType: "jsonp",
jsonpCallback: "localJsonpCallback"
});
function localJsonpCallback(json) {
console.log(json);
}
_____________
[продано копирайтерам]
jsonpCallback: "localJsonpCallback"
занчит так мы называем функцию обработки куда передадутся json данные,..
обязательно в таком случае это прописывать
callback=?',,, я так понимаю что наверное да,...
ну и сама функция конечно далее...
function localJsonpCallback(json) {
console.log(json);
}...идентификатор так же надо будет возвращать?,,, и именно гетом там его выводить? постом не работает?
AllesKlar
, а вот примеры
index.php
и ajax.php
, а вот примеры
index.php
<?php
header("Content-Type: text/html; charset=utf-8");
header('Cache-Control: no-store, no-cache, must-revalidate, max-age=0');
// здесь мы ставим кодровку utf - 8 , так как ajax работает корректно и менно в этой кодировке
// это связанно с использование в передаче данных JSON, это такой формат
?>
<html>
<head>
<title></title>
<!-- здесь мы подключаем jquery -->
<script src="../jq/jquery-2.1.0.min.js"></script>
<!-- здесь наша функция -->
<script type="text/javascript">
function runajax()
{
if($("#e-mail").val() == "" || $("#textarea").val() == "")
{
$("p").append("<strong>Данные в поля не введены!</strong>");
}
else
{
var mail = $("#e-mail").val();
var textarea = $("#textarea").val();
$.ajax({
dataType:"json",
type:"POST",
data: "mail="+mail+"&textarea="+textarea,
url: "http://ajax.ru/1text/ajax.php",
success: function(data,status){
alert(data);
alert(status);
}
})
}
}
$(document).ready(function(){
$("#button").click(runajax);
})
</script>
</head>
<body>
<p></p>
<!-- html форма -->
<div>
<div>
<label for="name"><strong>Ваше e-mail:</strong></label>
<input type="text" name="e-mail" id="e-mail" class="" placeholder="введите ваш e-mail" />
</div>
<div>
<label for="phone"><strong>Ваш вопрос:</strong></label>
<textarea rows="10" cols="45" id="textarea"></textarea>
</div>
</br>
<input type="button" value="Отправить" id="button" class="submit" />
</div>
</body>
</html>
и ajax.php
<?php
header("Content-Type: text/html; charset=utf-8");
header('Cache-Control: no-store, no-cache, must-revalidate, max-age=0');
$mail = $_POST['mail'];
$textarea = $_POST['textarea'];
// mail("mmsgold@yandex.ru", "My Subject", "$mail\n$textarea\nLine 3");
echo "Привет, Мир!!!";
Здесь расположена полная версия этой страницы.