使用情境
在 H5 離線包中使用 <input type="file"/>
選擇檔案或者圖片時,若不滿足需求,可以使用自訂圖片選擇功能。如選擇圖片樣式、可選多張圖片、動態許可權的處理等,推薦使用 MPH5OpenFileChooserProvider
來實現。
實現方式
在 mPaaS 初始化完成後的回調中註冊
MPH5OpenFileChooserProvider
。H5Utils.setProvider(MPH5OpenFileChooserProvider.class.getName(), new MPH5OpenFileChooserProvider() { @Override public boolean needIntercept(Activity activity, ValueCallback valueCallback, boolean b, APFileChooserParams apFileChooserParams) { //不需要自訂圖片選擇功能時,不攔截 H5 容器,return false;預設不攔截 H5 容器 //需要自訂圖片選擇功能時,攔截 H5 容器,return true return true; } @Override public void openFileChooser(Activity activity, ValueCallback valueCallback, boolean b, APFileChooserParams apFileChooserParams) { // 拿到合法的 uri 給到前端 //必須調用該方法,若不調用,下次單擊回調不執行 //1.通過intent開啟一個Activity,調用系統相簿或者拍照 //2.拿到選擇後的圖片 //3.關閉頁面通過valueCallback,傳遞給前端 valueCallback.onReceiveValue(xx); } });
重要valueCallback.onReceiveValue(xx)
函數必須調用,若不調用,下次單擊回調不執行。在回呼函數
openFileChooser
中選擇圖片進行處理。通過
intent
開啟一個Activity
,調用系統相簿或者拍照。擷取選擇後的圖片。
關閉開啟的
Activity
,通過valueCallback
傳遞圖片給前端。
參考方案
方案一
在
openFileChooser
的回調方法中註冊廣播接收者。在
openFileChooser
方法中通過Intent
跳轉到自己建立的Activity
。調用系統的拍照/圖片選擇 SDK(可以進行擴充如圖片裁剪等功能)。
通過圖片選擇
Activity
擷取到最終的選擇圖片, 發送廣播到openFileChooser
回調的廣播監聽者,關閉Activity
頁面。通過
WebView
系統的valueCallback.onReceiveValue(xx)
傳遞給前端。
方案二
在
openFileChooser
方法中通過Intent
跳轉到一個Activity
,並將valueCallback
傳遞給Activity
。調用系統的拍照/圖片選擇 SDK(可以進行擴充如圖片裁剪等功能)。
通過
WebView
系統的valueCallback.onReceiveValue(xx)
傳遞給前端 。關閉
Activity
頁面 。