一、 什麼是Ionic
Ionic 是一個強大的 HTML5 應用程序開發框架(HTML5 Hybrid Mobile App Framework )。 可以幫助您使用 Web 技術，比如 HTML、CSS 和 Javascript 構建接近原生體驗的移動應用程序。它是基於Cordova框架，利用Cordova實現應用的手機功能調用、調試與發佈。
簡單的話就是可以使用一套代碼，利用Ionic可以生成安卓、IOS和網頁端應用。
二、 使用插件時遇到的坑與解決方法
在開發Ionic應用時，因爲程序本身是不具備調用手機功能的，需要利用Cordova插件進行手機功能調用，而一些插件因爲停止更新或更新不及時，導致對新版本系統的手機或不同廠商生產出來的手機的支持度都不一樣，現在總結一下本人在開發Ionic時，在使用一些常用的插件遇到的坑和解決方法。
2.1. cordova-plugin-file-transfer插件
最新發行版本：1.7.1
說明：cordova-plugin-file-transfer是一個文件傳輸插件，可利用它進行文件的上傳與下載。
問題：使用最新發行版本進行IOS打包發佈時，Xcode會報userAgent錯誤。
解決：
使用GIT代碼庫裏的最新代碼進行發行，可解決些問題，具體操作：ionic cordova plugin add
https://github.com/apache/cordova-plugin-file-transfer
2.2. cordova-plugin-telerik-imagepicker插件
最新發行版本：2.3.6
說明：cordova-plugin-telerik-imagepicker是圖片選擇插件，可調用系統圖庫進行圖片與視頻的選擇。
問題：最新版本與ANDROID_SUPPORT_V4_VERSION或ANDROID_SUPPORT_APPCOMPAT_V7_VERSION爲27.+的插件會有衝突（如cordova-plugin-file-opener2和cordova-plugin-camera），造成選擇圖片時會造成應用閃退。
解決：
降級爲2.3.3版本：ionic cordova plugin add [email protected]
開啓AndroidX模式，在config.xml添加
<preference name="AndroidXEnabled" value="true" />
<preference name="GradlePluginKotlinEnabled" value="true" />
有些機型還需要添加AndroidX適配器插件：ionic cordova plugin add cordova-plugin-androidx-adapter
2.3. cordova-plugin-filepath插件
最新發行版本：1.6.0
說明：ordova-plugin-filepath是一個文件路徑轉換插件，通常配合一些文件選擇相關的插件使用。
問題：對Android API 29及以上和部分華爲榮耀手機會有兼容問題。
解決：
無解，只能修改插件源碼，以下爲本人修改的插件代碼，文件路徑爲：ode_modules/cordova-plugin-filepath/src/android/FilePath.java，
//第345行開始
// DownloadsProvider
else if (isDownloadsDocument(uri)) {
// thanks to https://github.com/hiddentao/cordova-plugin-filepath/issues/34#issuecomment-430129959
Cursor cursor = null;
//by ming 這裏有個BUG，如果取Download目錄第三方應用目錄裏的文件，如果在Download目錄下有相同文件名的文件，會獲取到Download上錄下的文件，解決此問題可屏蔽以下try裏的代碼，不過會產生臨時文件
try {
cursor = context.getContentResolver().query(uri, new String[]{MediaStore.MediaColumns.DISPLAY_NAME}, null, null, null);
if (cursor != null && cursor.moveToFirst()) {
String fileName = cursor.getString(0);
String path = Environment.getExternalStorageDirectory().toString() + "/Download/" + fileName;
if (fileExists(path)) {
return path;
}
}
} finally {
if (cursor != null)
cursor.close();
}
//
final String id = DocumentsContract.getDocumentId(uri);
//by ming 華爲和榮耀手機特殊處理
if (id.startsWith("raw:")) {
return id.replaceFirst("raw:", "");
}
//by ming end
String[] contentUriPrefixesToTry = new String[]{
"content://downloads/public_downloads",
"content://downloads/my_downloads",
"content://downloads/all_downloads" //add by ming
};
for (String contentUriPrefix : contentUriPrefixesToTry) {
//Uri contentUri = ContentUris.withAppendedId(Uri.parse(contentUriPrefix), Long.valueOf(id)); //delete by ming
try {
Uri contentUri = ContentUris.withAppendedId(Uri.parse(contentUriPrefix), Long.valueOf(id)); //add by ming
String path = getDataColumn(context, contentUri, null, null);
if (path != null) {
return path;
}
} catch (Exception e) {
}
}
try {
return getDriveFilePath(uri, context);
} catch (Exception e) {
return uri.getPath();
}
}
三、 結語
以上就是本人在開發Ionic時所用到的一些插件遇到的問題和解決的方法，而這些插件在開發中還是挺常使用到的，希望本人的經驗對大家有所幫助。