搜索引擎来路提醒小窗

看到张戈博客的来路提醒小窗口功能很好玩，所以自己利用Notification和layui的提示窗口写了一个来路提醒的小窗。

具体效果如下：

如果桌面浏览器不允许Notification通知权限或者不支持Notification就会使用layerui(什么是Notification?)

当桌面浏览器允许Notification通知权限后就会使用Notification

下面是源码

<?php
/**
 * 获取网站来路并分析
 * @author Youngxj <blog@youngxj.cn>
 * @time   2018年6月27日
 * @param  string $referers 自定义ua
 * @return strting/bool     输出获取到的来路
 */
function get_referer($referers=''){
	// 更改为自己的网址
	// 避免来路重复
	$localhost = 'blog.youngxj.cn';
	/*获取网站来路*/
	$referer = $referers ? $referers : $_SERVER['HTTP_REFERER'];
	if(!$referer){
		return false;
	}

	/*获取网站host*/
	$str = parse_url($referer);
	if (!$str['host']||$str['host']==$localhost) {
		return false;
	}
	$url = $str['host'];

	/*关键词判断类型*/
	if(strpos($url,'baidu') !== false){
		$url_str = '百度搜索';
	}elseif (strpos($url,'sogou') !== false) {
		$url_str = '搜狗搜索';
	}elseif (strpos($url,'sm') !== false) {
		$url_str = '神马搜索';
	}elseif (strpos($url,'bing') !== false) {
		$url_str = '必应搜索';
	}elseif (strpos($url,'google') !== false) {
		$url_str = '谷歌搜索';
	}elseif (strpos($url,'so') !== false) {
		$url_str = '360搜索';
	}elseif (strpos($url,'easou') !== false) {
		$url_str = '宜搜搜索';
	}elseif (strpos($url,'yahoo') !== false) {
		$url_str = '雅虎搜索';
	}else{
		/*如果以上都找不到则使用来路域名并截取字数*/
		if (strlen($url)>5) $url_str=substr($url,0,10) . '...';
	}
	return $url_str;
}
?>
<script src="layui/layui.js"></script>
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<?php if(get_referer()){?>
<script>
	var popNotice = function() {
		//获取用户授权状态
		if (Notification.permission == "granted") {  
			var notification = new Notification("欢迎来自<?php echo get_referer();?>的朋友", {  
                //很明显这是正文
                body: '若当前文章未能解决您的问题，您可以先尝试站内搜索，当然也可以给我留言喔(^_^)!',
                //很明显这是图标  
                icon: 'https://ww2.sinaimg.cn/large/005BYqpgly1fsnpxsctd7j305k05kwec.jpg'  
            });  
            //消息被点击事件
            notification.onclick = function() {  
            	/*window.open("<?php echo $_SERVER['HTTP_REFERER'];?>");*/  
            };  
			//消息被关闭事件
			notification.onclose  = function() {
				notification.close();      
			};
			//消息出现错误事件
			notification.onerror  = function() {  
				alert('上帝也不知道发生了什么');  
				notification.close();      
			};
		}      
	};  

	if (window.Notification) {
		if (Notification.permission == "granted") {
			popNotice();  

		}else if( Notification.permission != "denied"){
			Notification.requestPermission(function (permission) {  
				popNotice();  
			});  
		}  
	} else {
		echo_layer();
	}  
	function echo_layer(){
		layui.define(['layer', 'form'], function(exports){
			var layer = layui.layer
			,form = layui.form;

			layer.open({
				title: '<i class="layui-icon layui-icon-face-smile" style="color: #1E9FFF;"></i> 欢迎来自<?php echo get_referer();?>的朋友'
				,content: '<i class="layui-icon layui-icon-group" style="color: green;"></i>若当前文章未能解决您的问题，您可以先尝试站内搜索，当然也可以给我留言喔(^_^)!'
				,offset: 'rb'
				,time:5000
				,anim:2
				,moveOut: true
				,maxmin: true
				,shade: 0
				,btn: ['确认', '关闭']
				,yes: function(index, layero){
					/*window.open("<?php echo $_SERVER['HTTP_REFERER'];?>");*/  
				}
				,btn2: function(index, layero){
				}
				,cancel: function(){ 
				}
			}); 

			exports('index', {}); 
		});    
		
	}
	Notification.requestPermission().then(function(result) {
		if (result === 'denied') {
			echo_layer();
			console.log('许可不获批准。允许重试');
			return;
		}
		if (result === 'default') {
			echo_layer();
			console.log('许可请求被驳回。');
			return;
		}
	});
</script>
<?php }?>

说一下emlog如何引入这个

1、先把<?php function get_referer($referers=''){.....}?>整段函数复制到module.php

2、然后去header.php引入layui.js和layui.css

3、之后再把<?php if(get_referer()){?>....<?php }?>整段代码放到footer.php即可

4、最后使用搜索引擎或者友情链接进行测试来路测试。

ps:小杰还没有写搜索关键词判断，后面有时间再搞吧。先把框架发在这里，技术大佬可以自行修改样式