文档章节

EmberJS中EmberData如何解析非默认格式的JSON数据

puras
 puras
发布于 2014/06/27 10:45
字数 678
阅读 103
收藏 0
点赞 0
评论 0

背景与问题

最近在使用EmberJS做为前端MVC框架来编写前端应用,但遇到了一个问题,EmberData要求的JSON格式默认为下面这样:

{
    "user":[
        {
            "name": "puras1",
            ......
        },
        {
            "name": "puras2",
            ......
        },
        {
            "name": "puras3",
            ......
        }
    ]
}

而我们后端返回的格式却与之不同,是下面这样的格式:

{    
    "errcode": 0,
    "message": "success",
    "ret": 0,
    "data": {
        "user":[
            {
                "name": "puras1",
                ......
            },
            {
                "name": "puras2",
                ......
            },
            {
                "name": "puras3",
                ......
            }
        ]
    }
}

通过DS.RESTAdapter来读取数据的话,是无法正常工作的。
想了三种办法来解决这个问题。

解决办法

主要思路是重写RESTAdapter中的ajax方法,Ajax方法如下:

ajax: function(url, type, hash) {
    var adapter = this;

    return new Ember.RSVP.Promise(function(resolve, reject) {
      hash = adapter.ajaxOptions(url, type, hash);

      hash.success = function(json) {
        Ember.run(null, resolve, json);
      };

      hash.error = function(jqXHR, textStatus, errorThrown) {
        Ember.run(null, reject, adapter.ajaxError(jqXHR));
      };

      Ember.$.ajax(hash);
    }, "DS: RestAdapter#ajax " + type + " to " + url);
  }

方法中,如果请求成功,则会调用hash.success方法,直接把JSON串传到了Ember.run方法中。由于我们后端返回的格式不同,我们想传JSON中指定的内容到Ember.run方法中。如下面解决方法中,根据传回的JSON串结构,使用json.data来替代原来的json。

方法一:继承RESTAdapter实现自己的Adapter

自定义一个Adapter,继承RESTAdapter,重写Ajax方法:

App.MKRESTAdapter = DS.RESTAdapter.extend({
    ajax: function(url, type, hash) {
        var adapter = this;
        return new Ember.RSVP.Promise(function(resolve, reject) {
            hash = adapter.ajaxOptions(url, type, hash);

            hash.success = function(json) {
                Ember.run(null, resolve, json.data);
            };
            hash.error = function(jqXHR, textStatus, errorThrown) {
                Ember.run(null, reject, adapter.ajaxError(jqXHR));
            };

            Ember.$.ajax(hash);
        }, "DS: RESTAdapter#ajax " + type + " to " + url);
    }
});

在使用的时候,用MKRESTAdapter来替代RESTAdapter:

//App.ApplicationAdapter = DS.RESTAdapter.extend();
// 修改成
App.ApplicationAdapter = App.MKRESTAdapter.extend();

缺点:需要多加载一个自定义的类。

方法二:通过reopen重写RESTAdapter的Ajax方法

不重新自定义Adapter,直接通过reopen来重写RESTAdapter:

DS.RESTAdapter.reopen({
    ajax: function(url, type, hash) {
        var adapter = this;
        return new Ember.RSVP.Promise(function(resolve, reject) {
            hash = adapter.ajaxOptions(url, type, hash);

            hash.success = function(json) {
                Ember.run(null, resolve, json.data);
            };
            hash.error = function(jqXHR, textStatus, errorThrown) {
                Ember.run(null, reject, adapter.ajaxError(jqXHR));
            };

            Ember.$.ajax(hash);
        }, "DS: RESTAdapter#ajax " + type + " to " + url);
    }
});

使用方式不变。

缺点:改变了RESTAdapter默认的处理方式,而且是全局模式的,在其他地方如果使用RESTAdapter可能会受到影响。

方法三:通过reopen重写ApplicationAdapter的Ajax方法

从使用角度上来讲,App.ApplicationAdapter也是继承了RESTAdapter,只不过是EmberJS有个默认的实现而已,我们可以使用方法一中的方式,来重写ajax方法:

App.ApplicationAdapter.reopen({    
    ajax: function(url, type, hash) {
        var adapter = this;
        return new Ember.RSVP.Promise(function(resolve, reject) {
            hash = adapter.ajaxOptions(url, type, hash);

            hash.success = function(json) {
                Ember.run(null, resolve, json.data);
            };
            hash.error = function(jqXHR, textStatus, errorThrown) {
                Ember.run(null, reject, adapter.ajaxError(jqXHR));
            };

            Ember.$.ajax(hash);
        }, "DS: RESTAdapter#ajax " + type + " to " + url);
    }
});

最后选择的是方法三,又实现了需求,又没有影响RESTAdapter默认的形为。

以上!

© 著作权归作者所有

共有 人打赏支持
puras
粉丝 47
博文 4
码字总数 1240
作品 0
沈阳
后端工程师
Ember.js如何与后端服务交互?adapter、store、ember data关系揭秘

文章来源:Ember Teach 本项目讲解如何使用adapter、EmberData以及怎么连接到本地数据库。 项目简介 主要内容 适配器使用 如何持久化数据到本地数据库 简单的后端服务 最近经常有初学的开发者...

ubuntuvim
2016/08/03
108
1
Ember版本小小结

原文地址:http://120.24.90.140:2368/ember-summer/ 不得不说Ember更新实在是太快了!!现在(2015-11-23)已经更新到2.2.0版本了。随着版本的升级很多旧版的特性会被声明为过是,甚至是弃用...

