Safety Guest'T blog

  • 首页
  • 归档
  • 软件开发
  • 网络安全
  • 逆向破解
  • 人工智能
  • 资源分享
  • 区 块 链
  • 隐私政策
  • 友情链接

H5调用设备系统通知

  • Tz
  • 2023-06-19
  • 0

达到效果

将下面代码直接放在html的js文件里即可(尽量HTTPS不然容易被浏览器拦截)

/**
* 通过Html调用显示系统通知
* @param title
* @param msg
* @param imgUrl
*/
function showNotification(title, msg, imgUrl) {
    var Notification = window.Notification || window.mozNotification || window.webkitNotification;
    // 判断浏览器是否支持桌面通知
    if (Notification) {
        Notification.requestPermission(function (result) {
            //result 默认值'default'等同于拒绝 'denied' -用户选择了拒绝 'granted' -用户同意启用通知
            if ("granted" != result) {
                alert('请授权浏览器能够进行通知!');
                $.alert({
                    title: 'Auto close',
                    content: '请授权浏览器能够进行通知',
                    autoClose: 'cancelAction|5000',
                    escapeKey: 'cancelAction',
                    buttons: {
                        confirm: {
                            btnClass: 'btn-info',
                            text: '拉起授权',
                            action: function () {
                                $.alert('You deleted Ben\'s account!');
                            }
                        },
                        cancelAction: {
                            text: '取消',
                            action: function () {
                                promptc();
                            }
                        }
                    }
                });
                promptc();
                return false;
            } else {
                var tag = "sds" + Math.random();
                var notify = new Notification(
                    title,
                    {
                        dir: 'auto',
                        lang: 'zh-CN',
                        tag: tag,//实例化的notification的id
                        icon: imgUrl,//通知的缩略图,icon 支持ico、png、jpg、jpeg格式
                        title: title, //通知的标题
                        body: msg //通知的具体内容
                    }
                );
                // 定义通知窗口点击函数
                notify.onclick = function () {
                    //如果通知消息被点击,通知窗口将被激活
                    window.focus();
                };
                // 定义通知错误事件
                notify.onerror = function () {
                    // console.log("");
                };
                // 定义通知显示事件 可以设置多少秒之后关闭 也可以不设置关闭
                notify.onshow = function () {
                    // 窗口显示 播放音频
                    var audio = new Audio("./10418.wav");
                    audio.play();
                    // 窗口显示3S后关闭
                    setTimeout(function () {
                        notify.close();
                    }, 3000);
                };
                // 定义通知关闭事件
                notify.onclose = function () {
                };
            }
        });
    } else {
        // 提示不支持系统通知
        alert('您的浏览器不支持系统通知,建议使用Chrome浏览');
    }
}
showNotification('通知标题', '通知内容', './demo.jpg');
© 2025 Safety Guest'T blog
Theme by Wing
渝ICP备 2021011909号 渝公网安备 50019002502382号
  • {{ item.name }}
  • {{ item.name }}