实践的目标:
1.在hao123选择链接的时候能发现状态栏正常,但是点击后能明显发现跳转的链接是经过处理的。
比如点击http://www.163.com/会实际跳转https://www.hao123.com/link/https/?key=http%3A%2F%2Fwww.163.com%2F&&monkey=m-mingzhan-site&c=xxx。
故打算在外链后加个小尾巴“?from=myscis.cn”。
2.在一个博客发现其所有的外链全通过base64处理,觉得挺有意思的,故打算自己写出来。
比如跳转https://myscis.cn的链接地址为https://myscis.cn/go/aHR0cHM6Ly9teXNjaXMuY24=,其中aHR0cHM6Ly9teXNjaXMuY24=为https://myscis.cn经过base64处理的结果。
实现途径:
1.监听并拦截点击链接事件,并处理链接后实现跳转。
2.通过php动态处理编码后的url,并跳转外链。
实践记录:
1.目标1
写demo.js拦截跳转
//在网站主目录下创建demo.js
cd /usr/share/nginx/html
vim demo.js
var urls = document.querySelectorAll('a')
Array.prototype.forEach.call(urls, function (url) {
url.addEventListener('click', function (click) {
//引入判断区分是否是站内链接,如果是则不拦截。
if(!this.href.match(location.hostname)){
click.preventDefault()
//js由于没有原生base64处理,所以需要引入base64函数;
window.location.href="go/"+toBase64(this.href);
//也可以直接跳转并添加?from=hostname
//window.location.href=this.href + "?from=" + location.hostname;
}
})
})
//fork from http://blog.csdn.net/maoxiao1229/article/details/7971814
/** Convert data (an array of integers) to a Base64 string. */
var toBase64Table = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
var base64Pad = '=';
function toBase64(data) {
var result = '';
var length = data.length;
var i;
// Convert every three bytes to 4 ascii characters.
for (i = 0; i < (length - 2); i += 3) {
result += toBase64Table[data.charCodeAt(i) >> 2];
result += toBase64Table[((data.charCodeAt(i) & 0x03) << 4) + (data.charCodeAt(i + 1) >> 4)];
result += toBase64Table[((data.charCodeAt(i + 1) & 0x0f) << 2) + (data.charCodeAt(i + 2) >> 6)];
result += toBase64Table[data.charCodeAt(i + 2) & 0x3f];
}
// Convert the remaining 1 or 2 bytes, pad out to 4 characters.
if (length % 3) {
i = length - (length % 3);
result += toBase64Table[data.charCodeAt(i) >> 2];
if ((length % 3) == 2) {
result += toBase64Table[((data.charCodeAt(i) & 0x03) << 4) + (data.charCodeAt(i + 1) >> 4)];
result += toBase64Table[(data.charCodeAt(i + 1) & 0x0f) << 2];
result += base64Pad;
} else {
result += toBase64Table[(data.charCodeAt(i) & 0x03) << 4];
result += base64Pad + base64Pad;
}
}
return result;
}
将此js加载在页面最后,比如在wp中可添加到当前主题footer.php中,于</html>前插入即可。
<script type="text/javascript" src="demo.js"></script>
2.目标2
上一步已经将外链base64编码并跳转至hostname/go/base64code,我们需要对其进行解码。
首先,在nginx配置文件中设置,将请求转到hostname/go.php。
vim /etc/nginx/sites-available/default
//在server段内添加下面的配置并保存。
location ^~ /go/ {
try_files $uri /go.php?t=$uri;
}
//重新加载nginx配置
nginx -s reload
其次,网站根目录新建go.php
cd /usr/share/nginx/html
vim go.php
go.php如下
<?php
function back(){
if( isset($_SERVER["HTTP_REFERER"] )) {
echo "无效地址~5秒之后将跳转回上一页~";
echo "<meta http-equiv='refresh'content=5;URL='".$_SERVER["HTTP_REFERER"]."'>";
}else{
echo "无效地址~5秒之后将跳转首页~";
echo "<meta http-equiv='refresh'content=5;URL='http://".$_SERVER["HTTP_HOST"]."'>";
}
}
if(isset($_GET['t'])){
$url = $_GET['t'];
}else{
back();
die;
}
$url = rtrim($url, '/');
$count = 1;
$url = str_replace("/go/", "", $url, $count);
$url_de = base64_decode($url);
if($url == base64_encode($url_de)){
//添加识别http、https的处理;
if ( ! preg_match('/(http:\/\/)|(https:\/\/)/i', $url_de)) {
$url_de = "http://".$url_de;
}
header("Location:".$url_de."?from=".$_SERVER["HTTP_HOST"]);
}else{
back();
}
?>
至此,两个目标已完成。