0%

previously 还在用监听scroll事件+getBoundingClientRect()+节流函数实现lazyload么,你已经out了 what? 是浏览器原生的构造函数,该API可以自动”观察”元素是否可见,Chrome 51+ 已经支持。由于可见(visible)的本质是,目标元素与视口产生一个交叉区,所以这个 API 叫做”交叉观察器”。 how?

var io = new IntersectionObserver(callback, option)

// 开始观察
io.observer(document.getElementById('#example'))

// 停止观察
io.unobserver(element)

// 关闭观察器
io.disconnect()

callback一般会触发两次,进入/离开视口。另外回调函数以IntersectionObserverEntry对象作为参数。

{
  time: 3893.92,
  rootBounds: ClientRect {
    bottom: 920,
    height: 1024,
    left: 0,
    right: 1024,
    top: 0,
    width: 920
  },
  boundingClientRect: ClientRect {
     // ...
  },
  intersectionRect: ClientRect {
    // ...
  },
  intersectionRatio: 0.54,
  target: element
}
  • time:可见性发生变化的时间,是一个高精度时间戳,单位为毫秒
  • target:被观察的目标元素,是一个 DOM 节点对象
  • rootBounds:根元素的矩形区域的信息,getBoundingClientRect()方法的返回值,如果没有根元素(即直接相对于视口滚动),则返回null
  • boundingClientRect:目标元素的矩形区域的信息
  • intersectionRect:目标元素与视口(或根元素)的交叉区域的信息
  • intersectionRatio:目标元素的可见比例,即intersectionRect占boundingClientRect的比例,完全可见时为1,完全不可见时小于等于0

Option对象 threshold属性决定了什么时候触发回调函数。它是一个数组,每个成员都是一个门槛值,默认为[0],即交叉比例(intersectionRatio)达到0时触发回调函数。 另外在容器内滚动也会影响目标元素的可见性。root属性决定目标容器所在的容器节点。容器元素必须为目标元素的容器节点。 (不清楚此属性的用法)rootMargin用来定义根元素的margin,用来扩展或缩小rootBounds这个矩形的大小,从而影响intersectionRect交叉区域的大小 notice 规格写明,IntersectionObserver的实现,应该采用requestIdleCallback(),即只有线程空闲下来,才会执行观察器。这意味着,这个观察器的优先级非常低,只在其他任务执行完,浏览器有了空闲才会执行。

docker for mac what? 是一种沙盒环境能够隔离运行软件的容器。 - web应用的自动化打包和发布; - 自动化测试和持续集成、发布; - 在服务型环境中部署和调整数据库或其他的后台应用; - 从头编译或者扩展现有的OpenShift或Cloud Foundry平台来搭建自己的PaaS环境。 why? 安全。环境隔离,互不干扰。 以3M的linux内核承载,相比vmware成本较低。 镜像可编辑发布到官网。 how? docker ps docker info docker images docker version docker search tutorial docker pull learn/tutorial docker run learn/tutorial apt-get install -y ping docker ps -l docker commit [CID | 3] [image] docker inspect NAME|ID

2017-08-10 13:50:05 星期四 黑客工具、数据挖掘、神经网络、智能AI、VR/AR、自动驾驶系统。。。新颖技术层出不穷,Coder该何去何从?:smirk:广而浅呗:sunglasses: 微服务浪潮还未退,Serverless架构来势汹汹,FaaS日益流行。 RESTful还未被大家完全熟知,GraphQL后来居上。 webapp、hybridapp还没成熟,PWA…。 Angular,React,Vue,Avalon前端MV*框架逐渐为人熟知,改变传统前端编程思维。 设计要懂前端,前端向后台揽活,后台做数据挖掘。(玩笑) Access -> SQLServer -> Oracle -> MySQL -> MongoDB C# -> Java -> Nodejs

  • HTTPS 所需文件
  1. .crt(Cerificate)或.pem
  2. .key
  • 著名 CA 机构

StartCom(Class1 for free),Symantic

  • 申请 Class 1 DV SSL Certificate 过程
  1. 登录 StartCom,进入 Certificates Wizard

  2. 选择 Free User -> DV SSL Certificate

  3. 验证域名

  4. 用 openssl 生成并提交 CSR(Cerificate Signing Request)

  5. 成功之后 download ZIP,压缩包中有多种 Server 的 crt

  6. 将 nginxServer 里的 crt 文件上传至阿里云并配置 nginx.conf 文件

    server {
    listen 80 default_server;
    listen [::]:80 default_server ipv6only=on;

    rewrite ^(.*) https://$server_name$1 permanent;
    
    error_log /var/log/wp-error.log;
    # Make site accessible from http://localhost/
    server_name blog.qingf.me;

    }
    server {
    listen 443;
    server_name blog.qingf.me;

    location / {
      proxy_pass https://cecil0o0.github.io/;
    }
    
    error_log /var/log/wp-error.log;
    
    ssl on;
    ssl_certificate /root/214219488470845.pem;
    ssl_certificate_key /root/214219488470845.key;
    
    ssl_session_timeout 5m;
    
    ssl_protocols SSLv3 TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers "HIGH:!aNULL:!MD5 or HIGH:!aNULL:!MD5:!3DES";
    ssl_prefer_server_ciphers on;

    }

  • 结果
  1. Chrome NET::ERR_CERT_REVOKED
  2. Safari 访问用户是否接受
  3. quark 等手机浏览器可直接访问
  • NET::ERR_CERT_REVOKED 问题尝试解决
  1. 官网中了解到证书链结构

  2. 下载 CAG3(StartSSL 根证书)和 BR SSL ICA(中级 CA 证书)

  3. 合并证书生成证书链

    cat chenhaojie.crt StartComCertificationAuthorityG3.cacert.pem StartComBRSSLICA.cacert.pem > nginx_server.crt

注:必须对 nginx_server.crt 处理,可能存在证书头尾相连,需手动换行。另外可能需要 dos2unix 删除^M。

  1. 最后发现是 Chrome 和 FireFox 不信任 StartCom Certification Authority G3 的证书。GG。

最终用了阿里云的 DV SSL 证书(Symantec)=。=

新建用户

  1. useradd -d <path/to/folder>
  2. passwd
  3. usermod -s /usr/sbin/nologin

修改配置文件

  • vim /etc/vsftpd.conf

修改或添加如下行: listen=YES anonymous_enable=NO local_enable=YES write_enable=YES chroot_local_user=NO chroot_list_file=/etc/vsftpd.chroot_list

  • vim /etc/vsftpd.chroot_list

在单独一行添加

重启vsftp

  • service vsftpd restart

登陆FTP

  • ftp://@hostname