杜郎俊赏 - dujun.io

建站之动态密码

为了安全,后台登录增加了动态密码。基于 GoogleAuthenticator 实现。 用法很简单,看 github 说明即会。 创建二维码时需要翻墙访问 google。

2017-05-05

建站之文字排版

hanzi封面
汉字、字母、数字、标点符号等混合的情况下,排版的美观是非常重要的。如: 本站使用 hanzi.pro 的排版方案,在汉字与字母数字混排时自动增加间隔等。 调用非常简单,引入 css 和 js 就可以了。注意,js 要需要放在页面底部。 ctrl + a 就能明白效果了。

2017-05-05

建站之字体子集

webfont封面
本站主标题 杜郎俊赏 使用的是字体子集技术。 完整的字体文件一般很大,有些场景只需要固定的几个字,比如这个主标题只用到四个字,把用到的字抽离出来就小很多,可以做成 webfont。这就是字体子集技术。 百度 FEF 出品的 Fontmin 是非常方便的字体子集化工具。 下载客户端,安装后将字体文件拖入,填写要抽取的文字,点击生成就可以了。直接生成 ttf/eot/woff/svg/css。

2017-05-04

建站之防盗链

防止图片、视频等资源被盗链,nginx vhost 配置如下 location ~ .*\.(gif|jpg|jpeg|png|bmp|zip|mp4|webm)$ { valid_referers none *.dujun.io dujun.io; if ($invalid_referer) { rewrite ^/ https://cdn.dujun.io/image/403.png; } } 要点:需要增加 none 参数,否则低版本 iPhone 等唤起系统原生播放器来播放视频的情况会被误伤。

2017-05-04

建站之 CSP

Content Security Policy,简称 CSP,定义页面可以加载哪些资源,增强安全性。 我的配置如下 add_header Strict-Transport-Security "max-age=31536000"; add_header X-Frame-Options deny; add_header X-Content-Type-Options nosniff; add_header X-XSS-Protection '1; mode=block'; add_header Content-Security-Policy "default-src https: 'self'; script-src https: 'self' 'unsafe-inline' 'unsafe-eval' https://cdn.dujun.io; style-src https: 'self'...

2017-05-04

建站之 HTTPS

本站部署了全站 https,基于 Let's Encrypt 提供的免费证书方案。 在 Ubuntu 中部署 安装 letsencrypt sudo apt-get install letsencrypt 生成证书 当前服务器 ip 必须是目标域名 dns 中。 必须先停止 nginx / apache 等服务。 按照屏幕指示操作,填写邮箱等信息。 sudo letsencrypt certonly --standalone -d dujun.io 生成的证书文件在 /etc/letsencrypt vhost 配置 listen 443 ssl; server_name dujun.io www.dujun.io; ssl_certificate /etc/letsencrypt/live/dujun.io/fullchain.pem; ssl_certificate_key /etc/...

2017-05-04

建站之 IO 域名

domain-io封面
本站用的是我姓名拼音的 io 域名,dujun.io。 .io 是 [british indian ocean territory] 英属印度洋领地的国别域名。但科技行业的人喜欢 io 域名是因为 I/O 是计算机的本质。知名的网站如: redis.io github.io jenkins.io icomoon.io pangu.io 我这个域名是在 gandi.net 购买的,198 元/年,相对最便宜。

2017-05-04

建站之数据备份

本站用了两套备份机制。 一、阿里云快照 使用阿里云的自动快照功能,每两天全盘备份一次快照。但是本月底之后开始收费了。 二、cron 备份 www_backup.sh #!/bin/sh BACKUP_DIR='/backup' TMP_DIR='/tmp' APP_DIR='/wwwroot/www' TIME=`date '+%Y%m%d%H'` #备份数据库 DB_NAME='db_name' DB_USER='user' DB_PASSWORD='password' DB_FILE=${DB_NAME}_$TIME.sql DB_TAR=sql_${DB_NAME}_$TIME.tgz cd $TMP_DIR mysqldump --opt -u$DB_USER -p$DB_PASSWORD $DB_NAME > $DB_FILE tar -zcf $DB_TAR $DB_FILE...

2017-05-04

建站之服务器

建立本站的初衷,是因为先前做了一套房价采集系统,部属在 阿里云,不想 www 闲置,就搭建了这个博客。 生产环境 阿里云提供了完整的技术方案,细分到云数据库、消息队列、搜索服务等都可以直接购买使用。但是作为个人项目,投入成本没这么高,所以仅购买了一台 ECS,自建 php + mysql + redis 环境。 我比较熟悉 Ubuntu,ECS 安装了 16.04 版。 首先换成阿里云的源,编辑 /etc/apt/sources.list deb http://mirrors.aliyun.com/ubuntu/ xenial main restricted universe multiverse deb http://mirrors.aliyun.com/ubuntu/ xenial-security main restricted universe multiverse deb htt...

2017-05-04

建站之开篇

基于 yaf 框架进行了整站重新开发(2017.05.17 更新)。 过程中增加了很多个性化的东西,所以也牺牲了普适性。 原模版个人感觉不舒服的地方做了像素级调整,加了一些动态交互 文章摘要按最接近的段落截断,避免截在中间导致一句话不完整 支持静态图、gif 和 mp4 文件,自动生成缩略图,对应手机端和电脑端两套缩略图 静态图做了懒加载和缩放,上传后自动旋转(手机拍摄的图片存在旋转问题) gif 解析成 [动图] 形式,点击后播放 mp4 解析成 [短片] 形式,点击后播放;上传后自动旋转 主标题等用了字体子集 全站用了中英文排版格式化,即汉字和英文、数字、标点之间增加空格,方便阅读 做了特殊分类,放宝宝日记(每天照片),在首页只显示最新一张 有新评论时,博主和被回复的人(如果填了邮箱)会收到系统邮件提醒 允许无标题,做成类似微博形式 全站 https 接下来写个系列文章,将本站开发中遇...

2017-05-04

分页: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183