Android用Retrofit 2實(shí)現(xiàn)多文件上傳實(shí)戰(zhàn)

作者：佚名 2017-04-20 13:30:00

本文作為階段性小結(jié)，將使用結(jié)合Python中的Flask框架實(shí)現(xiàn)Android端多文件上傳功能。如果讀者沒(méi)有使用過(guò)Python中的Flask也沒(méi)有關(guān)系，可以只看Android客戶端部分，畢竟客戶端工程師只使用API也是可以的。

前一段時(shí)間我翻譯了Future Studio的Retrofit2教程，從中也學(xué)習(xí)到了一些Retrofit2的使用方法，如果你最近也打算入手學(xué)習(xí)，我博客上Retrofit教程，你也許可以參考下：Retrofit教程。

1.實(shí)驗(yàn)效果

Android端操作截圖

Server端接收到的圖片

2. Server端實(shí)戰(zhàn)

Server端負(fù)責(zé)接收保存客戶端上傳來(lái)的圖片并提供訪問(wèn)圖片的能力，Server有很多技術(shù)可以實(shí)現(xiàn)，Python作為一門具有強(qiáng)大的第三方庫(kù)的語(yǔ)言，擁有很多web服務(wù)框架，如Flask,Django等。筆者采用Flask框架，F(xiàn)lask是微框架，實(shí)現(xiàn)小型功能十分方便，筆者實(shí)現(xiàn)的多文件上傳功能，程序不超過(guò)30行。

下面具體來(lái)看看。

2.1 環(huán)境安裝

筆者使用的Python版本為3.4，可以去 Python3.4下載選擇下載適合自己系統(tǒng)的版本。完整安裝Python教程請(qǐng)自行搜索。

Python安裝完成后需要安裝Server端程序依賴庫(kù)。通過(guò)pip安裝：

pip install Flask 
pip install werkzeug

2.2 程序?qū)崿F(xiàn)

首先要引入依賴庫(kù)：

from flask import Flask,request,send_from_directory,jsonify 
import os 
from werkzeug import secure_filename

本實(shí)驗(yàn)需要上傳文件，需要將所上傳文件的文件類型以及文件名做出限制，防止某些破壞服務(wù)器的程序運(yùn)行，另外有些非法文件名如：

filename = "../../../../home/username/.bashrc"

如果黑客們能夠操作這樣的文件，對(duì)服務(wù)器系統(tǒng)來(lái)說(shuō)，將是致命打擊。所以werkzeug提供了secure_filename對(duì)上傳文件的文件名進(jìn)行合法校驗(yàn)。

判斷文件后綴是否合法

ALLOWED_EXTENSIONS=set(['png','jpg','jpeg','gif']) 
def allowed_file(filename): 
return '.' in filename and filename.rsplit('.',1)[1] in ALLOWED_EXTENSIONS

接收上傳文件的函數(shù)代碼如下：

@app.route('/upload',methods=['POST']) 
def upload_file(): 
if request.method=='POST': 
for k in request.files: 
file = request.files[k] 
image_urls = [] 
if file and allowed_file(file.filename): 
filename=secure_filename(file.filename) 
file.save(os.path.join(app.config['IMAGE_FOLDER'],filename)) 
image_urls.append("images/%s"%filename) 
return jsonify({"code":1,"image_urls":image_urls})

Flask支持GET,POST,PUT,DELETE等HTTP請(qǐng)求方式，使用裝飾器進(jìn)行修飾，類似于Java中的注解概念，/upload為客戶端請(qǐng)求的相對(duì)地址，請(qǐng)求方式限制為POST.根據(jù)request內(nèi)置對(duì)象，可以訪問(wèn)客戶端發(fā)來(lái)的文件，將文件檢查后保存在本地，其中image_urls為上傳后的圖片的相對(duì)地址數(shù)組。***將圖片的地址以json格式返回給客戶端。

完整的Server端代碼如下：

from flask import Flask,request,send_from_directory,jsonify 
 import os 
 from werkzeug import secure_filename 
 
