05/22
2016
我在做pixiv图片下载器的时候，需要用php在硬盘上建立文件夹。有些文件夹的名字含有中文，那就需要转换为gbk编码，不然出来是乱码。
之前我是这样转换的：
iconv('utf-8', 'gbk', "【20周年♡】魔卡少女樱特辑");
但有时候会遇到问题，例如上面“周年”后面的心，在gbk里面没有，转换的时候会出错。一旦出错，这条语句就停止执行了，我们只能得到前半截“【20周年”，后面什么都没了。
今天这个现象又发生了，上网查了查，原来加上ignore参数就可以忽略出错的字符，继续转换。
iconv('utf-8', 'gbk//ignore', "【20周年♡】魔卡少女樱特辑");
现在，这个心会被忽略掉，我们能得到较为满意的结果“【20周年】魔卡少女樱特辑”。
另外还有个参数//TRANSLIT是遇到错误时替换为相近的字符，但是这个效果很难说啊，我是没有用。
php使用iconv转换编码时忽略错误字符的办法
05/21
2016
<?php
header("Access-Control-Allow-Origin:http://spotlight.pics");
$url=$_GET['url'];
$refer = "http://www.pixiv.net/";
$cookie = "key1=value1;key2=value2;key3=value3";//设置cookie信息
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_BINARYTRANSFER, true);
curl_setopt($ch, CURLOPT_REFERER, $refer);
curl_setopt($ch, CURLOPT_COOKIE, $cookie);//携带cookie信息
$cexecute = curl_exec($ch);
if ($cexecute) {
echo $cexecute;
}else{
echo "false";
}
curl_close($ch);
?>
主要就是带注释的那两句。$cookie里的值只是个示范，我当然不会把自己的cookie暴露出来滴~设置好一些必须的cookie就能以登录状态抓取网页了。
今天有人想让我给pixiv图片下载器增加下载pixiv Spotlight的功能。这里面涉及到两个问题，一个是跨域，一个是登陆状态。
首先看看跨域问题。pixiv Spotlight的主域名不是pixiv.net，而是spotlight.pics。以前我抓取网页没有遇到跨域问题，因为那时全都是在pixiv.net域中操作的，用ajax就可以获取到其他网页的内容。现在不行了，只能在自己服务器上做了个如上的php文件，在header中设置Access-Control-Allow-Origin来接收来自pixiv Spotlight的请求。接收到请求后，就去抓取网页。
这时就遇到第二个问题了。因为抓取是从我服务器发出的，不是从浏览器发出的，所以没有cookie，抓取到的网页是未登录时会出现的注册页面。后来搜到了CURLOPT_COOKIE这个参数，可以在curl中携带cookie信息，这样就像正常登陆一样，能获取到登陆后的页面了。这样才解决了问题。
现在我php里设置的cookie信息是我自己的，一直使用现在的cookie值不知道以后会不会失效。只能用着看了。
php带cookie访问网页
05/19
2016
如果chrome浏览器中有了重复书签，我们可以使用Bookmark Checker这个扩展来检查。但是Bookmark Checker的检查结果没有把重复书签放到一起，如果重复书签较多的话，找起来就非常费事。所以我写了一段JavaScript代码来重新组织Bookmark Checker的结果页面，以提高去重的效率。
首先安装Bookmark Checker，之后在浏览器的工具栏上点击它以打开操作界面。
在下拉框选择“duplicate”，然后点击下方的“check”按钮，即可开始检查重复的书签。
等它检查完毕并且显示了结果页面后，请打开控制台，粘贴执行位于本文末尾的代码。
Read More →
chrome查找重复书签之Bookmark Checker改进办法
05/19
2016
今天用js做了个元素移动的效果，支持水平、垂直方向上的单次移动和来回移动，支持斜向运动（斜向运动时自带反弹效果 哈哈）。
假设这个元素是我们想要移动的：
<img id="moveE" src="http://www.saber.我爱你/wp-content/uploads/2014/07/1_b.gif">
它可以是图片，也可以是其他元素。可以定义css样式，这个没关系。
js代码如下：
function move_on(element,far,to,cishu,time) {
var add=(to%2==1)?true:false;
var num=(to<3)?((element.style.marginLeft==="")?0:parseInt(element.style.marginLeft)):((element.style.marginTop==="")?0:parseInt(element.style.marginTop));
var max=(to%2==1)?(num+far):num;
var min=(to%2==1)?num:(num+far);
var time=setInterval(function () {
if(add){
num++;
(to<3)?(element.style.marginLeft=num+"px"):(element.style.marginTop=num+"px");
if(num>=max){
add=false;
cishu--;
if(cishu==0){clearInterval(time)}
}
}else{
num--;
(to<3)?(element.style.marginLeft=num+"px"):(element.style.marginTop=num+"px");
if(num<=min){
add=true;
cishu--;
if(cishu==0){clearInterval(time)}
}
}
},time);
}
（代码挺短的吧~三元操作符真是个好东西啊
参数解释：
要移动的元素、移动多少像素、移动类型、移动次数、定时器执行间隔时间（毫秒） 移动类型规定如下： 1 左右来回移动，起始点是从左向右 2 左右来回移动，起始点是从右向左 3 上下来回移动，起始点是从上向下 4 上下来回移动，起始点是从下向上 移动次数定义如下： 为0时为无限制来回移动，否则定义为多少则移动多少次。注意，一次单向运动算1次，一次来回运动算2次。
可能看的有点迷，没关系，接下来我一个个上例子。
Read More →
js做的元素不间断来回移动的效果
05/15
2016
昨天发表的那个网站地图助手里，有几个输入框都需要在鼠标经过时自动选中其中的内容。
实现起来没有难度，但类似于getElementBy...这样的选择器难以在不写重复代码的情况下选中几个不同id的元素。所以我的代码写成了这样：
document.getElementById("a").onmouseover=function (argument) {
this.select();
}
document.getElementById("b").onmouseover=function (argument) {
this.select();
}
document.getElementById("y").onmouseover=function (argument) {
this.select();
}
document.getElementById("c").onmouseover=function (argument) {
this.select();
}
感觉这样实在无法见人，于是去贴吧求助。终于知道了一个好办法：js现在有了一个原生的querySelectorAll方法，可以接受一组css选择器风格的字符串来作为选择器（这点和jQuery很像），如下：
document.querySelectorAll('#a,#b,#c,#y');
这样就解决了重复获取元素的问题了。querySelectorAll简直是一个福音啊。
querySelectorAll和querySelector是HTML5中新增的属性，但是IE8也支持。所以放心的用吧~
由于我们是无法对一个元素集合直接添加事件的，只能用循环来加了（所以jQuery用起来还是更方便啊）。使用for循环就可以，forEach也可以（使用forEach更有逼格？）。不过元素集合并不是数组，要使用forEach的话需要借用数组的属性。于是最后的代码如下：
function selectS(s){
return document.querySelectorAll(s);
}
[].forEach.call(selectS('#a,#b,#c,#y'),function(e){
e.onmouseover=function (argument) {
this.select();
}
});
原生js中的利器——querySelectorAll
05/12
2016
在PHPnow中，如果只有一个ip但是要建立多个网站，比较简单的办法是在站点根目录下分别建立文件夹，并将网站放进去。
但这样容易产生一些问题。如，本来站点根目录是127.0.0.1，然后我们为网站“pc”建立了一个“pc”文件夹存放网站，它的网址如下：
127.0.0.1/pc
网站程序安装在里面，必须在网站后台正确设置安装路径，否则后台会以为自己在站点根目录。例如pc的首页路径应该如下：
127.0.0.1/pc/index.html
如果不设置安装路径的话，后台会以为是这样：
127.0.0.1/index.html
所有涉及到路径的地方都会受到影响。
而且，即使我们正确设置了安装路径，如果网站以后要挪到其他地方去（例如上线），服务器上一般都不存在“安装路径”这个问题，到时候还得把相关设置去掉。这需要修改数据库中的多个地方，参考《 dedecms从数据库备份文件修改附件路径》。我不想一直这样下去，于是找到了同一ip中使用多端口配置多个网站的办法。
Read More →
PHPnow同一IP多端口配置
05/3
2016
16.5.19更新：
推荐配合Bookmark Checker扩展来去除重复书签。方法见此。
因为种种原因，chrome中可能会存在一些重复的书签。我前天同步浏览器数据时就被坑了，有两百个书签重复了。
我先是找到了“Bookmark Checker”这个扩展，它可以检查重复书签，但显示结果时没有把重复项放一起，只能靠眼睛去找。而且它页面上的文字还无法复制，这导致我们无法使用ctrl+F来查找匹配项。最后我只好自己写一个。
使用步骤如下：
首先在书签管理器中导出书签为html文件，这个步骤不截图了，不会的可以百度。
导出之后，打开该html文件，如图：
使用JavaScript检查chrome中的重复书签
04/29
2016
保利威视是一家视频托管服务商，里面的每一个视频都有一个特有的编号，即vid。
我需要获取多个列表中多个视频的vid，由于用鼠标选取效率低下，所以写了两句js，用js自动获取div并输出到控制台。没有技术含量，放在这里当做备忘吧。
进入新版管理后台，之后打开一个视频列表，如上图所示。在此页面中执行下面的js代码，即可获得当前列表中所有的vid：
var a=$("p.text-muted");
for(var i=0;i<a.length;i++){
console.log(a.eq(i).text().split("| ")[1]);
}
选中全部输出结果，复制进编辑器，再批量删除不需要的文字，就大功告成了。
批量获取保利威视视频vid的一段js代码
04/22
2016
当你在浏览某些网页时，可能会看到浏览器左上角显示了一个选项（以chrome为例），询问你是否允许此网页显示通知：
如果允许了，该网页可以在浏览器右下角显示通知，外观大致如下：
这是使用HTML5的Notification API发送的提醒，它是简便并易于使用的。如果我们要在网页上这么做，我们需要向用户请求授权，并创建一个消息。示例如下：
if(Notification && Notification.permission !== "granted"){ //如果未授权
//向用户请求授权
Notification.requestPermission(function(status){
if(Notification.permission !== status){
Notification.permission = status;
}
});
}
//定时检测是否允许了授权
var noteT=setInterval(function(){
if(Notification && Notification.permission === "granted"){ //如果已经授权
creatNote ();
clearInterval(noteT);
}
},500);
function creatNote () {
//创建一个提醒
var newNote=new Notification("saber酱的抱枕",{ //定义标题和选项
lang: "utf-8",
icon:"/f/head10.png", //图片尺寸大于一定数字才会铺满左侧icon区域
tag:"saber",
body:"试问，你就是我的master吗？" //消息的主体
});
//为提醒添加事件
newNote.onclose=function(){
alert("555，不要关掉我嘛");
}
}
至此一个简单的示例就完成了。测试时需要在web环境中测试，在本地路径这是无效的。
我们还可以向通知添加事件，以检测用户的操作。Notification对象有四个事件，分别是onshow()、onclick()、onclose()、onerror()。注意，如果消息显示后你放任不管，过一段时间浏览器会自动关闭它，那时将会自动触发onclose事件。firefox浏览器会很快的自动关闭通知，chrome浏览器则会让通知显示的更久一些。
使用HTML5 Notification API发送桌面提醒
04/20
2016
跨域问题是web开发中一个常见的问题。例如说从网站a.com上用ajax把一些信息发送到b.com上，就会产生跨域问题。浏览器为了安全会阻止这个跨域请求，并产生一个跨域错误。
如果接收方b.com对应的文件是php文件，则可以在header函数中指定Access-Control-Allow-Origin的值，来设置哪些域名可以向这里发送跨域请求。
示例：
ajax请求如下（本彩笔使用了jq的ajax）：
$.ajax({
url:"http://127.0.0.1/t/t.php",
type:"get",
async:true,
cache:false,
dataType:"text",
success:function (data) {
alert(data);
}
});
php文件添加Access-Control-Allow-Origin头：
header("Access-Control-Allow-Origin:*"); // 允许指定域名发起的跨域请求
//header("Access-Control-Allow-Origin:http://tieba.baidu.com"); // 允许指定域名发起的跨域请求
echo "saber";
这就ok了。
Read More →
