Hướng dẫn sử dụng Retrofit upload file ảnh lên API

Trước hết bạn cần xây dựng API, hãy xem bài viết https://zezo.dev/view/huong-dan-tao-route-upload-file-voi-multer-trong-nodejs/

Sau khi có API rồi thì bạn tiến hành xây dựng code Android Java để thực hiện upload ảnh.

 

Bước 1: Tạo project mới và nhúng thư viện

Bạn tự tạo 1 project mới và nhúng các thư viện sau vào file build.gradle ở cấp độ module

 

    implementation ("com.squareup.retrofit2:retrofit:2.11.0")
    implementation ("com.squareup.retrofit2:converter-gson:2.11.0")
    implementation ("com.squareup.okhttp3:okhttp:4.12.0")
    implementation ("androidx.media:media:1.4.0")
    implementation ("com.squareup.picasso:picasso:2.8")

Sau khi nhúng thư viện nhớ bấm Sync để cập nhật thư viện

 

Bước 2: Tạo file interface ApiService  để retrofit làm việc

import okhttp3.MultipartBody;
import okhttp3.ResponseBody;
import retrofit2.Call;
import retrofit2.http.Multipart;
import retrofit2.http.POST;
import retrofit2.http.Part;

public interface ApiService {

    @Multipart
    @POST("demo-upload")
    Call<KetQuaUpload> uploadFile(@Part  MultipartBody.Part file);
}

Bước 3: Tạo layout cho activity

Trên Layout có các nút bấm

 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical"
    >

    <TextView
        android:id="@+id/tv01"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Demo Upload file"
       />

    <ImageView
        android:id="@+id/img_preview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

    <Button
        android:id="@+id/btn_browsefile"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Browse File"/>
    <Button
        android:id="@+id/btn_upload"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Upload File"/>
</LinearLayout>

Bước 4: Khai báo Manifest

 

    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE"/>
    
    <uses-permission android:name="android.permission.INTERNET"/>

Đặc biệt chú ý trong thẻ application của Mainifest phải có 2 thuộc tính sau

<application
        android:requestLegacyExternalStorage="true"
        android:usesCleartextTraffic="true"

Bước 5: Tạo một lớp là KetQuaUpload để convert kết quả trả về từ server sang đối tượng java cho dễ dùng

public class KetQuaUpload {
    public String link_anh;
    public String error;

    public String toString(){
        return  "Error: "+ error + "\nLink: " + link_anh;
    }
}

Tiếp theo viết code cho MainActivity bạn xem ở bài viết tiếp theo https://zezo.dev/view/huong-dan-su-dung-retrofit-upload-file-anh-len-api-phan-mainactivity