1***@qq.com
1***@qq.com
  • 发布:2021-03-14 22:58
  • 更新:2021-06-22 14:49
  • 阅读:2125

uniapp打包h5,用android原生webview嵌入uni打包的h5项目,video播放有声音画面白屏

分类:uni-app

使用uni-app打包项目成h5页面,使用android studio 创建的android项目webview嵌入h5页面,打包成apk,播放mp4视频时有声音,但是视频画面是白屏,鼠标在白屏画面左右拖动有快进的提示,视频也会跟着快进或后退做出相应的前进和后退。

h5页面在chrome中视频可以正常播放。
使用android原生播放视频也可以正常播放。
使用原生android webview嵌入h5页面有声音,视频画面白屏

android系统7.1.2
hbuilderx最新版

uniapp 代码

data() {  
    return {  
        noticeModal: false,  
        noticeVideoUrl: 'https://api.aaaaaa.com.cn/ad02.mp4',  
        noticeAutoplay: false,  
    }  
},  
<view v-if="noticeModal" class="notice-diagle">  
            <view class="notice">  
                    <video class="video-wrap" id="noticeVideo"   
                    :controls="false"   
                    :autoplay="noticeAutoplay"  
                    :loop="true"  
                    :muted="false"  
                    :src="noticeVideoUrl">  
                    </video>  
            </view>  
            <view class="notice-close" @click="closeNotice">  
                <text class="notice-close-tip">X</text>  
            </view>  
        </view>

android webview代码


    <WebView  
        android:id="@+id/web_view"  
        android:layout_width="match_parent"  
        android:layout_height="match_parent"  
        android:layerType="hardware"  
        />  

        webView = findViewById(R.id.web_view);  
        webView.addJavascriptInterface(new DeviceAppInterface(this),"Android");  
        webView.setWebViewClient(new WebViewClient(){  
            @Override  
            public boolean shouldOverrideUrlLoading(WebView view, String url) {  
                view.loadUrl(url);  
                return true;  
            }  
        });  
        webView.loadUrl("https://aaaaa.html");// h5页面地址  

        // websettings  
        WebSettings webSettings = webView.getSettings();  
        // 不使用缓存  
        webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE);  
        // 开启javascript支持  
        webSettings.setJavaScriptEnabled(true);  
        // 视频不使用手势点击播放按钮可以自动播放  
        webSettings.setMediaPlaybackRequiresUserGesture(false);  
        // 支持viewport  
        webSettings.setUseWideViewPort(true);  
        // 自适应屏幕  
        webSettings.setLoadWithOverviewMode(true);  
        webSettings.setAllowFileAccess(true);  

        //webView  加载视频  
        if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT){  
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {  
                webSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);  
            }  
        }  

        webSettings.setPluginState(WebSettings.PluginState.ON);  
        webSettings.setAllowFileAccess(true);  
        webSettings.setSupportZoom(true);  
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {  
            webSettings.setMixedContentMode(WebSettings.MIXED_CONTENT_ALWAYS_ALLOW);  
        }
2021-03-14 22:58 负责人:无 分享
已邀请:
初学者123

初学者123 - 80后IT男

问题解决了吗?
我也遇到这个问题,不过不是在安卓,而是在苹果上。安卓播放没问题

该问题目前已经被锁定, 无法添加新回复