[置顶] Cordova配置文件常用属性配置分析（config.xml）

混合应用开发的模式，越来越被各大公司热推，凭借其快速迭代，跨平台的特性，已经变得炙手可热， 那个为了能更贴合于Native效果，有更好的用户体验，cordova的配置更是关键，今天就来分析一下cordova常用的配置属性。

首先，我们来看一个配置文件：

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.phd.demoProject" version="0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>MyDemoProject</name>
<description>
      MyDemoProject
</description>
<author email="[e-mail]" href="http://blog.csdn.net/jiangbo_phd">
      MyDemoProject
</author>
<content src="index.html" />
<!-- cordova-plugin-whitelist -->
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<access origin="*" />
<allow-intent href="tel:*"/>
<access launch-external="yes" origin="tel:*" />
<access launch-external="yes" origin="http:*" />
<access launch-external="yes" origin="https:*" />

<!-- stop uiwebview from bouncing in iOS -->
<preference name="webviewbounce" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />

<!-- android ice cream sandwich -->
<preference name="android-minSdkVersion" value="14" />

<!-- cordova-plugin-statusbar -->
<preference name="StatusBarBackgroundColor" value="#000000" />

<!-- prevent web storage backups -->
<preference name="BackupWebStorage" value="none" />

<!-- cordova-plugin-splashscreen -->
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="2000" />
<preference name="FadeSplashScreenDuration" value="2000"/>
<preference name="Orientation" value="portrait" />

<!-- allow keyboard trigger with focus events -->
<preference name="KeyboardDisplayRequiresUserAction" value="false" />

<!-- status bar permissions -->
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar" />
</feature>

<platform name="android">
<allow-intent href="market:*" />
<icon density="ldpi" src="assets/android/icon/drawable-ldpi-icon.png" />
<icon density="mdpi" src="assets/android/icon/drawable-mdpi-icon.png" />
<icon density="hdpi" src="assets/android/icon/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="assets/android/icon/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="assets/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="assets/android/icon/drawable-xxxhdpi-icon.png" />
<splash density="port-ldpi" src="assets/android/splash/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="assets/android/splash/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="assets/android/splash/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="assets/android/splash/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="assets/android/splash/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="assets/android/splash/drawable-port-xxxhdpi-screen.png" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
<config-file target="*-Info.plist" parent="CFBundleURLTypes">
<key>NSCameraUsageDescription</key>
<string>Please allow application use camera!</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>Please allow application use photo library!</string>
</config-file>
<icon height="57" src="assets/ios/icon/icon.png" width="57" />
<icon height="114" src="assets/ios/icon/[e-mail]" width="114" />
<icon height="40" src="assets/ios/icon/icon-40.png" width="40" />
<icon height="80" src="assets/ios/icon/[e-mail]" width="80" />
<icon height="50" src="assets/ios/icon/icon-50.png" width="50" />
<icon height="100" src="assets/ios/icon/[e-mail]" width="100" />
<icon height="60" src="assets/ios/icon/icon-60.png" width="60" />
<icon height="120" src="assets/ios/icon/[e-mail]" width="120" />
<icon height="180" src="assets/ios/icon/[e-mail]" width="180" />
<icon height="72" src="assets/ios/icon/icon-72.png" width="72" />
<icon height="144" src="assets/ios/icon/[e-mail]" width="144" />
<icon height="76" src="assets/ios/icon/icon-76.png" width="76" />
<icon height="152" src="assets/ios/icon/[e-mail]" width="152" />
<icon height="29" src="assets/ios/icon/icon-small.png" width="29" />
<icon height="58" src="assets/ios/icon/[e-mail]" width="58" />
<icon height="87" src="assets/ios/icon/[e-mail]" width="87" />
<splash height="1136" src="assets/ios/splash/Default-568h@2x~iphone.png" width="640" />
<splash height="1334" src="assets/ios/splash/Default-667h.png" width="750" />
<splash height="2208" src="assets/ios/splash/Default-736h.png" width="1242" />
<splash height="960" src="assets/ios/splash/Default@2x~iphone.png" width="640" />
<splash height="480" src="assets/ios/splash/Default~iphone.png" width="320" />
</platform>

