解决webview类APP调用dplayer、aliplayer等H5播放器全屏不能自动横屏_webview引入h5播放器

以APICLOUD 调用免费模块WebBrower 类APP为例

首先APP需要安装X5核心，然后在你的播放器代码类添加相关代码

dplayer

在里面加入下面代码

var isMobile = !!navigator.userAgent.match(/AppleWebKit.*Mobile.*/);
                                if (isMobile) {
                                        //全屏事件
                                        dp.on('fullscreen',function() {
                                                screen.orientation.lock("landscape");
                                        });
                                        //退出全屏事件
                                        dp.on('fullscreen_cancel',function() {
                                                screen.orientation.unlock();
                                        });
                                        
                                }
1
2
3
4
5
6
7
8
9
10
11
12

代码里面的dp.on 这个dp要看你个人定义播放器名称

aliplayer

var isMobile = !!navigator.userAgent.match(/AppleWebKit.*Mobile.*/);
                                if (isMobile) {
                                        //全屏事件
                                        player.on('requestFullScreen',function() {
                                                screen.orientation.lock("landscape");
                                        });
                                        //退出全屏事件
                                        player.on('cancelFullScreen',function() {
                                                screen.orientation.unlock();
                                        });
                                        
                                }
1
2
3
4
5
6
7
8
9
10
11
12

代码里面的player.on 这个player要看你个人定义播放器名称

总结

找到你要使用播放器全屏 事件绑定 screen.orientation.lock(“landscape”);
退出全屏事件绑定 screen.orientation.unlock();
理轮上所有的H5播放器都能自动横屏

参考

screen.orientation
https://developer.mozilla.org/zh-CN/docs/Web/API/Screen/orientation