踩了apache配置虚拟主机的坑

一直使用xampp做apache服务器,可是新版的xampp添加了虚拟主机就访问127.0.0.1也跳转到了虚拟主机去了,比如:我添加了www.demo.com,路径是e:\www\demo,而我的添加完之后,访问127.0.0.1竟然也是跑到了www.demo.com下面去。

上网找了好多资料说是添加localhost的,于是在httpd.conf最后添加如下配置:

<VirtualHost *>
    DocumentRoot E:\www
    ServerName 127.0.0.1
#    ErrorLog logs/default-error_log
</VirtualHost>

<Directory "E:\www">
    Options Indexes FollowSymLinks Multiviews
    AllowOverride All
    Order Allow,Deny
    Allow from all
</Directory>

发现还是不行,继续查找,期间安装了PHPnow,也是类似的情况,后来无意中看到了NameVirtualHost这个配置,于是写成了:

NameVirtualHost *

重启apache竟然可以了,坑爹啊,记录下,防止下次踩坑!

过滤XSS(跨站脚本攻击)的函数和防止svn版本库被浏览

别处看到的php去除xss的函数,自己备份下,以备不时之需。

php过滤xss函数

<?php
/**
* @过滤XSS(跨站脚本攻击)的函数
* @par $val 字符串参数,可能包含恶意的脚本代码如
* <script language="javascript">alert("hello world");</script>
* @return  处理后的字符串
* @Recoded By Androidyue
**/
function RemoveXSS($val) {
   // remove all non-printable characters. CR(0a) and LF(0b)
   // and TAB(9) are allowed
   // this prevents some character re-spacing such as <java\0script>
   // note that you have to handle splits with \n, \r,
   // and \t later since they *are* allowed in some inputs
   $val = preg_replace('/([\x00-\x08,\x0b-\x0c,\x0e-\x19])/', '', $val);

   // straight replacements, the user should never need these
   // since they're normal characters
   // this prevents like ![](@avascript:alert()
   $search = 'abcdefghijklmnopqrstuvwxyz';
   $search .= 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
   $search .= '1234567890!@#$%^&*()';
   $search .= '~`";:?+/={}[]-_|\'\\';
   for ($i = 0; $i < strlen($search); $i++) {
      // ;? matches the ;, which is optional
      // 0{0,7} matches any padded zeros, which are optional and go up to 8 chars

      // @ @ search for the hex values
      $val = preg_replace('/(&#[xX]0{0,8}'.dechex(ord($search[$i])).';?)/i', $search[$i], $val); // with a ;
      // @ @ 0{0,7} matches '0' zero to seven times
      $val = preg_replace('/(&#0{0,8}'.ord($search[$i]).';?)/', $search[$i], $val); // with a ;
   }

   // now the only remaining whitespace attacks are \t, \n, and \r
   $ra1 = Array('javascript', 'vbscript', 'expression', 'applet', 'meta', 'xml', 'blink', 'link', 'style', 'script', 'embed', 'object', 'iframe', 'frame', 'frameset', 'ilayer', 'layer', 'bgsound', 'title', 'base');
   $ra2 = Array('onabort', 'onactivate', 'onafterprint', 'onafterupdate', 'onbeforeactivate', 'onbeforecopy', 'onbeforecut', 'onbeforedeactivate', 'onbeforeeditfocus', 'onbeforepaste', 'onbeforeprint', 'onbeforeunload', 'onbeforeupdate', 'onblur', 'onbounce', 'oncellchange', 'onchange', 'onclick', 'oncontextmenu', 'oncontrolselect', 'oncopy', 'oncut', 'ondataavailable', 'ondatasetchanged', 'ondatasetcomplete', 'ondblclick', 'ondeactivate', 'ondrag', 'ondragend', 'ondragenter', 'ondragleave', 'ondragover', 'ondragstart', 'ondrop', 'onerror', 'onerrorupdate', 'onfilterchange', 'onfinish', 'onfocus', 'onfocusin', 'onfocusout', 'onhelp', 'onkeydown', 'onkeypress', 'onkeyup', 'onlayoutcomplete', 'onload', 'onlosecapture', 'onmousedown', 'onmouseenter', 'onmouseleave', 'onmousemove', 'onmouseout', 'onmouseover', 'onmouseup', 'onmousewheel', 'onmove', 'onmoveend', 'onmovestart', 'onpaste', 'onpropertychange', 'onreadystatechange', 'onreset', 'onresize', 'onresizeend', 'onresizestart', 'onrowenter', 'onrowexit', 'onrowsdelete', 'onrowsinserted', 'onscroll', 'onselect', 'onselectionchange', 'onselectstart', 'onstart', 'onstop', 'onsubmit', 'onunload');
   $ra = array_merge($ra1, $ra2);

   $found = true; // keep replacing as long as the previous round replaced something
   while ($found == true) {
      $val_before = $val;
      for ($i = 0; $i < sizeof($ra); $i++) {
         $pattern = '/';
         for ($j = 0; $j < strlen($ra[$i]); $j++) {
            if ($j > 0) {
               $pattern .= '(';
               $pattern .= '(&#[xX]0{0,8}([9ab]);)';
               $pattern .= '|';
               $pattern .= '|(&#0{0,8}([9|10|13]);)';
               $pattern .= ')*';
            }
            $pattern .= $ra[$i][$j];
         }
         $pattern .= '/i';
         $replacement = substr($ra[$i], 0, 2).'<x>'.substr($ra[$i], 2);
         // add in <> to nerf the tag
         $val = preg_replace($pattern, $replacement, $val);
         // filter out the hex tags
         if ($val_before == $val) {
            // no replacements were made, so exit the loop
            $found = false;
         }
      }
   }
   return $val;
}
//测试一下效果
//echo RemoveXSS("<script language='javascript'>alert('hello world');</script>") ;
?>

