Question

我有一个显示一些文章的应用程序。该应用程序在localhost中的Wamp上完美运行。我已将数据库管理上传到其他服务器。我已经在JSONP中配置了我的ArticleStore.js但是当我运行我的应用程序时，控制台中出现以下错误：

Resource interpreted as Script but transferred with MIME type text/html: "http://[ip_address]:[port]/totos?_dc=1372152920457&keyword=&page=1&start=0&limit=25&callback=Ext.data.JsonP.callback1"

和：

Uncaught SyntaxError: Unexpected token :                                 totos:1

当我在上面的网址上点击时，我被重定向到显示以下内容的视图：

{"articles_list":[{"id":"28","title":"Prixtel dope son service client avec le forfait Sumo"}],"total":1}

为了简单起见，我测试了只显示一篇文章的标题。当我在'totos：1'上单击时，这是第1行的JSON响应：

{"articles_list":[{"id":"28","title":"Prixtel dope son service client avec le forfait Sumo"}],"total":1}

这是我的ArticleStore.js内容：

Ext.define("MyApp.store.ArticleListStore",
{
    extend: "Ext.data.Store",    
    requires: ["MyApp.model.ArticleModel","Ext.data.proxy.JsonP"],
    config: {
    model: "MyApp.model.ArticleModel",
    proxy: {
        type: 'jsonp',
        model: "MyApp.model.ArticleModel",
        url: "http://62.23.96.124:81/totos",
        },
        reader: {
            type: "json",
            rootProperty: "articles_list",
            totalProperty: "total"
        },
    },
        autoLoad: true
    }
});

当我在本地主机上直接在Wamp服务器上启动我的resquest时，我的JSON响应具有相同的语法（JSON树架构是相同的）。这是一个例子：

{"articles_list":[{"id":"384","title":"Skype est disponible sur Windows Phone"}],"total":1}

我看不出两个回复之间有任何区别。但是，我有一个'意外的令牌'错误！正如您所看到的，两个节点的articles_list'和'total'在JSON树中具有相同的位置，用于这两个示例。我不明白为什么会出现语法错误。我真的迷路了。有人能帮帮我吗？非常感谢您的帮助。

Answer 1

您的服务器未正确格式化JSON-P的响应。 JSON-P本质上需要将您的响应嵌入到一个函数中，该函数由您的代理的callbackKey属性指定：

proxy: {
    type: 'jsonp',
    url : "http://62.23.96.124:81/totos",
    callbackKey: 'myCallbackKey'
}

然后，在您的服务器上，您需要使用该参数来包装您的响应：

myCallbackKey({
    "articles_list": [
        {
            "id":"28",
            "title":"Prixtel dope son service client avec le forfait Sumo"
        }
    ],
    "total":1
})

您可以在此处的文档中了解有关此内容的更多信息：http://docs.sencha.com/touch/2.2.1/#!/api/Ext.data.proxy.JsonP。您还想了解更多有关JSON-P的用途及其工作原理的信息。点击此处了解更多信息：What is JSONP all about?

使用Sencha Touch 2无法跨域请求

1 个答案: