最近的工作中接觸了一個小的功能，上傳頭像。上傳頭像是很多應用中的東西，描述下自己的應用。上傳頭像應用的地方：
1.最開始進入app的時候會提示註冊，然後就會呼叫。
2.成功的註冊完畢以後，可以在個人資訊裡面修改頭像。
3.在H5（某個WebView）中也可以修改這個頭像。
4.分為上傳成功，上傳失敗和取消上傳的功能。

先想想自己的這個功能，實現1和2只需要將上傳的邏輯寫在一個公共的類就行（例如：LoadUtil.java），要實現3的功能，首先想到也是在一個WebViewActivity中實現上傳，不是直接跟在某個NativeActivity中上傳的邏輯一樣？仔細想想，發現其實不是這樣的，一個WebViewActivity對應的會是很多的H5的介面（例如：

http://wwww.baidu.com 和 http://www.google.com 可能都是在同一個WebViewAcitivity）。這樣就會導致我需要在公用的WebViewActivity中加上圖片剪下加上圖片上傳藉口的呼叫。同樣的，我實現1和2的時候也是需要在兩個不同的Activity中去實現圖片的裁剪和呼叫上傳介面。又或者說來個更直接的，如果我圖片的裁剪是系統自帶的，那麼我們還需要在onActivityResult中來取得最後裁剪的資料。根據自己的需求，想了一個程式碼量比較少的做法。可以自己寫一個BaseActivity，將圖片的擷取、圖片的獲得、呼叫圖片上傳的介面都寫在裡面。然後再寫一個工具類來實現圖片的上傳介面，最後在根據每種不同的情況來處理上傳成功，失敗以及取消的操作。
這篇文章主要涉及到知識：

• 圖片的擷取和Bitmap的生成
• 上傳檔案的協議以及實現
• Native和H5複用

圖片的擷取和Bitmap的生成

對於系統的圖片的擷取

