• 一个可以使用浏览器通过SSH连接Linux的程序

    如果你总是在新的电脑上需要使用SSH客户端连接你的远程服务器,又不想没换一个环境就要安装一次SSH客户端,那么这个程序就是你需要的,地址

    把它下载到你的服务器端,按照教程设置并启动服务

    打开一款支持WebSocket协议的浏览器,输入服务器地址,顺利的话你应该能看到这个页面

    full

    如果输入正确的地址加授权信息,就能顺利登入系统

    ...

    READ ALL

  • JavaScript的namespace命名空间

    首先,JavaScript里没有namespace关键字用于声明命名空间。如果在NodeJS有模块的概念,但在浏览器下因为I/O的问题不能require加载模块,只能使用script标签一下加载所有脚本,当然也有一些插件实现了浏览器端require的做法。

    为了避免编写大型项目造成混乱,通常都是采用面向对象的方式组织代码结构,将属性,方法放入一个对象中。如以下代码

    var dog = {
      name: 'Petty',
      sayName: function () {
        console.log(this.name);
      }
    }
    
    dog.sayName();
    

    ...

    READ ALL

  • Python也可以这样实现多行注释

    Python程序的注释跟其它语言有点不一样,对于习惯了使用/**/多行注释的人来说,在Python中只能使用#号进行单行注释很痛苦。

    # 这里是单行注释
    # a = 50
    # b = 10
    # c = 10
    

    其实我们可以通过多行文本定义的格式实现多行注释

    '''
    # 这里是多行注释
    a = 50
    b = 10
    c = 10
    '''
    

    这个方法感觉还不错,跟/**/多行注释用起来没啥区别,这在调试代码的时候很管用,可以直接使用多行文本定义符号注释掉部分代码。也许Python的多行文本定义功能本来也可以充当注释用的,当然这毕竟是文本

    ...

    READ ALL

  • PHP通过JSON格式定义字面量对象

    PHPer都知道PHP是不支持字面量了,至少目前版本都不支持。比如,在JavaScript中可以这样定义object

    var o = {'name': 'qttc', 'url': 'www.qttc.net'};
    console.log(o.name);
    

    虽然JSON并不等同于JavaScript中的Object格式,但很接近

    Python中定义字典,也可以这样定义:

    o = {'name': 'qttc', 'url': 'www.qttc.net'}
    print o['name']
    

    但在PHP中这么定义object:

    ...

    READ ALL

  • Linux du命令使用

    使用Win平台习惯后在Linux下查看目录列表时希望能看到实际文件的大小,我们可以使用du命令查看

    命令格式

    du [options] [path]

    常用参数有

    • -a or -all 为每个指定文件显示磁盘使用情况,或者为目录中每个文件显示各自磁盘使用情况。
    • -b or -bytes 显示目录或文件大小时,以byte为单位。
    • -c or -total 除了显示目录或文件的大小外,同时也显示所有目录或文件的总和。
    • -D or -dereference-args 显示指定符号连接的源文件大小。
    • -h or -human-readable 以K,M,G为单位,提高信息的可读性。
    • -H or -si-h参数相同,但是K,M,G是以1000为换算单位,而不是以1024为换算单位。
    • -k or -kilobytes 以1024 bytes为单位。
    • -l or -count-links 重复计算硬件连接的文件。
    • -L<符号连接> or -dereference<符号连接> 显示选项中所指定符号连接的源文件大小。
    • -m or -megabytes 以1MB为单位。
    • -s or -summarize 仅显示总计,即当前目录的大小。
    • -S or -separate-dirs 显示每个目录的大小时,并不含其子目录的大小。
    • -x or -one-file-xystem 以一开始处理时的文件系统为准,若遇上其它不同的文件系统目录则略过。
    • -X<文件> or -exclude-from=<文件> 在<文件>指定目录或文件。
    • --exclude=<目录或文件> 略过指定的目录或文件。
    • --max-depth=<目录层数> 超过指定层数的目录后,予以忽略。
    • --help 显示帮助。
    • --version 显示版本信息。

    ...

    READ ALL

  • input的onchange事件实际触发条件与解决方法

    input中onchange事件特别常用,现在同onclick一样使用频率很高,然而onchange的机制实际上有很多童鞋并不清楚,我们通过实例来分析这个事件的特征。

    触发onchange

    首先页面有一个input标签,并且已绑定onchange事件,如

    <input type="text" onchange="console.log(this.value);" />
    

    这个事件要做的动作很简单,只是把input的值在控制台上打印出来就好。效果

    full

    ...

    READ ALL

  • 一些让我悲催编程经历

    rm命令

    有一次,项目出了点问题,为了图方便就直接ssh上去了。问题解决后准备delete测试文件,结果不小心直接使用rm -rf命令把项目整个程序删除了,而备份文件不是最新的程序。结果花了将近一周才把程序重新部署到线上,恢复访问。从那以后,我每次登陆服务器时,不轻易敲rm这个命令,心里有恐惧感。

    升级程序版本

    我一直喜欢把软件升级到最新的版本,有一次我发现MySQL又出新版本了,我于是赶紧下载,解压,编译,安装。但总是在某个地方出错安装始终进行不下去,而每一次编译MySQL都需要十多分钟特别耗时。最终我是放弃了最新版本的安装,而站点也因为我的升级操作停止运行了将近一天的时间。其实因为升级程序导致站点不能访问的状况已经有好几次,升级服务器软件的操作要谨慎,因为极有可能不兼容导致环境出问题。

    ...

    READ ALL

  • 关于Web服务器头部的Server与X-Powered-By信息

    通过工具可以查询到站点服务器信息与程序信息及版本,其实这是通过服务器响应头信息里返回的,如果把这些信息暴露出去对站点不安全,我们可以通过隐藏或修改头信息的方法来阻止这些信息暴露

    头信息包含服务器信息与程序信息

    有些查询工具在我们输入某个站点的URL后就能判断这个站点的WebServer与程序类型

    例如在站长工具下guofei.me站点

    full

    查询豆瓣的

    full

    ...

    READ ALL

  • Chrome可以其它浏览器拖拽图片

    Chrome永远都是走在技术前线,总会有些惊人的表现,最近我在做一个拖拽上传图片功能时发现Chrome竟然可以直接从其它浏览器拖拽图片。

    普通拖拽事件,各个浏览器都识别从本地磁盘拖拽的文件

    HTML5的拖拽drop事件让Web应用看到了两点,然而在普通的drop事件里,多数浏览器只支持从本机电脑磁盘上拖拽到浏览器,例如:

    JavaScript代码

    // 获取要触发drop事件的DIV
    var du = $('dragUpload'); 
     
    // 根据ID获取对像
    function $(id) {
      return document.getElementById(id);
    }
     
    // 把拖拽到网页上的图片显示到页面上
    function displayImage (container,dataURL) {
      var img = document.createElement('img');
      img.src = dataURL;
      container.appendChild(img);
    }
     
    // 拖放释放主要处理函数
    du.addEventListener('drop', function (e) {
      e.stopPropagation();
      e.preventDefault();
      du.className = du.className.replace('drag-over','');
    
      // 获取拖放文件 一个数组
      var files = e.dataTransfer.files;  
      handleFiles(files);  
    }, false);
    

    ...

    READ ALL

  • JavaScript判断一个变量是对象还是数组

    typeof都返回object

    在JavaScript中所有数据类型严格意义上都是对象,但实际使用中我们还是有类型之分,如果要判断一个变量是数组还是对象使用typeof搞不定,因为它全都返回object

    var o = {name: '琼台博客'};
    var a = ['reg', 'blue'];
     
    console.log( ' o typeof is ' + typeof o);
    console.log( ' a typeof is ' + typeof a);
    

    Output

    o typeof is object
    a typeof is object   
    

    ...

    READ ALL