时间: 2019-12-03阅读: 109标签: axios
转自：http://gank.io/post/56e80c2c677659311bed9841?from=timeline&isappinstalled=0&nsukey=g1D1Y6PMp3BW%2B0%2F%2Butx4StSJxcUCTm4%2BN8T7LnPNCCeQEY1lzm6oKvXdbrlAD4E9T%2FB1quV75jJB7H9zjcRxTQ%3D%3D
根据在项目的使用，发现有以下问题需要优化：
withAxios导出的接口方法对象对编辑器来说是不透明的，所以代码提示功能缺失。同一个方法调用多次，如何保证组件总是获取到最后一次的返回信息。
前言
RxJava和Retrofit也火了一段时间了，不过最近一直在学习ReactNative和Node相关的姿势，一直没有时间研究这些新东西，最近有个项目准备写，打算先用Android写一个Demo出来，却发现Android的世界发生了天翻地覆的变化，EventBus和OKHttp啥的都不见了，RxJava和Retrofit是什么鬼？
好吧，到Github上耐着性子看过了RxJava和Retrofit的介绍和几个Demo，原来Android的大神Jake Wharton为Retrofit这个项目贡献了这么多的代码，没有道理不用了。
如果你对RxJava不熟悉请先看给 Android 开发者的 RxJava 详解这篇文章。
如果你对Retrofit不熟悉就先看Retrofit官网。
当然也有很多RxJava与Retrofit的文章，但是我觉得很多大家都很纠结的功能都没有被总结出来，所以才有了此篇文章。
欢迎大家拍砖。
接下来进入正文，我是从下面几个角度去思考RxJava与Retrofit结合的。
- RxJava如何与Retrofit结合
- 相同格式的Http请求数据该如何封装
- 相同格式的Http请求数据统一进行预处理
- 如何取消一个Http请求 -- 观察者之间的对决，Oberver VS Subscriber
- 一个需要ProgressDialog的Subscriber该有的样子
根据以上问题，采用了以下解决方案：
1.RxJava如何与Retrofit结合
使用typescript的泛型解决。调用同一个方法时，取消掉上次未完成的请求，这里使用axios的cancel方法。实现思路是在返回的方法对象中增加一个`${name}Cancel`的方法，保存取消上一次方法的回调，下次请求时固定调用这个取消方法以保证本次请求是当前唯一一个请求。(这里只提供axios层面的解决办法，不讨论其他办法，比如采用redux-saga的话可以使用takeLatest解决)
1.1 基本页面
先扔出build.gradle文件的内容
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.2.0'
compile 'io.reactivex:rxjava:1.1.0'
compile 'io.reactivex:rxandroid:1.1.0'
compile 'com.squareup.retrofit2:retrofit:2.0.0-beta4'
compile 'com.squareup.retrofit2:converter-gson:2.0.0-beta4'
compile 'com.squareup.retrofit2:adapter-rxjava:2.0.0-beta4'
compile 'com.google.code.gson:gson:2.6.2'
compile 'com.jakewharton:butterknife:7.0.1'
}
也就是说本文是基于RxJava1.1.0和Retrofit 2.0.0-beta4来进行的。 添加rxandroid是因为rxjava中的线程问题。
下面先搭建一个基本的页面，页面很简单，先来看文件目录结构
activity_main.xml的代码如下：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".activity.MainActivity">
<Button
android:id="@+id/click_me_BN"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:padding="5dp"
android:text="点我"
android:textSize="16sp"/>
<TextView
android:id="@+id/result_TV"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@id/click_me_BN"
android:text="Hello World!"
android:textSize="16sp"/>
</RelativeLayout>
MainActivity.java的代码如下：
package com.queen.rxjavaretrofitdemo.activity;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.widget.Button;
import android.widget.TextView;
import com.queen.rxjavaretrofitdemo.R;
import butterknife.Bind;
import butterknife.ButterKnife;
import butterknife.OnClick;
public class MainActivity extends AppCompatActivity {
@Bind(R.id.click_me_BN)
Button clickMeBN;
@Bind(R.id.result_TV)
TextView resultTV;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ButterKnife.bind(this);
}
@OnClick(R.id.click_me_BN)
public void onClick() {
getMovie();
}
//进行网络请求
private void getMovie(){
}
}
注意不要忘记加网络权限
<uses-permission android:name="android.permission.INTERNET"/>
通过代码展示一下（React项目）：
1.2 只用Retrofit
我们准备在getMovie方法中进行网络请求，我们先来看看只使用Retrofit是如何进行的。
我们使用豆瓣电影的Top250做测试连接，目标地址为
至于返回的数据格式，大家自己访问下链接就看到了，太长就不放进来了。
首先我们要根据返回的结果封装一个Entity，暂命名为MovieEntity，代码就不贴了。
接下来我们要创建一个接口取名为MovieService，代码如下：
public interface MovieService {
@GET("top250")
Call<MovieEntity> getTopMovie(@Query("start") int start, @Query("count") int count);
}
回到MainActivity之中，我们来写getMovie方法的代码
//进行网络请求
private void getMovie(){
String baseUrl = "https://api.douban.com/v2/movie/";
Retrofit retrofit = new Retrofit.Builder()
.baseUrl(baseUrl)
.addConverterFactory(GsonConverterFactory.create())
.build();
MovieService movieService = retrofit.create(MovieService.class);
Call<MovieEntity> call = movieService.getTopMovie(0, 10);
call.enqueue(new Callback<MovieEntity>() {
@Override
public void onResponse(Call<MovieEntity> call, Response<MovieEntity> response) {
resultTV.setText(response.body().toString());
}
@Override
public void onFailure(Call<MovieEntity> call, Throwable t) {
resultTV.setText(t.getMessage());
}
});
}
以上为没有经过封装的、原生态的Retrofit写网络请求的代码。 我们可以封装创建Retrofit和service部分的代码，然后Activity用创建一个Callback作为参数给Call，这样Activity中只关注请求的结果，而且Call有cancel方法可以取消一个请求，好像没Rxjava什么事了，我觉得可以写到这就下班了~
接下来我们要面对的问题是这样的 如果我的Http返回数据是一个统一的格式，例如
{
"resultCode": 0,
"resultMessage": "成功",
"data": {}
}
我们如何对返回结果进行一个统一的处理呢？
另外，我的ProgressDialog的show方法应该在哪调用呢？看样子只能在getMovie()这个方法里面调用了，换个地方发出请求就要在对应的Listener里面写一遍show()的代码，其实挺闹心。
而且错误请求我也想集中处理掉不要贴重复的代码。
我们先来看结合了Rxjava之后，事情有没有变化的可能。当然即便是不用Rxjava，依旧能够做很多的封装，只是比较麻烦。
如需查看项目代码 --> 代码地址:
选择Tag -> step1
service.ts
1.3 添加Rxjava
Retrofit本身对Rxjava提供了支持。
添加Retrofit对Rxjava的支持需要在Gradle文件中添加
compile 'com.squareup.retrofit2:adapter-rxjava:2.0.0-beta4'
当然我们已经添加过了。
然后在创建Retrofit的过程中添加如下代码：
Retrofit retrofit = new Retrofit.Builder()
.baseUrl(baseUrl)
.addConverterFactory(GsonConverterFactory.create())
.addCallAdapterFactory(RxJavaCallAdapterFactory.create())
.build();
这样一来我们定义的service返回值就不在是一个Call了，而是一个Observable
重新定义MovieService
public interface MovieService {
@GET("top250")
Observable<MovieEntity> getTopMovie(@Query("start") int start, @Query("count") int count);
}
getMovie方法改为：
//进行网络请求
private void getMovie(){
String baseUrl = "https://api.douban.com/v2/movie/";
Retrofit retrofit = new Retrofit.Builder()
.baseUrl(baseUrl)
.addConverterFactory(GsonConverterFactory.create())
.addCallAdapterFactory(RxJavaCallAdapterFactory.create())
.build();
MovieService movieService = retrofit.create(MovieService.class);
movieService.getTopMovie(0, 10)
.subscribeOn(Schedulers.io())
.observeOn(AndroidSchedulers.mainThread())
.subscribe(new Subscriber<MovieEntity>() {
@Override
public void onCompleted() {
Toast.makeText(MainActivity.this, "Get Top Movie Completed", Toast.LENGTH_SHORT).show();
}
@Override
public void onError(Throwable e) {
resultTV.setText(e.getMessage());
}
@Override
public void onNext(MovieEntity movieEntity) {
resultTV.setText(movieEntity.toString());
}
});
}
这样基本上就完成了Retrofit和Rxjava的结合，但是我知道你们当然不会满意的。
接下来我们把创建Retrofit的过程封装一下，然后希望Activity创建Subscriber对象传进来。
如需查看项目代码 --> 代码地址:
选择Tag -> step2
import { IApiItem } from '@/configs/api/declares';import withAxios from '@/utils/withAxios';const api: IApiItem[] = [ { name: 'getSummary', url: '' }, { name: 'getDetail', url: '' }, { name: 'getDetailChildren', url: '' }, { name: 'getCurrentUser', url: '' },];interface IProdMonitorApi { getSummary: any; getDetail: any; getDetailChildren: any; getCurrentUser: any;}export default withAxiosIProdMonitorApi(api);
1.4 将请求过程进行封装
创建一个对象HttpMethods
public class HttpMethods {
public static final String BASE_URL = "https://api.douban.com/v2/movie/";
private static final int DEFAULT_TIMEOUT = 5;
private Retrofit retrofit;
private MovieService movieService;
//构造方法私有
private HttpMethods() {
//手动创建一个OkHttpClient并设置超时时间
OkHttpClient.Builder httpClientBuilder = new OkHttpClient.Builder();
httpClientBuilder.connectTimeout(DEFAULT_TIMEOUT, TimeUnit.SECONDS);
retrofit = new Retrofit.Builder()
.client(httpClientBuilder.build())
.addConverterFactory(GsonConverterFactory.create())
.addCallAdapterFactory(RxJavaCallAdapterFactory.create())
.baseUrl(BASE_URL)
.build();
movieService = retrofit.create(MovieService.class);
}
//在访问HttpMethods时创建单例
private static class SingletonHolder{
private static final HttpMethods INSTANCE = new HttpMethods();
}
//获取单例
public static HttpMethods getInstance(){
return SingletonHolder.INSTANCE;
}
/**
* 用于获取豆瓣电影Top250的数据
* @param subscriber 由调用者传过来的观察者对象
* @param start 起始位置
* @param count 获取长度
*/
public void getTopMovie(Subscriber<MovieEntity> subscriber, int start, int count){
movieService.getTopMovie(start, count)
.subscribeOn(Schedulers.io())
.unsubscribeOn(Schedulers.io())
.observeOn(AndroidSchedulers.mainThread())
.subscribe(subscriber);
}
}
用一个单例来封装该对象，在构造方法中创建Retrofit和对应的Service。 如果需要访问不同的基地址，那么你可能需要创建多个Retrofit对象，或者干脆根据不同的基地址封装不同的HttpMethod类。
我们回头再来看MainActivity中的getMovie方法：
private void getMovie(){
subscriber = new Subscriber<MovieEntity>() {
@Override
public void onCompleted() {
Toast.makeText(MainActivity.this, "Get Top Movie Completed", Toast.LENGTH_SHORT).show();
}
@Override
public void onError(Throwable e) {
resultTV.setText(e.getMessage());
}
@Override
public void onNext(MovieEntity movieEntity) {
resultTV.setText(movieEntity.toString());
}
};
HttpMethods.getInstance().getTopMovie(subscriber, 0, 10);
}
其中subscriber是MainActivity的成员变量。
如需查看项目代码 --> 代码地址:
选择Tag -> step3
本文由10bet发布于Web前端,转载请注明出处：RxJava 与 Retrofit 结合的最佳实践
关键词：