升级至targetSdkVersion 31后Cordova Camera插件无法加载求助

数据老陈

2026-8-10

升级targetSdkVersion到31后Cordova相机插件失效问题排查方向

将App的targetSdkVersion更新为31后，相机功能无法加载。点击cameraBtn时，应用弹出“Camera unavailable”提示，navigator.camera为undefined。此前使用该插件多年一直正常运行，寻求解决方向！

document.addEventListener('deviceready', function() {
    cameraBtn.addEventListener('click', function() {
        if (!navigator.camera) alert("Camera unavailable")
        else if (!navigator.camera.getPicture) alert(navigator.camera)
        navigator.camera.getPicture(
            function(imgData) { // success
            },
            function(msg) { // fail
            },
            {
                quality: 60,
                destinationType: Camera.DestinationType.DATA_URL,
                sourceType: Camera.PictureSourceType.CAMERA,
                mediaType: Camera.MediaType.PICTURE,
                encodingType: Camera.EncodingType.JPEG,
                cameraDirection: Camera.Direction.BACK,
                correctOrientation: true,
                targetWidth: 512,
                targetHeight: 512
            }
        );
    });
});

应用插件列表

C:\htdocs\app\myapp>cordova plugin list
cordova-plugin-barcodescanner 0.7.4 "BarcodeScanner"
cordova-plugin-camera 6.0.0 "Camera"
cordova-plugin-compat 1.2.0 "Compat"
cordova-plugin-device 2.1.0 "Device"
cordova-plugin-geolocation 4.1.0 "Geolocation"
cordova-plugin-whitelist 1.3.4 "Whitelist"

config.xml配置

<?xml version='1.0' encoding='utf-8'?>
<widget id="io.cordova.myapp" 
        version="1.8.1" 
        android-versionCode="10036" 
        xmlns="http://www.w3.org/ns/widgets" 
        xmlns:android="http://schemas.android.com/apk/res/android" 
        xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>Myapp</name>
    <description>
    </description>
    <author email="suporte@mydomain.com.br" href="http://www.mydomain.com.br">
    </author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
        <config-file after="uses-permission" parent="/manifest" target="AndroidManifest.xml">
            <uses-permission android:name="android.permission.INTERNET" />
            <uses-permission android:name="android.permission.CAMERA" />
            <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
            <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
            <uses-permission android:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS" />
        </config-file>
        <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
            <application android:usesCleartextTraffic="true" />
        </edit-config>
        <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application/activity">
            <activity android:exported="true" />
        </edit-config>
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <edit-config file="*-Info.plist" mode="merge" target="NSLocationAlwaysAndWhenInUseUsageDescription">
            <string>Myapp precisa da permissão para acessar a sua geolocalização para identificar a localização do seu dispositivo no módulo de Documentos de RH</string>
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSLocationWhenInUseUsageDescription">
            <string>Myapp precisa da permissão para acessar a sua geolocalização para identificar a localização do seu dispositivo no módulo de Documentos de RH</string>
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSLocationAlwaysUsageDescription">
            <string>Myapp precisa da permissão para acessar a sua geolocalização para identificar a localização do seu dispositivo no módulo de Documentos de RH</string>
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSCameraUsageDescription">
            <string>Myapp precisa da permissão para acessar a sua câmera para anexar fotos aos seus chamados</string>
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryUsageDescription">
            <string>Myapp precisa da permissão para acessar a sua galeria para anexar fotos aos seus chamados</string>
        </edit-config>
        <edit-config file="*-Info.plist" mode="merge" target="NSPhotoLibraryAddUsageDescription ">
            <string>Myapp precisa da permissão para acessar a sua galeria para salvar as fotos que serão anexadas aos seus chamados</string>
        </edit-config>
    </platform>
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <plugin name="cordova-plugin-geolocation" spec="~4" />
    <plugin name="cordova-plugin-camera" spec="^6" />
    <plugin name="cordova-plugin-barcodescanner" spec="^0.7.4" />
    <preference name="android-minSdkVersion" value="30" />
    <preference name="android-targetSdkVersion" value="31" />
    <icon src="www/icon.png" />
    <icon height="57" platform="ios" src="ios/icon-57.png" width="57" />
    <icon height="72" platform="ios" src="ios/icon-72.png" width="72" />
    <icon height="114" platform="ios" src="ios/icon-114.png" width="114" />
    <icon height="120" platform="ios" src="ios/icon-120.png" width="120" />
    <icon height="144" platform="ios" src="ios/icon-144.png" width="144" />
    <icon height="152" platform="ios" src="ios/icon-152.png" width="152" />
    <icon height="1024" platform="ios" src="ios/icon-1024.png" width="1024" />
</widget>

排查解决方向

升级相机插件版本：当前使用的cordova-plugin-camera 6.0.0对Android 12（targetSdkVersion 31）的适配可能存在缺陷，建议升级到最新稳定版（如6.0.2），新版本通常会修复高版本系统的兼容问题。

补充相机硬件特性声明：在config.xml的Android平台下添加相机硬件依赖声明，确保系统识别应用对相机的需求：

<platform name="android">
  <uses-feature android:name="android.hardware.camera" android:required="true" />
  <uses-feature android:name="android.hardware.camera.autofocus" android:required="false" />
</platform>

排查插件冲突：cordova-plugin-barcodescanner也会调用相机资源，可能和相机插件存在冲突。先临时移除该插件，测试相机功能是否恢复，再寻找两个插件的兼容方案。
确认deviceready事件触发：在deviceready事件回调中添加日志，确认事件是否正常触发，避免因事件未完全加载导致navigator.camera未初始化：
```
document.addEventListener('deviceready', function() {
    console.log("设备已准备完成");
    // 原有按钮绑定代码
}, false);
```
手动检查AndroidManifest.xml：编译后查看app/src/main/AndroidManifest.xml，确认相机权限、android:exported属性是否正确生效，部分情况下config.xml的merge规则可能不生效，需要手动调整。

主动请求动态权限：Android 12要求动态申请敏感权限，在调用相机前主动申请相机权限，可借助cordova-plugin-permissions插件实现：

var permissions = cordova.plugins.permissions;
permissions.requestPermission(permissions.CAMERA, function(status) {
    if (status.hasPermission) {
        navigator.camera.getPicture(/* 参数 */);
    } else {
        alert("需要相机权限才能使用该功能");
    }
}, function() {
    alert("权限请求失败");
});

内容的提问来源于stack exchange，提问作者fcaserio

升级至targetSdkVersion 31后Cordova Camera插件无法加载求助

应用插件列表 #

config.xml配置 #

排查解决方向 #

应用插件列表

config.xml配置

排查解决方向