IE动态创建带name的iframe跳转问题

在一些前端项目中可能要用到动态创建iframe的需求,例如无刷新ajax上传文件。但是在IE下创建带有name的iframe会有个bug,创建的代码如下:

var iframe = document.createElement('iframe');
iframe.name = 'test';

上面的这段javascript代码在IE下赋不了name属性!!!即iframe.name = 'test';这段代码未执行。

在IE中我们可以使用下面的代码来动态创建带有name的iframe:

var iframe = document.createElement('<iframe name="test">');

但是上面的代码在非IE浏览器下却报错,这时候我们可以使用判断IE,如果是ie则使用第二段方法动态创建iframe,或者我们可以捕获异常,如下面的代码:

nodePPT — nodejs做的手机端控制PC端的PPT演示文档javascript框架

nodePPT使用nodejs写的,可以手机端控制pc端的演示文档框架。nodePPT是在webSlide基础上二次开发的,使用nodejs做服务器,通过websocket来实现手机端和PC的通信,主要功能是手机端可以控制pc端PPT播放进度,并且手机端可以给每张PPT做备注。

第一次做个程序的nodejs作品,并且测试时间比较短,肯定会有很多问题和bug,希望大家一起斧正。另外页面样式css高手可以自己写,包括动画自定义都可以在css文件中直接修改添加。

说明

因为是PPT演示文档,所以需要投影仪分辨率,所以演示页面的最佳分辨率为全屏模式下的 1024*768 ,如果在自己电脑上查看,可以通过 ctrl + -ctrl + + 缩放到合适的比例查看效果。

建议浏览器chrome 16+,全屏模式(F11),以达到最佳动画效果。在Firefox下会出现拖尾现象,个人认为是Firefox 8下对CSS3动画效果渲染太慢导致,其他浏览器未测试。
nodePPT iphone手机端截图

使用说明

  1. 配置route.json
  2. 配置ppt的文件
  3. 启动node:node server.js
  4. PC访问:如127.0.0.1:3000/demo.ppt
  5. 手机端访问:127.0.0.1:3000/ctrl
  6. 手机端setup,选择控制用户后,开始控制

具体使用方法启动node server.js之后访问127.0.0.1:3000/index.ppt,里面有详细的介绍

快捷键

  • 空格/→/↓/Tab/pageDown:下一页
  • ←/↑/pageUp:上一页
  • P:开画板
  • C:清除画板

版本库地址

addEventListener第二个参数的handleEvent

昨天无意中看到一篇老外的文章,文章提到了addEventListener第二个参数可以传入object,并且对象中handleEvent为事件处理函数。例如下面的javascript代码:

var obj = {
    handleEvent: function() {
        alert('body clicked');
    }
};
document.body.addEventListener('click',obj,false);

测试发现这段代码在IE9+,chrome,FF,opera等浏览器是正确的(测试范围可能不够宽),而且可以成功的绑定click事件。在Qwrap群里一问才知道是DOM2中接口,很有意思的一个发现,@貘大大 也发微博说自己先入为主了,我相信很多人跟@貘大大 一样都先入为主了。

addEventListener的handleEvent应用

发现了这个“新大陆”有什么用法呢?哈哈~首先想到的是对象引用。

看下面的javascript代码:

<script type="text/javascript">
var obj = {
handleEvent: function() {
    alert('body clicked');
}
};
document.body.addEventListener('click',obj,false);
function fn2(){
    obj.handleEvent = function(){
        alert('fn2');
    };
}
</script>
<button onclick="fn2();">change</button>

因为对象的引用关系,点击下button就可以切换绑定事件的处理函数,而不需要remove之前的事件,然后重新绑定一个新的处理函数。

windows搭建memcached环境

最近练手php,一个地方需要缓存来支持,想来想去还是用memcached做缓存,可是电脑是windows系统,如果是linux系统安装memcached就比较容易,敲入几行shell就搞定,windows下还没搞过,于是记录下过程,备用。

Windows下的Memcache安装

1、下载memcache for windows。下载地址:http://jehiah.cz/projects/memcached-win32,推荐下载binaries版本,解压(本例中解压到c:\memcached)。

2、在命令行状态下输入:

c:\memcached\memcached.exe -d install

至此memcached已经安装成windows服务

3、在命令行下输入:

c:\memcached\memcached.exe -d start

以启动memcached服务。当然也可以选择在windows服务中启动

你没看错,就是这么简单,简简单单的三步memcache的服务器端就准备完毕

php安装Memcached模块支持

1、下载php_memcache.dll模块,你可以从http://downloads.php.net/pierre/找到对应的版本,
php5.3的直接下载http://shikii.net/blog/downloads/php_memcache-cvs-20090703-5.3-VC6-x86.zip

2、修改php.ini,添加如下内容:

extension=php_memcache.dll

3、重启apache服务器,然后查看一下phpinfo,如果有memcache,那么就说明安装成功!

测试windows下的Memcached

测试代码如下:

<?php
$mem = new Memcache;
$mem->connect("127.0.0.1", 11211);
$mem->set('key', 'Hello Memcached!', 0, 60);
$val = $mem->get('key');
echo $val;

更多测试代码,需要移步:
http://www.php.net/manual/en/memcache.examples-overview.php

Memcached的基本设置

【PPT分享】XSS注入和防范

这是我前些日子准备的关于《XSS注入和防范》的技术分享ppt,现在放出来,之前是做的powderpoint文件,后来网上流传impress.js做ppt,于是自己也整了个impress.js版本的放在了SAE上面,经过测试发现当ppt的内容较多,带有图片等,impress.js效果就会比较卡。不多说其他的,说说ppt的内容:

《XSS注入和防范》主要从xss是什么,xss的危害,xss的类型及其防范的措施,几个方面来讲解xss。希望对大家理解xss有所帮助,另外多说句cookie的httponly方式,在apache下面有个漏洞,当cookie超过4k的时候就会出现泄漏,所以要注意这个漏洞!(具体代码:狂点此处

废话不多说了,上ppt地址:【PPT分享】XSS注入和防范,请使用支持chrome浏览器查看ppt页面
XSS注入和防范

IE6中a标签触发图片和ajax请求被abort

IE6 a标签的请求被abort的原因

最近项目中掉进IE6 a标签abort两次坑,第一次是a标签绑定一个事件,href='javascript:;'这样a标签触发了事件,切换验证码图片,结果验证码图片总是显示不出来,通过抓包显示状态为abort

其实这个的原因可以从IE6中a标签执行顺序说起,IE6中a标签执行onclick在执行默认事件(即href跳转)之前,当触发了绑定的事件之后,那么处理完事件之后,如果不return false或者阻止默认事件,则会继续执行href跳转,IE6会认为页面跳转到其他页面或者页面重新刷新,则abort之前onclick事件中的请求。

PHP实现javascript的escape和unescape函数

前端开发工程师都知道javascript有编码函数escape()和对应的解码函数unescape(),而php中只有个urlencode和urldecode,这个编码和解码函数对encodeURI和encodeURIComponent有效,但是对escape的是无效的。

javascript中的escape()函数和unescape()函数用户字符串编码,类似于PHP中的urlencode()函数,下面是php实现的escape函数代码:

/**
 * js escape php 实现
 * @param $string           the sting want to be escaped
 * @param $in_encoding
 * @param $out_encoding
 */
function escape($string, $in_encoding = 'UTF-8',$out_encoding = 'UCS-2') {
    $return = '';
    if (function_exists('mb_get_info')) {
        for($x = 0; $x < mb_strlen ( $string, $in_encoding ); $x ++) {
            $str = mb_substr ( $string, $x, 1, $in_encoding );
            if (strlen ( $str ) > 1) { // 多字节字符
                $return .= '%u' . strtoupper ( bin2hex ( mb_convert_encoding ( $str, $out_encoding, $in_encoding ) ) );
            } else {
                $return .= '%' . strtoupper ( bin2hex ( $str ) );
            }
        }
    }
    return $return;
}
```php
<!--more-->

对应的解码**php unescape**代码是:

```php
function unescape($str)
{
    $ret = '';
    $len = strlen($str);
    for ($i = 0; $i < $len; $i ++)
    {
        if ($str[$i] == '%' && $str[$i + 1] == 'u')
        {
            $val = hexdec(substr($str, $i + 2, 4));
            if ($val < 0x7f)
                $ret .= chr($val);
            else
                if ($val < 0x800)
                    $ret .= chr(0xc0 | ($val >> 6)) .
                     chr(0x80 | ($val & 0x3f));
                else
                    $ret .= chr(0xe0 | ($val >> 12)) .
                     chr(0x80 | (($val >> 6) & 0x3f)) .
                     chr(0x80 | ($val & 0x3f));
            $i += 5;
        } else
            if ($str[$i] == '%')
            {
                $ret .= urldecode(substr($str, $i, 3));
                $i += 2;
            } else
                $ret .= $str[$i];
    }
    return $ret;
}

javascript contains方法来判断元素包含关系

IE中的contains方法可以判断A元素是否包含B元素,如果包含则返回true,否则返回false,在开发中会在事件代理处理上面用到。W3C的方法是compareDocumentPosition,所以综上来说:JS通过contains和compareDocumentPosition方法来确定DOM节点间的关系,判断一个元素(对象)是否为另一个元素的子元素。
IE的contains方法很简单,但是W3C的DOMElement.contains(DOMNode)方法会返回却是一个数值。

DOMElement.contains(DOMNode)

link:https://developer.mozilla.org/En/DOM/Node.compareDocumentPosition

DOMElement.contains(DOMNode)

返回的不是一个布尔值,而是一个很奇怪的数值,它是通过如下方式累加计算出来的:

Bits Number Meaning
000000 0 元素一致
000001 1 节点在不同的文档(或者一个在文档之外)
000010 2 节点 B 在节点 A 之前
000100 4 节点 A 在节点 B 之前
001000 8 节点 B 包含节点 A
010000 16 节点 A 包含节点 B
100000 32 浏览器的私有使用