Month: May 2015
在线演示 下载
WebRTC可能是明年最受关注的HTML5标准了,Mozilla为此开发了一套帮助你控制硬件的API,例如,摄像头,麦克风,或者是加速表。你可以不依赖其它的插件来调用你需要的本机硬件设备。
在今天的这篇文章中,我们将介绍来自Wolfram Hempel开发的Photobooth.js,使用这个类库可以帮助你快速的调用摄像头功能,你可以很容易的添加摄像头功能到网站中。并且快速的帮助你拍照,你可以使用这个功能来实现用户的大头照拍摄,是不是非常不错?
主要特性:
对比度设置
颜色设置
亮度设置
色调设置
拍照按钮
支持最新的chrome, firefox, opera等浏览器
支持jQuery插件方式和jav…
Read More
The private SSL certificate is an important upgrade to your website. The basic function of an SSL is to encrypt all communication between the browser and the server, ensuring that all data goes through a secure (HTTPS) connection. An SSL certificate is a necessity when you want to operate an online shop and process the
speechRecognition API
Speech API 只支持 Chrome,
http://updates.html5rocks.com/2013/01/Voice-Driven-Web-Apps-Introduction-to-the-Web-Speech-API
speech = new webkitSpeechRecognition
speech.onresult = (event) ->
console.log event.results[0][0]
speech.lang = 'cmn-Hans-CN'
speech.continous = yes
speech.start()
Chrome 启用语音识别的接口需要…
Read More
官网:http://www.schillmania.com/projects/soundmanager2/
HTML5 标准中加入了两个非常强大的标签 audio 和 video ,让我们在网页中嵌入视频和音频变得非常方便,但是不幸的是目前用户所使用的有很大一部分浏览器都是老版本的,并不支持这两个标签,这使前端开发者们很困扰,这里介绍一款相对来讲支持浏览器比较多的网页音频播放器 —— SoundManager 2。
以下是 SoundManager 2 支持的浏览器版本,你没看错,它甚至支持 IE5:
Firefox (all versions), Windows/Mac
Safari 1.3+ (Mac) / A…
Read More
HTML5中,除了其他强大的功能外,同时还增加了audio标签,利用audio标签就可以播放音乐。下面是9个不错的HTML5音乐播放器。
Media Element
MediaElement音频视频播放器是纯HTML5和CSS编写的。同时为很多不同的开源系统提供插件,如WordPress,Drupal,Joomla等
网址:http://mediaelementjs.com/
Scott Andrew’s HTML5 audio player
这个播放器是非常简约,但效果很好。
网址:http://www.scottandrew.com/pub/html5audioplayer/
Speakk…
Read More
流量劫持,这种古老的攻击沉寂了一段时间后,最近又开始闹的沸沸扬扬。众多知名品牌的路由器相继爆出存在安全漏洞,引来国内媒体纷纷报道。只要用户没改默认密码,打开一个网页甚至帖子,路由器配置就会被暗中修改。互联网一夜间变得岌岌可危。
攻击还是那几种攻击,报道仍是那千篇一律的砖家提醒,以至于大家都麻木了。早已见惯运营商的各种劫持,频繁的广告弹窗,大家也无可奈何。这么多年也没出现过什么损失,也就睁只眼闭只眼。
事实上,仅仅被运营商劫持算是比较幸运了。相比隐匿在暗中的神秘黑客,运营商作为公众企业还是得守法的,广告劫持虽无节操但还是有底线的。这不,能 让你看见广告了,也算是在提醒你,当前网…
Read More
上一篇文章,介绍了常见的流量劫持途径。然而无论用何种方式获得流量,只有加以利用才能发挥作用。
不同的劫持方式,获得的流量也有所差异。DNS 劫持,只能截获通过域名发起的流量,直接使用 IP 地址的通信则不受影响;CDN 入侵,只有浏览网页或下载时才有风险,其他场合则毫无问题;而网关被劫持,用户所有流量都难逃魔掌。
在本文中,我们通过技术原理,讲解如下问题:
为什么喜欢劫持网页?
只浏览不登陆就没事吗?
自动填写表单有风险吗?
离开劫持环境还受影响吗?
使用 HTTPS 能否避免劫持?
流量劫持能否控制我电脑?
为什么喜欢劫持网页?
理论上说,劫持到用户的流量数据,也就获得相应程序的网络通信。但在现实中,数据并不代…
Read More
代码:
<?php
$timezones = array("abbr"=>"ACDT","name"=>"Australian Central Daylight Time","offset"=>"+10:30");
$timezones = array("abbr"=>"ACST","name"=>"Australian Central Standard Time","offset"=>"+9:30");
$timezones = array("abbr"=>"ACT","name"=>"ASEAN Common Time","offset"=>"+8");…
Read More
代码:
<?php
$countries = array();
$countries = array("code"=>"AF","name"=>"Afghanistan","d_code"=>"+93");
$countries = array("code"=>"AL","name"=>"Albania","d_code"=>"+355");
$countries = array("code"=>"DZ","name"=>"Algeria","d_code"=>"+213");
$countries = array("code"=>"AS","…
Read More
传统的登录框
在之前的文章流量劫持危害详细讲解了 HTTP 的高危性,以至于重要的操作都使用 HTTPS 协议,来保障流量在途中的安全。
这是最经典的登录模式。尽管主页面并没有开启 HTTPS,但登录时会跳转到一个安全页面来进行,所以整个过程仍是比较安全的 —— 至少在登录页面是安全的。
对于这种安全页面的登录模式,黑客硬要下手仍是有办法的。在之前的文章里也列举了几种最常用的方法:拦截 HTTPS 向下转型、伪造证书、跳转钓鱼网站。
其中转型 HTTPS 的手段最为先进,甚至一些安全意识较强的用户也时有疏忽。
然而,用户的意识和知识总是在不断提升的。尤其在如今各种网上交易的时代,安全常识广泛普及,用户…
Read More
背景
本文来自于之前我发的一篇微博:
不过写这篇文章并不是为了帮大家准备面试,而是想借这道题来介绍计算机和互联网的基础知识,让读者了解它们之间是如何关联起来的。
为了便于理解,我将整个过程分为了六个问题来展开。
第一个问题:从输入 URL 到浏览器接收的过程中发生了什么事情?
从触屏到 CPU
首先是「输入 URL」,大部分人的第一反应会是键盘,不过为了与时俱进,这里将介绍触摸屏设备的交互。
触摸屏一种传感器,目前大多是基于电容(Capacitive)来实现的,以前都是直接覆盖在显示屏上的,不过最近出现了 3 种嵌入到显示屏中的技术,第一种是 iPhone 5 的 In-cell…
Read More
示例
背景
验证码主要是防止机器暴力破解。之前的验证码都是以静态为主,现在一些产品开始使用动态方式,增加破解的难度。动态方式以 gif 最为简单可靠。gif 兼容性好,尺寸小。这里分享的就是一种:用 JS 实现 gif 动态验证码的思路。感谢关注。
任务分解
绘制旋转的文字
计算每个字符出现位置和角度
生成 gif 图片
逐步求精
如何绘制旋转的文字?
了解能用的 API
context.rotate(angle) 使当前坐标系旋转 angle,单位弧度
context.translate(x, y) 使当前坐标系偏移 x, y,单位像素
context.font 设置字体
context.strokeText(text, x, y [, maxW…
Read More
一直以来,各大论坛和邮箱都允许使用外链图片。一方面解决了上传和保存带来的资源消耗,更重要的是方便用户转载图片。
然而,简单的背后是否暗藏着什么风险呢?大多或许认为,不就是插入了一张外部图片而已,又不是什么脚本或插件,能有多大的安全隐患。
曾经也有过外链图片泄漏cookie那样的重大隐患,不过那都是很久以前的事了。在如今浏览器日新月异的年代里,这样的bug已经很难遇到了。不过利用正常的游戏规则,我们仍能玩出一些安全上的小花招。
No.1 —— HTTP401
(严重程度:低)
大家都见过,打开路由器的时候会弹出个登录框。
如果了解HTTP协议的话,这是服务器返回4…
Read More
1. 方法一
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script sr…
Read More