-
js深拷贝
var obj = {a:1};var obj1 = { b:2, c:function(){ return 3; }, d:obj, e:[1,2,3], f:null, g:undefined}function copy_1(obj){ var result = {}; if (obj && typeof obj == 'object') { if (obj instanceof Array) { result = []; ...…
-
Object特性
definePropertyvar obj = {};var tmp = undefined;Object.defineProperty(obj,'a',{ //该属性是否可枚举(for in,Object.keys)，默认为false enumerable: false, //该属性的特性是否可修改(除writable特性外的其他特性是否可以被修改, //如重新定义enumerable，configurable等属性)，默认为false configurab...…
-
基于MP3加密音频文件的在线H5播放器的实现
引言：随着知识付费项目的市场份额逐渐扩大，对于音频产品的在线播放需求也在提升，怎么做到既能支持独家音频的web在线播放又能防止音频被盗链、被下载成了音频相关类产品web端的核心技术。目前，纵观市面上的音频产品的web端鲜有做到对音频加密的地步，为了防止音频被盗用，对于付费内的资源，大多数是引导用于去APP里付费和使用。而很多产品的推广其实是通过微信公众号的形式进行的，如果能够直接在微信H5端进行一些常用的产品流程（加密音频的付费、播放），可增加更好的用户体验。在web端，传统的Audi...…
-
nodejs 实现静态服务器（支持媒体播放）
const http = require('http');const fs = require('fs');const path = require('path');const mime = require('mime');//根据文件后缀获取文件类型工具const server = http.createServer((req, res) => { var realPath = __dirname+req.url; var exist = fs.existsSync(real...…
-
webpack加载器与插件开发简单案例
如今前端构建已成为大型项目必不可少的一部分，Webpack 是当下最热门的前端资源模块化管理和打包工具。它可以将许多松散的模块按照依赖和规则打包成符合生产环境部署的前端资源。还可以将按需加载的模块进行代码分隔，等到实际需要的时候再异步加载。通过 loader 的转换，任何形式的资源都可以视作模块。而传统的构建工具（gulp，graunt…）是不具备理解依赖的能力的。加载器loader（加载器）是webpack运行的关键部分，有了loader就可以加载各种我们想处理的资源了。加载器可以单...…
-
深入理解border-radius
border-radius具有两个特性：大值特性和等比例特性。这两个特性主要用来控制当border-radius的值大于元素的outerWidth或outerHeight时，元素边框的变形行为。大值特性当border-radius值很大的时候只会用元素的最大的宽或高(包括border)来渲染<!DOCTYPE html><html><head> <title></title><style> div ...…
-
iconfont学习笔记
iconfont是近年来前端领域兴起的一种新技术，在这之前，网页图标的展示大多数是用css sprite来实现，css sprite实现的图标在不同尺寸分辨率下有一定的的失真，而iconfont解决了此问题。@font-face要使用iconfont，必须配合@font-face使用。@font-face是CSS3中的一个模块，他主要是把自己定义的Web字体嵌入到你的网页中。@font-face的语法规则：@font-face { font-family: <YourW...…
-
https工作原理
HTTPS在传输数据之前需要客户端（浏览器）与服务端（网站）之间进行一次握手，在握手过程中将确立双方加密传输数据的密码信息。TLS/SSL协议使用了非对称加密，对称加密以及HASH算法。握手过程的简单描述如下： 浏览器将自己支持的一套加密规则发送给网站。 网站从中选出一组加密算法与HASH算法，并将自己的身份信息以证书的形式发回给浏览器。证书里面包含了网站地址，加密公钥，以及证书的颁发机构等信息。 获得网站证书之后浏览器要做以下工作： a) 验证证书的合法性（颁...…
-
移动端适配
随着硬件技术的发展，移动端手机的屏幕分辨率越来越多，为了处理屏幕碎片化问题和方便移动端界面的开发，当前两个主流移动端操作系统（Android，IOS）都抽象出了一套屏幕适配方案，本文章主要讲解两套适配方案的原理。移动开发中的一些概念屏幕尺寸相关的单位和术语： pt（point）：磅，一个标准的物理绝对长度单位，大小为1/72英寸。主要用于印刷与平面设计。1inch = 2.54cm=72pt。 px（pixel）：物理像素，组成屏幕图像的最小点，一个相对大小单位。同尺寸屏幕中像素越...…
-
理解css小数点像素
css中不存在真正的小数点像素，不同的浏览器对小数点有不同的解析，现代浏览器大多数会使用四舍五入以及相邻元素互补的方式去处理。解析与处理只是针对渲染级别，其真正的值在其DOM树中并没有改变，所以别去相信浏览器调试器所展示的小数点值。四舍五入：大多数浏览器渲染页面的时候，如果遇到小数点像素，将会四舍五入成整数，然后再去真正的渲染，而旧版ie只是简单的去除后面的小数。示例：<!DOCTYPE html><html><head> <title>...…
stay hungry stay foolish