【Android】WebView内でカメラ起動させる正しい設定・コード例

Androidアプリ開発にて困った場面が。

アプリ内にWebViewを組み込んでいる
その中でカメラを起動させたい
なぜかカメラが起動してくれない...

パーミッション付与だけでは不十分でした。

いくつか注意点みたいなのがあるので、
Android+WebViewでカメラ起動させる方法をメモ

このページの目次

１．起動時にカメラのパーミッションを許可させる
- AndroidManifest.xmlにパーミッション追加
- アプリ起動時にカメラ起動の許可を取る
２．WebViewでonPermissionRequestをオーバーライド
３．WebView側で基本設定が抜けていないかもチェック
WebViewでカメラ起動しない時のチェックリスト

１．起動時にカメラのパーミッションを許可させる

まずは基本中の基本から

カメラのパーミッション（権限）の追加

このような手順で追加してみてください。

AndroidManifest.xmlにパーミッション追加

まずはカメラ権限を付与してあげます。

▼ AndroidManifest.xmlに次を追加

<!-- カメラを許可 -->
<uses-permission android:name="android.permission.CAMERA" />

1 2	<!-- カメラを許可 --> <uses-permission android:name="android.permission.CAMERA" />

追加する場所はmanifest要素の直下とかでOKだと思います。ただしカメラ起動にはAndroidManifest.xmlへの権限追加だけでは不十分です。（カメラ起動などのプライベートな権限はアプリ起動時に許可が必要）

アプリ起動時にカメラ起動の許可を取る

AndroidManifest.xmlへの追加だけでは不十分

アプリ起動時に許可ダイアログ表示も必要です。

▼ Activity#onCreate に次コードを追加(kotlin)

/// パーミッション許可を取る
if (Build.VERSION.SDK_INT >= 23) {
    if (
        ActivityCompat.checkSelfPermission(
            this,
            Manifest.permission.CAMERA
        )
        != PackageManager.PERMISSION_GRANTED
    ) {
        ActivityCompat.requestPermissions(
            this, arrayOf(
                //Manifest.permission.WRITE_EXTERNAL_STORAGE,
                Manifest.permission.CAMERA
            ),
            12345
        )
    }
}

/// パーミッション許可を取る

if (Build.VERSION.SDK_INT >= 23) {

if (

ActivityCompat.checkSelfPermission(

this,

Manifest.permission.CAMERA

)

!= PackageManager.PERMISSION_GRANTED

) {

ActivityCompat.requestPermissions(

this, arrayOf(

//Manifest.permission.WRITE_EXTERNAL_STORAGE,

Manifest.permission.CAMERA

12345

)

}

実は APIレベル >= 23 以降はこのような許可ダイアログの表示が必須になりました。（昔はAndroidManifest.xmlに追加するだけのユルユル権限だった。。。）

より詳しくは次記事で解説してあります。

▼ Androidでパーミッション許可ダイアログの出し方

PisukeCode - Web開発まとめ

Androidでパーミッション許可ダイアログの出し方

https://pisuke-code.com/android-show-permission-dialog

Androidでのパーミッションについて昔（APIレベル < 23）はこんな緩い許可でOKでした。ただAndroidManifest.xmlに書くだけインストール時に自動的に許可されるこれは大昔の話。現在（APIレベル >= 23）はスゴク厳格になってます。いわゆるパーミッション許可ダイアログの表示必須です。意外とやり方が面倒だったので、ここではそのパーミッション許可ダイアログの出し方をまとめました。許可ダイアログを出す必要があるパーミッションの種類まずパーミッションと許可ダイアログについて別に全パーミッションで必須なわけ...

もし詳しい実装が知りたいなら参照してください。

２．WebViewでonPermissionRequestをオーバーライド

これは僕自身も盲点でした。

カメラ起動にはこの処理も必要です。

▼ WebChromeClient#onPermissionRequestをオーバーライド

webView = findViewById(R.id.web_view);

/// 関係ないので中略...

webView.webChromeClient = object : WebChromeClient(){
    override fun onPermissionRequest(request: PermissionRequest) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            /// パーミッションを許可
            request.grant(request.resources)
        }
    }
};

webView = findViewById(R.id.web_view);

/// 関係ないので中略...

webView.webChromeClient = object : WebChromeClient(){

override fun onPermissionRequest(request: PermissionRequest) {

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {

/// パーミッションを許可

request.grant(request.resources)

}

};

カメラ起動にはパーミッション許可ダイアログを出すだけではなく、WebViewに対してWebChromeClient#onPermissionRequestのオーバーライドも必須みたいです。

これが分からなくて数時間うんうん悩んでました(-_-;)。もしカメラ起動したいなら、必ずWebViewに対してもカメラ起動を許可するようにしてください。（この表現で正しいのかな？）

３．WebView側で基本設定が抜けていないかもチェック

WebViewで基本設定を忘れてる場合もあります。

こういった設定も抜けてないか確認してください。

▼ WebViewSettingsの基本設定を設定

/// JavaScript実行許可
webView.settings.javaScriptEnabled = true;
/// ファイルアクセスを許可
webView.settings.allowFileAccess = true;
/// localStorage仕様を許可
webView.settings.domStorageEnabled = true;

/// JavaScript実行許可

webView.settings.javaScriptEnabled = true;

/// ファイルアクセスを許可

webView.settings.allowFileAccess = true;

/// localStorage仕様を許可

webView.settings.domStorageEnabled = true;

こういった基本設定も有効にしておくと無難。

僕の場合、上記設定でカメラ起動できました。

WebViewでカメラ起動しない時のチェックリスト

ということで箇条書きでまとめます。

起動時にカメラのパーミッションを許可させる
WebViewでonPermissionRequestをオーバーライド
WebView側で基本設定に不足がないかチェック

この３点をとりあえず確認しておけばOKです。

以上、WebViewでカメラ起動しない時の対処でした。ではまた

【Android】WebView内でカメラ起動させる正しい設定・コード例

１．起動時にカメラのパーミッションを許可させる

AndroidManifest.xmlにパーミッション追加

アプリ起動時にカメラ起動の許可を取る

２．WebViewでonPermissionRequestをオーバーライド

３．WebView側で基本設定が抜けていないかもチェック

WebViewでカメラ起動しない時のチェックリスト

関連記事

プロフィール

人気記事

検索してみる