MooTools JSONP Неверный ярлык - PullRequest
Новая
       20

MooTools JSONP Неверный ярлык

1 голос
/ 12 октября 2011

Удивившись, чтобы мои данные отображались на странице, продолжайте зацикливаться на ошибке «Неверная метка»

Current.js (MooTools) 

    new Request.JSONP({
        method: 'post',
        url: 'https://somesite.com?needwhat=58b0e',
        evalScripts:false,
        evalResponse:false,
        onSuccess:function(responseTree, responseElements, responseHTML, responseJavaScript)
        {
            $('#gallery').set('html',responseHTML);
            eval(responseJavaScript);
        }
    }).send();

А что я пытаюсь получить с сервера 

    {
     "id": "58b0e",
     "items": [
    {
        "title": "Some Title..."
    }
   ]}

1 Ответ

2 голосов
/ 12 октября 2011

правый. Я помню, что сначала было трудно разобраться с JSONP, поэтому я постараюсь объяснить это как можно лучше и таким образом, чтобы это могло быть полезно и другим ...

Прежде чем вы поймете ошибку, вам необходимо рассмотреть принципиальное различие между классами mootools Request.JSON и Request.JSONP.

Несмотря на то, что вы можете считать их одинаковыми с небольшим различием в политике одного источника, удаляемой из JSONP, они совсем не похожи, и единственное, что они разделяют: они оба возвращают объект и совместно используют одно пространство имен (Request).

Кроме этого, они не могли быть более разными. Request.JSONP расширяет класс XHR по умолчанию (Request), поскольку может выполняться только в пределах того же домена / субдомена и протокола происхождения. Он будет ожидать, что сервер вернет обратно строку JSON, которую он может проанализировать / обработать и преобразовать в объект.

Переданная строка будет похожа на ту, которую вы послали, или более сложную, что угодно. Основные вещи.

При сбое XHR происходит выборка данных из в другом месте . Один из единственных способов импортировать данные из другого домена - через JavaScript. Нет никаких ограничений на происхождение источника скрипта. Проблема для JSONP от сервера к клиенту заключается в том, что ему необходимо передать определенные данные обратно в функцию и область вызываемого абонента (в данном случае, Request.JSONP). Встраивание скрипта недостаточно, необходимо передать данные.

По сути, JSONP работает посредством определения функции в глобальной области видимости, например:

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

Затем он обычно запрашивает у удаленного конца «обернуть» данные в функцию, называемую mycallback, что вы часто будете видеть во всех без исключения API для сервисов JSONP.

Тогда скрипт для встраивания выглядит (например):

http://api.twitter.com/1/users/show/shitmydadsays.json?callback=mycallback

Твиттер создаст файл с таким содержанием: 

mycallback({"listed_count":56509,"profile_background_image_url":"http:\/\/a1.twimg.com\/profile_background_images\/150162853\/desk-final.jpg","protected":false,"profile_link_color":"0084B4","name":"Justin","following":false,"followers_count":2743626,"id_str":"62581962","notifications":false,"utc_offset":-28800,"profile_background_color":"9AE4E8","description":"I'm 29. I live with my 74-year-old dad. He is awesome. I just write down shit that he says","default_profile_image":false,"statuses_count":144,"verified":false,"profile_background_tile":false,"profile_background_image_url_https":"https:\/\/si0.twimg.com\/profile_background_images\/150162853\/desk-final.jpg","favourites_count":0,"location":"","show_all_inline_media":false,"contributors_enabled":false,"profile_sidebar_fill_color":"DDFFCC","screen_name":"shitmydadsays","status":{"retweeted":false,"in_reply_to_status_id_str":null,"in_reply_to_user_id":null,"in_reply_to_user_id_str":null,"id_str":"114026815026249728","contributors":null,"in_reply_to_status_id":null,"favorited":false,"truncated":false,"source":"web","place":null,"geo":null,"retweet_count":"100+","in_reply_to_screen_name":null,"id":114026815026249728,"coordinates":null,"text":"\"Bullshit. Don't pretend you don't care about your birthday. It's like watching a hooker pretend she's out for a walk when cops drive by.\"","created_at":"Wed Sep 14 17:24:45 +0000 2011"},"is_translator":false,"url":"http:\/\/www.twitter.com\/justin_halpern","default_profile":false,"follow_request_sent":false,"time_zone":"Pacific Time (US & Canada)","friends_count":1,"profile_sidebar_border_color":"BDDCAD","profile_image_url_https":"https:\/\/si0.twimg.com\/profile_images\/362705903\/dad_normal.jpg","lang":"en","geo_enabled":false,"profile_use_background_image":true,"profile_image_url":"http:\/\/a0.twimg.com\/profile_images\/362705903\/dad_normal.jpg","id":62581962,"created_at":"Mon Aug 03 18:20:34 +0000 2009","profile_text_color":"333333"});

на самом деле это ваш объект данных, переданный в качестве аргумента вашей функции myfunction.

Первым аргументом myfunction является ваш JSON-объект.

Mootools Request.JSONP имеет дело с отображением запроса и т. Д., Но ему нужен удаленный конец, чтобы иметь возможность работать с параметром callback = и обернуть все данные в нем. Если это не поддерживает, удаленный сервис НЕ подходит для JSONP.

При использовании Request.JSONP приведенный выше URL-адрес фактически автоматически будет выглядеть следующим образом:

http://api.twitter.com/1/users/show/shitmydadsays.json?callback=Request.JSONP.request_map.request_0

MooTools отобразит функцию listener в объект Request.JSONP.request_map, но вы также можете переопределить обратный вызов локально и удаленно.

Если вы просто попытаетесь запустить этот код, вы получите ту же ошибку: 

{
    "foo": "bar"
}

Сам по себе это недопустимый javascript и вызовет SyntaxError: invalid label. Получи фанк фанк!

...