Intent intent = new Intent(Intent.ACTION_PICK, android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
intent.setType("image/*"); //開啟的是系統的相簿
intent.putExtra("crop", "true"); //使用系統自帶的裁剪
intent.putExtra("aspectX", 1); 
intent.putExtra
 
("aspectY", 1); //兩行表示裁剪寬高比為1:1
intent.putExtra("outputX", WIDTH);
intent.putExtra("outputY", HEIGTH); //裁剪以後輸出的寬高值
intent.putExtra("return-data", true); // 返回得到的資料
startActivityForResult(intent, REQUSET_CODE);

然後就可以在onActivityResult(int requestCode,int responseCode,Intent data)中呼叫了。現在需要的是得到Bitmap的值。

if (data != null)
{
    Bitmap bitmap = null;
    if (data.hasExtra("data"))   // 首先會判斷data中是否存在"data"值
    {
        bitmap = data.getParcelableExtra("data");  // 存在就可以直接取了
    }
    else // 不存在的時候則是可以通過BitmapFactory來獲取bitmap的值
    {   
        BitmapFactory.Options options = new BitmapFactory.Options();
        InputStream is = null;
        try
        {
            is = getContentResolver().openInputStream(data.getData());
            bitmap = BitmapFactory.decodeStream(is, null, options);
        }
        catch (Exception e)
        {
        }
        finally
        {
            try
            {
                is.close();
            }
            catch (Exception e)
            {
            }
        }
}

上傳檔案的協議以及實現

分為兩個部分，請求頭和請求的正文。
Headers（請求標頭）：
會有一個Content-Type欄位
Content-Type:multipart/form-data;boundary=一串每次請求不一樣的字串
TextView（請求正文）：
請求正文裡面的資訊就複雜一點了。
第一行：
兩個減號+與請求頭一樣的字串+回車符號 （markdown中不支援寫減號）
第二行：
Content-Disposition: form-data; name=\”file\”+; filename=\” + filename + \” + 回車符號（這裡面的file的值根據你的後臺的介面而寫，filename則是你的上傳的影象所在的位置）
第三行：
Content-Type: image/jpeg+兩個回車符號（注意是兩個回車符號）
第四行：
將圖片轉化為流寫入。
第五行：
回車符號+與請求頭一樣的字串+兩個減號+回車符號
這樣所有的資訊寫好以後，就完成了圖片上傳的協議。接下來就是讀取後臺返回來的資訊解析出來就行。
使用HttpURLConnection實現。

URL url = new URL(uploadUrl);
            HttpURLConnection conn = (HttpURLConnection) url.openConnection();
            conn.setRequestMethod("POST");
            // 允許input,output
            conn.setDoInput(true);
            conn.setDoOutput(true);
            conn.setUseCaches(false);
            // 設定請求頭的資訊
            conn.setRequestProperty("Connection", "Keep-Alive");
            // conn.setRequestProperty("Charset", "UTF-8");
            // conn.setRequestProperty("ENCTYPE", "multipart/form-data");
            conn.setRequestProperty("Accept-Charset", "utf-8");
            conn.setRequestProperty("contentType", "utf-8");
            conn.setRequestProperty("Content-Transfer-Encoding", "binary");
            conn.setRequestProperty("Content-Type", "multipart/form-data;boundary=" + boundary);
            // 上傳的資訊，ds就是上傳檔案的流
            DataOutputStream ds = new DataOutputStream(conn.getOutputStream());
            // twoHyphens="--",boundary是前面請求頭中的相同的資訊，end="\r\n"
            // 第一行
            ds.writeBytes(twoHyphens + boundary + end);
            // 第二行
            ds.writeBytes("Content-Disposition: form-data; name=\"upload\"; filename=\"" + filename + "\"" + end);
            // 第三行
            ds.writeBytes("Content-Type: image/jpeg" + end + end);
            // 第四行，將Bitmap寫入輸出流，相當於將Bitmap上傳
            bitmap.compress(CompressFormat.JPEG, 100, ds);
            // 第五行
            ds.writeBytes(end+twoHyphens + boundary + twoHyphens + end);
            ds.flush();
            // 得到輸入流，即得到伺服器返回的資料
            InputStream is = conn.getInputStream();
            StringBuffer sb = new StringBuffer();
            String s = null;
            BufferedReader reader = new BufferedReader(new InputStreamReader(is));
            while ((s = reader.readLine()) != null)
            {
                sb.append(s);
            }
            String result = sb.toString();

這樣就按照上面的協議完成了一個頭像的上傳。

Native和H5複用

現在的應用確實越來越多的APP跟H5緊密相連，因此也有越來越多的功能需要結合H5一起來實現。上傳頭像是一個很常見的功能。前面得到的結論是做一個公共的BaseActivity提供給NativeActivity和WebViewActivity來使用。然後在BaseActivity裡面寫上我們的圖片的擷取以及onActivityResult。

public class BaseActivity extends Activity
{

    public void pickUpPic()
    {
        // 上面操作中的系統的圖片的擷取
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data)
    {
        // 上面操作中的得到Bitmap的操作
    ｝
}

大概的框架就是這樣，只需要在NativeActivity和WebViewActivity相應的位置呼叫pickUpPic()就行了。
這樣就結束了？No.對於只是上傳頭像來說這樣或許是結束了，但是還有很多的問題還沒有考慮到。
1.請求的引數？
2.返回的結果，成功或失敗提示有差別嗎？
3.使用者在網速慢的情況下取消上傳的操作？
4.友好的提示使用者上傳的資訊？

請求引數
pickUpPic()作為唯一的入口，因此需要將所有的引數（例如：請求的頭像的寬高比、返回的大小、入口的型別等等）。因此需要全部寫在pickUpPic()裡面。

public void pickUpPic(Params parama)
{
    // 將帶入的引數設定一些資訊
    // 帶入的引數設定擷取的影象大小等等資訊
}

這樣就能滿足所有很多不同的需求了。設定的資訊也可以帶入onActivityResult中，在裡面呼叫上傳頭像介面時使用。

提示資訊
注意在UI執行緒中是無法處理網路操作的，我們現在的成功，失敗以及使用者的取消操作都是在子執行緒中操作的（也就是上傳的時候才知道成功失敗等等）。所以最先想到了使用一個Handler來操作，這樣的話，還需要在BaseActivity中加一個handler來處理我們返回來的資訊，同時主要到我們可能會有中不同的結果，success，fail，cancle。還有我們的NativeActivity個WebViewActivity兩個不同的Activity的操作也應該有很大的不同的。大概可以寫一個這樣的Handler。

private Handler handler = new Handler()
{

    @Override
    public void handleMessage(Message msg)
    {
        switch(msg.what)
        {
            case SUCCESS:
                // do somenthing
                listener.onSuccess(msg.obj);
                break;
            case FAIL:
                // do something
                listener.onFail(msg.obj);
                break;
            case CANCLE:
                // do something
                listener.onCancle(msg.obj);
                break;
            default:
                break;
        }

    }
}

只需要分別在NativeActivity和WebViewActivity中去實現不同的操作就行了。
然後，大概就是這樣了。