ubuntuvim
2016/01/25
75
0
MySQL · 专家投稿 · MySQL5.7 的 JSON 实现

介绍 本文将介绍 MySQL 5.7 中如何实现非结构化(JSON)数据的存储,在介绍 MySQL 5.7 的非结构化数据存储之前,首先介绍在之前的 MySQL 的版本中,用户如何通过 BLOB 实现 JSON 对象的存储,...

阿里云RDS-数据库内核组
2016/01/04
0
0
adapter与serializer使用示例一

文章来源:http://blog.ddlisting.com欢迎访问源网站Ember Teach,Ember Teach致力于为您提供最权威、最前沿的Ember技术教程。。 adapter与serializer相对来说是比较高级的内容。但是也是非常...

ubuntuvim
2016/06/08
34
0
日志服务支持Json类型数据

JSON数据作为一种通用类型的数据类型,其自解析、灵活的特性,使其能够很好满足复杂场景下数据的记录需求,在很多日志内容中格式不固定的部分往往都是以json的形式进行记录,如将一次http请求...

suntingtao
02/09
0
0
用原始方法解析复杂字符串,json一定要用JsonMapper么?

阅读目录 1.不规则非json字符串 2.键值对字符串分割函数 3.复杂Json格式的字符串 4.标准的json格式 5.总结 经常采集数据,肯定会碰到解析字符串,包括整个页面的html,或者json以及一些不标准...

老朱第八
2017/11/11
0
0
logstash配置文件常用参数

最近在折腾logstash,其处理流程不过于input、filter、output三个处理流程,以下是我翻译的几个常用的处理参数 output流之http output {http { }} codec: 数据类型,默认是“plain”,用来指...

China_OS
2013/12/07
0
0
使用Python Log Handler自动上传并解析KV格式的日志

概述 使用Python SDK提供的Log Handler可以实现每一条Python程序的日志在不落盘的情况下自动上传到日志服务上。与写到文件再通过各种方式上传比起来,有如下优势: 实时性:主动直接发送,不...

成喆
05/24
0
0
浅谈@RequestMapping @ResponseBody 和 @RequestBody 注解的用法与区别

1.@RequestMapping 国际惯例先介绍什么是@RequestMapping,@RequestMapping 是一个用来处理请求地址映射的注解,可用于类或方法上。用于类上,表示类中的所有响应请求的方法都是以该地址作为...

满风
05/15
0
0
[译]你应该了解的5个 Logstash Filter 插件

原文:5 Logstash Filter Plugins You Need to Know About 译者:neal1991 welcome to star my articles-translator , providing you advanced articles translation. Any suggestion, plea......

neal
2017/10/25
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

对基于深度神经网络的Auto Encoder用于异常检测的一些思考

一、前言 现实中,大部分数据都是无标签的,人和动物多数情况下都是通过无监督学习获取概念,故而无监督学习拥有广阔的业务场景。举几个场景:网络流量是正常流量还是攻击流量、视频中的人的...

冷血狂魔
7分钟前
0
0
并发设计之A系统调用B系统

A-->B A在发送请求之前,用乐观锁,减少对B的重复调用,这样一定程度上是幂等性。 比如A系统支付功能,要调用B系统进行支付操作,但是前端对"支付"按钮不进行控制,即用户会不断多次点击支付...

汉斯-冯-拉特
28分钟前
0
0
HTTP协议通信原理

了解HTTP HTTP(HyperText Transfer Protocol)是一套计算机通过网络进行通信的规则。计算机专家设计出HTTP,使HTTP客户(如Web浏览器)能够从HTTP服务器(Web服务器)请求信息和服务。 HTTP使用...

寰宇01
50分钟前
0
0
【Java动态性】之反射机制

一、Java反射机制简介

谢余峰
51分钟前
1
0
Centos 6.X 部署环境搭建

1.Linux学习笔记CentOS 6.5(一)--CentOS 6.5安装过程

IT追寻者
今天
0
0
博客即同步至腾讯云+社区声明

我的博客即将搬运同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=8vy9bsmadbko...

xiaoge2016
今天
1
0
大数据教程(3.1):Linux系统搭建网络YUM源服务器

博主在前面的2.5章节讲述了linux系统本地YUM服务器的搭建和httpd轻量级静态网站服务器的安装,本节博主将为大家分享内网环境中搭建自己的网络YUM服务器的全过程。如果大家对本地YUM服务器还不...

em_aaron
今天
1
0
蚂蚁技术专家:一篇文章带你学习分布式事务

小蚂蚁说: 分布式事务是企业集成中的一个技术难点,也是每一个分布式系统架构中都会涉及到的一个东西,特别是在这几年越来越火的微服务架构中,几乎可以说是无法避免,本文就围绕分布式事务...

Java大蜗牛
今天
1
0
新的Steam应用将拓展服务项目

导读 未来几周,Steam将推出两个免费的应用程序Steam Link和Steam Video。这两个应用程序都旨在拓展Steam平台的业务和便利性。 即将开放的Steam Link应用程序最先提供了Android测试版,它将允...

问题终结者
今天
0
0
golang 第三方包的使用总结

golang 第三方包的安装的方法: 1. go get 安装 $ go get github.com/gin-gonic/gin 注意:执行go get 命令需要先安装git命令,并配置git全局变量。 2. 源码包安装 由于国内网络问题,很多时...

科陆李明
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部