link ,除了分享,也是知识管理。 于 4个月前发表 1797 0 0
什么是ZOOKEEPER Zookeeper 是一个分布式的、开源的协调服务,用在分布式应用程序中。它提出了一组简单的原语,分布式应用程序可以基于这些原语之上构建更高层的分布式服务用于实现同步、配置管理、分组和命名等。Zookeeper 设计的容易进行编程,它使用一种类似于文件系统的目录树结构的数据模型,以 java 方式运行,有 java 和 c 的绑定(binding)。 分布式系统中的协调服务总所周知地难于正确实现,尤其容易产生诸如争用条件 (race conditions)、死锁(deadlock) 等错误。Zookeeper 背后的动机就是减轻分布式应用程序从头做起实现协调服务的难度。 数据模型 Zookeeper 会维护一个具有层次关系的数据结构,它非常类似于一个标准的文件系统,如下图所示: Zookeeper 数据结构 [http://img.blog.csdn.net/20160719230154255]Zookeeper 这种数据结构有如下这些特点:
4个月前
nodeJS全栈
孙世吉 于 4个月前发表 2143 0 1
引言 最近实践中需要用到大量的异步回调风格代码的编写,作者最近处于同步编程风格转为异步编程风格的状态。同时第一时间遇到了下面提到的代码,第一直觉就是该代码肯定有问题!但是问题在哪里有讲不出来,感觉非常蛋疼与疑惑。先上当时遇到的代码: // 删除,先检查是否存在,存在再执行真正的删除动作functiondel() { // 查找return find().then(function(resultOfFind) { // 如果没找到,直接返回if (!resultOfFind) { returnfalse; } // 执行真正做删除操作的方法return reallyDelete(); }, function(err) { // 处理错误情况 handle(err) }) } functiondeleteItem(req, res) { // 删除 del().then(function(resultOfDelete) {
4个月前
javascript技术
coverguo 于 4个月前发表 2144 2 0
前言 最近,团队对测试用例十分的注重,因此,下面是我对测试用例的一些解析。 首先,我们需要知道:为什么需要测试用例? 理由很简单,就是为了在测试用例的辅助下,编写出高质量,可维护代码。 -------------------------------------------------------------------------------- 问题 正如因为地震的爆发,才会有地震仪的诞生。 测试用例的诞生,也必然有其需要解决的问题: 当我们在开发,我们往往会有以下的问题: 需求和开发脱节 当一份需求来了, 开发人员往往不能百分百的理解需求的内容(抛弃产品自己变更需求的可能性。。),这往往会让开发人员开发出的功能会有跟需求有所差别,这会带来额外的工作量 开发和测试脱节 什么是开发和测试脱节,说的是,当开发人员按照自己的想法开发完了一个需求。然后测试人员也按照自己的想法去测试这个需求,然后由于双方的分歧,导致测试认为开发有bug,开发认为测试是sb. 那么如何解决上面的问题呢? 答案就是 选择一种软件敏捷开发模式
4个月前
javascript技术
张颖 ,认真认真 于 2天前发表 134 0 0
REACT-ROUTER使用方式 react-router是专为React设计的路由解决方案,以react component的方式提供API,包含常用的Router,Route,IndexRedirect,Link,browserHistory等。react-router充分利用react component提供的生命周期特性,使定义路由和开发react component体验一致。 嵌套的路由表声明一份路径到各个component的映射表结构非常清晰: <Providerstore={store}><Routerhistory={browserHistory}><Routepath="/"component={AppSimple}><Routepath="/editor"component={Editor} /><IndexRedirectto="/proj" /></Route></Router></Provider> 而且支持多层嵌套
2天前
前端库
张颖 ,认真认真 于 1年前发表 4831 5 1
VIDEO标签属性和事件介绍 为了文章的完整性,首先还是列举一下video标签的属性: * src :视频的属性 * poster:视频封面,没有播放时显示的图片 * preload:预加载 * autoplay:自动播放 * loop:循环播放 * controls:浏览器自带的控制条 * width:视频宽度 * height:视频高度 Video 对象属性: * audioTracks: 返回表示可用音频轨道的 AudioTrackList 对象。 * autoplay: 设置或返回是否在就绪(加载完成)后随即播放视频。 * buffered: 返回表示视频已缓冲部分的 TimeRanges 对象。 * controller: 返回表示视频当前媒体控制器的 MediaController 对象。 * controls: 设置或返回视频是否应该显示控件(比如播放/暂停等)。 * crossOrigin: 设置或返回视频的 CORS 设置。 * currentSrc: 返回当前视频的 URL。
1年前
HTML&HTML5
结一 于 19天前发表 904 0 0
按道理来说,做重构切页面那本来就是要还原设计稿啊,没话说。但是如果设计师真的细究到0px还原,那还真不是个小事。 首先一个网站落到PS中,都是图片或文字(附加对图片或文字进行相关处理),而对应到重构来说就是一个个元素,所以要做到还原设计稿,主要要解决下面这三个问题: * 元素大小 * 元素与元素之间的间距 * 元素在页面的位置 下面对上面问题一一详细展开 元素大小 先来说下元素大小的问题,对于图片类的来说我们就要获取图片在PS中的正确大小,这一般来说百分之八十都没什么问题,除了一些设计师进行过特殊处理加工各层叠加等效果的需要费点时间搞定;而对于文字来说,那就是文字大小了,但是还有个不能忽略的字体问题,同一个大小不同字体可能相差十万八千里。 总结起来就是两点:保证图片跟设计稿一样大小;保证字体大小及类型一致。 对于第一点为了准确性及效率,我们可以采用 Cutterman [http://www.cutterman.cn/zh] 这个PS插件;而第二点我们就得使用规范去约定,约定网站常规字体类型及大小 元素之间的间距
19天前
CSS/重构
ouven ,https://ouvens.github.io/ 于 11天前发表 246 0 0
原文链接: http://jixianqianduan.com/frontend-javascript/2016/11/22/front-end-auto-test.html [http://jixianqianduan.com/frontend-javascript/2016/11/22/front-end-auto-test.html] 前端测试一直是前端项目开发过程中机器重要的一个环节,高效的测试方法可以减少我们进行代码自测的时间,提高我们的开发效率,如果你的代码涉及的测试用例较多,而且项目需要长期维护,这时就可以考虑使用一下自动化测试了。 一、前端自动化测试 前端自动化测试一般是指是在预设条件下运行前端页面或逻辑模块,评估运行结果。预设条件应包括正常条件和异常条件,以达到自动运行测试过程、减少或避免人工干预测试的目的。在前端自动化测试中,我们通常是通过不同的工具来解决不同场景下不同的问题的。就测试类型来看,主要分为BDD(Bebavior Driven Developement,行为驱动测试)和TDD(Testing Driven
11天前
javascript技术
郭明慧 于 11天前发表 212 0 0
最近一直忙于将JavaScript学习的笔记整理成电子书,也没什么空闲时间写新的文章。趁着今天有点空闲,决定再来折腾一下CSS3中的两个属性:object-fit和object-position。 这两个奇葩的属性是搞毛的呢?其实它们是为了处理替换元素(replaced elements)的自适应问题,简单的说,就是处理替换元素的变形(这里指长宽比例变形)问题。 等等,好像多了一个名词,啥叫替换元素?替换元素其实是: * 其内容不受CSS视觉格式化模型控制的元素,比如image,嵌入的文档(iframe之类)或者applet,叫做替换元素。比:img元素的内容通常会被其src属性指定的图像替换掉。替换元素通常有其固有的尺寸:一个固有的宽度,一个固有的高度和一个固有的比率。比如一幅位图有固有用绝对单位指定的宽度和高度,从而也有固有的宽高比率。另一方面,其他文档也可能没有固有的尺寸,比如一个空白的html文档。 *
11天前
CSS/重构
刘志龙 于 10个月前发表 2709 15 3
上篇文章讲解了xss的一些基础知识,这篇文章继续研究学习。上篇文章提到了一些理论性的东西,看完估计感觉很快也忘了。简单回顾一下,讲了xss分类:存储型XSS,反射型XSS,DOM XSS。讲了几个简单的payload,也只是理论性的东西。这篇先不继续看理论了,先来尝试尝试如何使用payload~ 玩起~~ 实战 理论的东西看了也很快就忘记了,于是我决定找个东西实际玩一玩~ 就从身边的东西,imweb博客入手好了。 仔细看了一下博客,最容易xss的似乎是文章里面的评论框,这个评论框是支持富文本的,当富文本一进来就意味着风险也一并进来了。 评论框的过滤规则一般有两类,第1类我们称为白名单,即:只允许使用白名单内的合法HTML标签,例如IMG。其它均剔除。 第2类我们称为黑名单,即:厂商会构建一个有危害的HTML标签、属性列表,然后通过分析用户提交的HTML代码,剔除其中有害的部分。 我们博客的评论框我测试了一下,应该是黑名单过滤的。 初探 对评论框还完全不了解,看看代码也是压缩了的,懒得去看压缩后的代码= = 直接用富文本试探好了~~ 首先我提交了非常简单的一个payload
10个月前
Web安全
lxy ,学无止境 于 15天前发表 265 2 0
[http://7tszky.com1.z0.glb.clouddn.com/FqSr0oqb2NxKhp0DgUvcBXsSN3-v] 以上是实图展示需要用到的主要元素: 1、perspective:定义 3D 元素距视图的距 2、transform:允许我们对元素进行旋转、缩放、移动或倾斜 3、transform-style:规定如何在 3D 空间中呈现被嵌套的元素 4、transition:定义过渡开始、完成的时间、速度和类型 简述:.cube代表一个正方体,.cube里面的每一个div分别表示正方体的一个面,要想每个面都有图片,即在每个div里分别加上一个img。正方体的制作很简单,只需要先让6个面处于同一位置,然后再绕不同的轴旋转一定的角度和平移一定距离即可。下面一起看实操: div部分[http://7tszky.com1.z0.glb.clouddn.com/FgCeilBN40rl5iZZ3pCTkkB_BxHZ] css搭建舞台 [http://7tszky.com1.z0.glb.clouddn.com/FoLDkXZtDEX7bjukxv61smPgMBsY]
15天前
CSS/重构
结一 于 2年前发表 3865 8 3
在说容易按比例缩放前,我们先说下图片按比例缩放。 对于图片,默认只设置图片的一个宽或高,那么另一个值就会按照图片真实比例缩放,如 <img class="demo1" src="http://placehold.it/200x150" alt="" <img class="demo2" src="http://placehold.it/400x300" alt="" .demo1{ width: 100px;/* 只设置宽度,根据等比例缩放得到高度为75px */ } .demo2{ height: 150px; /* 只设置高度,根据等比例缩放得到宽度为200px */ } 图片因为本身存在宽高比,所以设置一个值,另一个值自动也就根据真实的比例对应上,但是如果是视频呢? 一般在响应式中,我们会要求视频的宽高比为16:9或4:3,这么一来就比较头大了。当用户改变浏览器宽度的时候(改变高度不考虑),视频的宽度变了,那么高度也得根据我们要求的16:9或4:3改变。 这里老外提供了一个很巧的方案: Creating Intrinsic Ratios for Video
2年前
CSS/重构
郭明慧 于 19天前发表 299 0 0
相信大家都看过报纸,报纸上的内容大多数都是分栏显示的,如下图所示: [http://7s1r1c.com1.z0.glb.clouddn.com/t_multi-columns.png] 对于前端攻城狮来说,这种分列布局,在以前虽然可以实现,可是难度却是不小,工作量很大,必须使用JavaScript对内容分段,再配合上绝对定位或浮动等CSS样式来实现多列布局。但现在,强大的CSS3为我们提供了“multi-column”,让我们可以很轻松的实现这样的分列布局。 先来看看与多列布局(multi-column)相关的css属性有哪些: * 列数和列宽:column-count、column-width、columns * 列的间距和分列样式:column-gap、column-rule-color、column-rule-style、column-rule-width、column-rule * 跨越列:column-span * 填充列:column-fill
19天前
CSS/重构