app = Flask(__name__) 
 app.config['IMAGE_FOLDER'] = os.path.abspath('.')+'\\images\\' 
 ALLOWED_EXTENSIONS=set(['png','jpg','jpeg','gif']) 
 
def allowed_file(filename): 
 return '.' in filename and filename.rsplit('.',1)[1] in ALLOWED_EXTENSIONS 
 
@app.route('/upload',methods=['POST']) 
 def upload_file(): 
 if request.method=='POST': 
 for k in request.files: 
 file = request.files[k] 
 print(file) 
 image_urls = [] 
 if file and allowed_file(file.filename): 
 filename=secure_filename(file.filename) 
 file.save(os.path.join(app.config['IMAGE_FOLDER'],filename)) 
 image_urls.append("images/%s"%filename) 
 return jsonify({"code":1,"image_urls":image_urls}) 
 
#讓文件映射訪問(wèn)，否則默認(rèn)只能訪問(wèn)static文件夾中的文件 
 @app.route("/images/<imgname>",methods=['GET']) 
 def images(imgname): 
 return send_from_directory(app.config['IMAGE_FOLDER'],imgname) 
 
if __name__ == "__main__": 
 
# 檢測(cè) IMAGE_FOLDER 是否存在 
 if not os.path.exists(app.config['IMAGE_FOLDER']): 
 os.mkdir(app.config['IMAGE_FOLDER']) 
 app.run("192.168.1.102",debug=True)

這里有一個(gè)小技巧，寫(xiě)完Server端代碼后可以使用Postman進(jìn)行測(cè)試，測(cè)試成功后再進(jìn)行客戶端程序開(kāi)發(fā)。

3. 客戶端開(kāi)發(fā)

因?yàn)樯婕拔募纳蟼鳎P者這里以圖片為例進(jìn)行上傳實(shí)驗(yàn)，圖片上傳除了重頭戲Retrofit之外，還需要選擇圖片，筆者這里推薦一個(gè)模仿微信的圖片選擇庫(kù) ImagePicker .

3.1 添加依賴庫(kù)

圖片加載庫(kù)筆者喜歡使用Glide

compile 'com.squareup.retrofit2:retrofit:2.1.0' 
compile 'com.squareup.retrofit2:converter-gson:2.1.0' 
compile 'com.github.bumptech.glide:glide:3.7.0' 
compile 'com.lzy.widget:imagepicker:0.4.1'

3.2 程序?qū)崿F(xiàn)

如果沒(méi)有接觸過(guò)Retrofit 2，可以來(lái)我的博客Retrofit教程了解。

Retrofit2 是一個(gè)支持RESTful API的請(qǐng)求庫(kù)，實(shí)際上只是對(duì)API請(qǐng)求方式的封裝，真正的網(wǎng)絡(luò)請(qǐng)求由OkHttp發(fā)出。

Retrofit2一般會(huì)定義一個(gè)ServiceGenerator類，用于動(dòng)態(tài)生成Retrofit對(duì)象。

public class ServiceGenerator { 
public static final String API_BASE_URL = "http://192.168.1.102:5000/"; 
private static OkHttpClient.Builder httpClient = new OkHttpClient.Builder(); 
  
private static Retrofit.Builder builder = 
new Retrofit.Builder() 
.baseUrl(API_BASE_URL) 
.addConverterFactory(GsonConverterFactory.create()); 
  
public static <S> S createService(Class<S> serviceClass) { 
Retrofit retrofit = builder.client(httpClient.build()).build(); 
return retrofit.create(serviceClass); 
} 
}

具體的API操作由FlaskClient接口操作，

public interface FlaskClient { 
    //上傳圖片 
    @Multipart 
    @POST("/upload") 
    Call<UploadResult> uploadMultipleFiles(@PartMap Map<String,RequestBody> files); 
}

