uniapp的app端推送功能,不使用unipush

1:推送功能使用htmlPlus实现:地址HTML5+ API Reference (html5plus.org)

效果图:

代码实现:

javascript 复制代码
<template>
	<view class="content">
		<view class="text-area">
			<button @click="createMsg">本地消息</button>
		</view>
		<button @click="openquanxian">跳转系统授权管理页</button>
        <button @click="getquanxian">获取 APP 授权设置</button>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted,
		nextTick
	} from 'vue';
	onMounted(() => {

	})
	const openquanxian = () => {
		uni.openAppAuthorizeSetting({
			success(res) {
				console.log(res)
			}
		})

	}
	const getquanxian = () => {
		let info = uni.getAppAuthorizeSetting()
		console.log('log', info);
	}
	// #ifdef APP-PLUS
	let ClientInfo = ref()
	let AllMessage = ref()
	const createMsg = () => {
		plus.push.createMessage('我是一条本地消息', '', {
			title: 'xxx科技',
		})
		ClientInfo.value = plus.push.getClientInfo()
		console.log('log', ClientInfo.value);
		AllMessage.value = plus.push.getAllMessage()
		console.log('log', AllMessage.value);
		// plus.push.setAutoNotification(true);

	}
	plus.push.addEventListener('click', function(success) {
		console.log('logsss', success);
	});
	// #endif
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>

请注意要实现消息推送功能,前提是应用的通知权限要打开

以上代码已实现从应用内跳到应用权限页,在实际工作中用户刚打开应用就要判断应用的通知权限是否打开,uniapp中有相关方法,如果获取到的值是没有打开的状态就要显示弹框询问是否打开通知权限,点击确定就跳转到应用权限页

相关推荐
滴水未满12 小时前
uniapp的调试和安装
uni-app
2501_9159090614 小时前
设置了 SSL Pinning 与双向 TLS 验证要怎么抓包
网络·网络协议·ios·小程序·uni-app·iphone·ssl
壹号机长15 小时前
vue3+uniapp 今天及未来六天日期的时间段预约选择,时间段预约当前时间之前禁用选择
uni-app
滴水未满18 小时前
uniapp的页面
前端·uni-app
2501_9160074720 小时前
如何查看 iOS 设备系统与硬件信息,iOS系统信息显示工具
android·ios·小程序·https·uni-app·iphone·webview
2501_916007471 天前
iOS APP 开发,从项目创建、证书与描述文件配置、安装测试和IPA 上传
android·ios·小程序·https·uni-app·iphone·webview
滴水未满1 天前
uniapp的工程
前端·uni-app
云上凯歌2 天前
01_AI工具平台项目概述.md
人工智能·python·uni-app
郑州光合科技余经理2 天前
O2O上门预约小程序:全栈解决方案
java·大数据·开发语言·人工智能·小程序·uni-app·php
2501_916008892 天前
在不越狱前提下导出 iOS 应用文件的过程,访问应用沙盒目录,获取真实数据
android·macos·ios·小程序·uni-app·cocoa·iphone