uniapp app解决video层级太高的问题 和截屏的问题

<template>
	<view id="appdom" class="uni-container" v-if="srcUrl">
		<web-view :src="srcUrl" @message="receiveData"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				srcUrl: ""
			}
		},
		onLoad(optinos) {
			let id = optinos.id
			console.log('id=>', id);
			let token = this.$tui.getToken();
			this.srcUrl = `/hybrid/html/index.html?token=${encodeURIComponent(token)}&id=${encodeURIComponent(id)}`
			// #ifdef APP-PLUS
			plus.screen.lockOrientation('landscape-primary'); //锁定横屏
			plus.navigator.setFullscreen(true); //隐藏状态栏(应用全屏:只能隐藏状态栏,标题栏和虚拟返回键都还可以显示)		

			// #endif  
			// this.updaterpxBase();
			// window.addEventListener('resize', this.updaterpxBase);
		},
		methods: {
			receiveData(data) {
				console.log("收到来自webview的消息:", JSON.stringify(data))
				// {"type":"message","target":{},"currentTarget":{},"timeStamp":1730172200361,"detail":{"data":[{"id":"1847571867993395202","msg":"截屏"}]}} 
				let dt = JSON.parse(JSON.stringify(data))
				if (dt.detail.data[0].msg == "截屏") {
					console.log('----------------------------', '截屏')
					let that = this;
					var pages = getCurrentPages();
					var page = pages[pages.length - 1];
					console.log("当前页" + (pages.length - 1));
					var bitmap = null;
					var currentWebview = page.$getAppWebview();
					// #ifdef APP-PLUS
					// bitmap = new plus.nativeObj.Bitmap('amway_img');
					bitmap = new plus.nativeObj.Bitmap('bitmap' + Date.now());
					// 将webview内容绘制到Bitmap对象中  
					// 延迟截取,确保页面完全渲染
					uni.showLoading({
						mask: true,
						title: '请稍候...'
					});
					currentWebview.draw(bitmap, function() {
						console.log('截屏绘制图片成功');
						let png = 'img' + Date.now() + ".png"
						console.log(png)
						bitmap.save("_doc/" + png, {}, function(i) {
							console.log('保存图片成功:' + JSON.stringify(i));
							// pageImage.value = i.target;
							that.$api.uploadimg({
								file: i.target,
								id: dt.detail.data[0].id
							}).then(res => {
								if (res.code == 200) {
									uni.showToast({
										title: res.msg,
										icon: 'none',
										duration: 2000
									})

								}
							})
						}, function(e) {
							console.log('保存图片失败:' + JSON.stringify(e));
						});
					}, function(e) {
						console.log('截屏绘制图片失败:' + JSON.stringify(e));
					});
					// #endif
				}

			},
		}
	}
</script>

<style>

</style>

在 index.html 引入官方 uni.webview.1.5.6.js 点击一个点击事件

uni.postMessage({
	data: {
		msg: '截屏',
		id: that.captureid
	}
});

截取手机界面视频画面是黑色的问题没有解决

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值