<plugin name="cordova-plugin-whitelist" spec="1" />
<plugin name="cordova-plugin-statusbar" spec="~2.1.3" />
<plugin name="cordova-plugin-splashscreen" spec="~3.2.2" />

</widget>

下面我从上到下依次来分析：

定义项目的package 和版本号

在最外层Widget元素上，我们看到有id=”“, version=”“两个属性，当我们初始化cordova项目上这会有一个默认的配置，但之后我们需要根据需要自己进行配置。

1. id: 配置好后会自动生成到android的package name 和ios 的bundle id， 也就是说我们不需要再从新根据平台从新指定。
2. version： 是用来管理我们的版本号，在版本迭代的时候很重，配置好后，会自动动生成在项目里。

指定项目的名字，描述，作者信息

除了项目名字，其他的不是特别的重要，项目名字决定了ios和android的工程名字：

<name>MyDemoProject</name>

描述和作者信息自己填写一下就OK了

启动路径，跳转访问权限配置

    <content src="index.html" />
<!-- cordova-plugin-whitelist -->
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<access origin="*" />
<allow-intent href="tel:*"/>
<access launch-external="yes" origin="tel:*" />
<access launch-external="yes" origin="http:*" />
<access launch-external="yes" origin="https:*" />

1. content src 指定了cordova需要默认启动哪个 文件，这个轻易不要篡改。
2. allow-navigation 决定是了是否允许http, https的网址跳转。
3. allow-intent 这个用于指定是否允许调用电话拨打功能，在早些版本时候，这个是不需要指定的，但是cordova6.0+以后发现这个电话功能不好用了，配置了这个，才解决问题。

禁止webview回弹效果

<preference name="webviewbounce" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />

cordova默认的项目，当滑动时候，在ios设备上会有个回弹效果，对于网站项目这个正常，但是手机app这个是不需要的，而且影响体验，所以我们需要禁止掉这个属性；

<preference name="DisallowOverscroll" value="true" />

是否允许后台存储

<preference name="BackupWebStorage" value="none" />

这个属性我们一定要配置none,否则的后ios会调用icloud存储，这个虽然没有大的影响，但是在发布到apple store的时候可能会因为这个原因，被拒绝掉。

splash 启动配置

<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="2000" />
<preference name="FadeSplashScreenDuration" value="2000"/>
<preference name="Orientation" value="portrait" />

在app启动的时候我们会看到各种启动图片，这个叫splash, 我们需要对此进行配置，前提是我要安装splash插件才能生效的，并且也可配置app的横竖屏，启动页面的持续时间等等。

针对平台的设置

<platform name="android">
<allow-intent href="market:*" />
</platform>

对于不同的平台会有不同的设置，比如splash和icon， 因为android 和ios上尺寸是不一样的。

插件配置

<plugin name="cordova-plugin-whitelist" spec="1" />
<plugin name="cordova-plugin-statusbar" spec="~2.1.3" />
<plugin name="cordova-plugin-splashscreen" spec="~3.2.2" />

我们必须要配置的插件通常就是上面几个，白名单用来允许访问https网络，主要是用在android的项目，但是对于最新的cordova应该不需要了。

plugin这个是最新的定义方式，之前我一直在用feature这个属性，但是后来发现被废弃掉了。

指定好这个plugin以后，每次cordova会检查项目是否有这个几个插件，如果没有的话，自动从新下载，有的话不下载，当本地和定义版本不一致的使用，更新重新下载。

总结

以上就是cordova的配置文件常用解析，当然还有更多的属性值得我们去探索，后期大家自己研究一下吧！