上傳文件需要使用@Multipart關(guān)鍵字注解，@POST表明HTTP請(qǐng)求方式為POST,/upload為請(qǐng)求服務(wù)器的相對(duì)地址，uploadMultipleFiles是自定義的方法名，參數(shù)為Map<String,RequestBody> files即多個(gè)文件組成的Map對(duì)象，@PartMap表明這是多文件上傳，如果單文件可以使用@Part MultipartBody.Part file,方法的返回類型默認(rèn)為Response,由于我們已經(jīng)開(kāi)發(fā)了Server端，所以知道Server端的返回?cái)?shù)據(jù)格式為Json，因此我們針對(duì)返回?cái)?shù)據(jù)格式新建一個(gè)UploadResut類。

public class UploadResult { 
     public int code; // 1 
     public List<String> image_urls; 
}

界面布局如圖所示：

點(diǎn)擊Upload按鈕后執(zhí)行上傳操作，核心的方法：

public void uploadFiles() { 
    if(imagesList.size() == 0) { 
        Toast.makeText(MainActivity.this, "不能不選擇圖片", Toast.LENGTH_SHORT).show(); 
        return; 
    } 
    Map<String, RequestBody> files = new HashMap<>(); 
    final FlaskClient service = ServiceGenerator.createService(FlaskClient.class); 
    for (int i = 0; i < imagesList.size(); i++) { 
        File file = new File(imagesList.get(i).path); 
        files.put("file" + i + "\"; filename=\"" + file.getName(), RequestBody.create(MediaType.parse(imagesList.get(i).mimeType), file)); 
    } 
    Call<UploadResult> call = service.uploadMultipleFiles(files); 
    call.enqueue(new Callback<UploadResult>() { 
        @Override 
        public void onResponse(Call<UploadResult> call, Response<UploadResult> response) { 
            if (response.isSuccessful() && response.body().code == 1) { 
                Toast.makeText(MainActivity.this, "上傳成功", Toast.LENGTH_SHORT).show(); 
                Log.i("orzangleli", "---------------------上傳成功-----------------------"); 
                Log.i("orzangleli", "基礎(chǔ)地址為：" + ServiceGenerator.API_BASE_URL); 
                Log.i("orzangleli", "圖片相對(duì)地址為：" + listToString(response.body().image_urls,',')); 
                Log.i("orzangleli", "---------------------END-----------------------"); 
            } 
        } 
        @Override 
        public void onFailure(Call<UploadResult> call, Throwable t) { 
            Toast.makeText(MainActivity.this, "上傳失敗", Toast.LENGTH_SHORT).show(); 
        } 
    }); 
}

其中構(gòu)建上傳多文件的方法的參數(shù)較為關(guān)鍵，MediaType.parse(imagesList.get(i).mimeType)獲取圖片的mimeType，如果指定錯(cuò)誤，可能會(huì)導(dǎo)致上傳失敗。

Map<String, RequestBody> files = new HashMap<>(); 
final FlaskClient service = ServiceGenerator.createService(FlaskClient.class); 
for (int i = 0; i < imagesList.size(); i++) { 
     File file = new File(imagesList.get(i).path); 
     files.put("file" + i + "\"; filename=\"" + file.getName(), RequestBody.create(MediaType.parse(imagesList.get(i).mimeType), file)); 
}

集成Callback借口的匿名回調(diào)類的onResponse方法的第二個(gè)參數(shù)為服務(wù)器響應(yīng)，通過(guò)訪問(wèn)body()方法返回UploadResult類型對(duì)象，接著就可以通過(guò)組合ServiceGenerator.API_BASE_URL和response.body().image_urls中每一項(xiàng)訪問(wèn)上傳完成的圖片。

4. 項(xiàng)目地址

本項(xiàng)目Client端和Server端均以開(kāi)源，歡迎各位老總們Star。

Client地址: RetrofitMultiFilesUploadClient

Server地址: MultiFileUploadServer

原文鏈接：http://www.orzangleli.com/2017/04/03/2017-04-03_Android%20%E7%94%A8%20Retrofit%202%20%E5%AE%9E%E7%8E%B0%E5%A4%9A%E6%96%87%E4%BB%B6%E4%B8%8A%E4%BC%A0%E5%AE%9E%E6%88%98/

責(zé)任編輯：龐桂玉來(lái)源： Android開(kāi)發(fā)中文站

Android Retrofit 2 文件上傳