JSONP not working on ExtJS 4 - Uncaught TypeError: Cannot call method 'substring' of undefined

做~自己de王妃 提交于 2019-12-11 07:13:59

问题


I'm stuck with this code, I'm getting this json formated data from the Youtube API, if I use type:'json' it will fail, because of that cross domain thing but the other elements loads anyway; then, if I change type: to 'jsonp' (which is the syntax described on the ExtJS API) it would give me this error:"Uncaught TypeError: Cannot call method 'substring' of undefined" I tried setting type:'anyotherstupidthing' and the same happens, so what could be happening?

Here are my current data model and my store:

Ext.define('Video', {
    extend: 'Ext.data.Model',
    fields: ['id', 'title']
});

myStore2 = Ext.create('Ext.data.Store', {
    model: 'Video',
    proxy: {
        type: 'ajax',
        url : 'http://gdata.youtube.com/feeds/api/videos?q=surfing&v=2&alt=jsonc',
        reader: {
            type: 'jsonp',
            root: 'items'
        }
    }
});

Thanks in advance! Ed.


回答1:


JsonP requires the server to wrap the returned data in a JS function call. The common contract is to pass a parameter named 'callback' to the server to allow for unique names and avoid name clashes on the client.

Calling the URL http://gdata.youtube.com/feeds/api/videos?q=surfing&v=2&alt=jsonc&callback=myCallback in the browser shows that YouTube support this convention:

Ext supports JsonP via the Ext.data.proxy.JsonP proxy class. The reader is a standard JSON reader and not JsonP specific, you only need to account for the data structure returned from the server (set root to data.items).

The working code looks like this:

var myStore2 = Ext.create('Ext.data.Store', {
    model: 'Video',
    proxy: {
        type: 'jsonp',
        url : 'http://gdata.youtube.com/feeds/api/videos?q=surfing&v=2&alt=jsonc',
        reader: {
            type: 'json',
            root: 'data.items'
        }
    },
    listeners: {
        load: function(store, records) {
            Ext.each(records, function(rec) {
                console.log(rec.get('title'));
            });
        }
    },
    autoLoad: true
});


来源:https://stackoverflow.com/questions/7494450/jsonp-not-working-on-extjs-4-uncaught-typeerror-cannot-call-method-substring

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!