在服务端加速并安全化网站

背景

我自己有两个站点:

一个在国内,一个在美帝。

看起来似乎美帝的速度问题比较严重?然而事实上是两个都需要很多工作要做。

这一篇就说说我最近对这两个站点做的一些安全和速度提升的工作。

webpack 提速

先说第一个站点,这个是用webpack + react 做的简历页面。压根没什么太多的想法。

然而做出来却是有相当严重的问题。

第一次做出来就直接打包出来。

然后我看了这个js文件足足有2.1MB大小。

惊呆了,怎么回这么大。

后来到处找性能提升的方法,最后在文档那边说,先试试Uglify吧。

然后发现这个js文件从2.1MB直降到260Kb。

当时高兴坏了,同时也在怀疑为什么一个Uglify就能提升十倍的性能?

源码是要看的,过一段等研究一下再写一篇。

那么 260kb还能不能再提升了呢?

当然是有的,在后面一点儿我会继续做介绍

对了,源码在这里

PHP7

最近两天出了PHP7了嘛,然后我就在大学狗那个服务器那边编译上了,开了OPC,性能还是不错的。

不过没有具体测试。

上一篇博客介绍了编译PHP7的一些东西,有兴趣可以去看看。

开OPC是这样的:

zend_extension=opcache.so
opcache.memory_consumption=128
opcache.interned_strings_buffer=8
opcache.max_accelerated_files=4000
opcache.revalidate_freq=60
opcache.fast_shutdown=1
opcache.enable_cli=1

SSL

这一节涉及到一些安全的内容。

要知道现在安全形势越来越严峻了,随便一个半大自诩为“黑客”的孩子都能拿个什么脚本来攻击网站。

https在防XSS方面还是很给力的。

最简单的就是狗屎运营商再也不能随便在你网站脸上贴广告了。

最近let’s encrypt开源了,可以看到不远的将来,https一定是趋势。

我用的是从WoSign那边申请的免费证书。

安全性能不是很高,但是挡住一部分攻击还是可以的。

说实话,我最恶心的运营商广告。真无耻。

沃通的申请时很简单的,只要验证好了就会给个文件下来,然后解压,选择Nginx文件夹里面的两个东西,上传到服务器。

编译 Nginx

Ubuntu 官方的源里面的版本太低了,不给力,只能自己下载编译。

$ wget http://nginx.org/download/nginx-1.9.10.tar.gz
$ tar -zxvf nginx-1.9.10.tar.gz
$ cd nginx-1.9.10
$ ./configure --user=nginx --group=nginx --prefix=/opt/nginx --with-http_gzip_static_module --with-http_ssl_module --sbin-path=/usr/sbin/nginx --conf-path=/opt/nginx/nginx.conf --pid-path=/var/run/nginx.pid --error-log-path=/var/log/nginx/error.log --http-log-path=/var/log/nginx/access.log --with-http_v2_module
$ make
$ sudo make install

新建文件:/etc/init.d/nginx

#!/bin/sh

### BEGIN INIT INFO
# Provides: nginx
# Required-Start: $local_fs $remote_fs $network $syslog $named
# Required-Stop: $local_fs $remote_fs $network $syslog $named
# Default-Start: 2 3 4 5
# Default-Stop: 0 1 6
# Short-Description: starts the nginx web server
# Description: starts nginx using start-stop-daemon
### END INIT INFO

PATH=/usr/local/sbin:/usr/local/bin:/sbin:/bin:/usr/sbin:/usr/bin
DAEMON=/usr/sbin/nginx
NAME=nginx
DESC=nginx

# Include nginx defaults if available
if [ -r /etc/default/nginx ]; then
. /etc/default/nginx
fi

test -x $DAEMON || exit 0

. /lib/init/vars.sh
. /lib/lsb/init-functions

# Try to extract nginx pidfile
PID=$(cat /opt/nginx/nginx.conf | grep -Ev '^\s*#' | awk 'BEGIN { RS="[;{}]" } { if ($1 == "pid") print $2 }' | head -n1)
if [ -z "$PID" ]
then
PID=/run/nginx.pid
fi

# Check if the ULIMIT is set in /etc/default/nginx
if [ -n "$ULIMIT" ]; then
# Set the ulimits
ulimit $ULIMIT
fi

#
# Function that starts the daemon/service
#
do_start()
{
# Return
# 0 if daemon has been started
# 1 if daemon was already running
# 2 if daemon could not be started
start-stop-daemon --start --quiet --pidfile $PID --exec $DAEMON --test > /dev/null \
|| return 1
start-stop-daemon --start --quiet --pidfile $PID --exec $DAEMON -- \
$DAEMON_OPTS 2>/dev/null \
|| return 2
}

test_nginx_config() {
$DAEMON -t $DAEMON_OPTS >/dev/null 2>&1
}

#
# Function that stops the daemon/service
#
do_stop()
{
# Return
# 0 if daemon has been stopped
# 1 if daemon was already stopped
# 2 if daemon could not be stopped
# other if a failure occurred
start-stop-daemon --stop --quiet --retry=TERM/30/KILL/5 --pidfile $PID --name $NAME
RETVAL="$?"

sleep 1
return "$RETVAL"
}

#
# Function that sends a SIGHUP to the daemon/service
#
do_reload() {
start-stop-daemon --stop --signal HUP --quiet --pidfile $PID --name $NAME
return 0
}

#
# Rotate log files
#
do_rotate() {
start-stop-daemon --stop --signal USR1 --quiet --pidfile $PID --name $NAME
return 0
}

#
# Online upgrade nginx executable
#
# "Upgrading Executable on the Fly"
# http://nginx.org/en/docs/control.html
#
do_upgrade() {
# Return
# 0 if nginx has been successfully upgraded
# 1 if nginx is not running
# 2 if the pid files were not created on time
# 3 if the old master could not be killed
if start-stop-daemon --stop --signal USR2 --quiet --pidfile $PID --name $NAME; then
# Wait for both old and new master to write their pid file
while [ ! -s "${PID}.oldbin" ] || [ ! -s "${PID}" ]; do
cnt=`expr $cnt + 1`
if [ $cnt -gt 10 ]; then
return
2
fi
sleep 1
done
# Everything is ready, gracefully stop the old master
if start-stop-daemon --stop --signal QUIT --quiet --pidfile "${PID}.oldbin" --name $NAME; then
return
0
else
return
3
fi
else
return
1
fi
}

case "$1" in
start)
[ "$VERBOSE" != no ] && log_daemon_msg "Starting $DESC" "$NAME"
do_start
case "$?" in
0|1) [ "$VERBOSE" != no ] && log_end_msg 0 ;;
2) [ "$VERBOSE" != no ] && log_end_msg 1 ;;
esac
;;
stop)
[ "$VERBOSE" != no ] && log_daemon_msg "Stopping $DESC" "$NAME"
do_stop
case "$?" in
0|1) [ "$VERBOSE" != no ] && log_end_msg 0 ;;
2) [ "$VERBOSE" != no ] && log_end_msg 1 ;;
esac
;;
restart)
log_daemon_msg "Restarting $DESC" "$NAME"

# Check configuration before stopping nginx
if ! test_nginx_config; then
log_end_msg 1 # Configuration error
exit 0
fi

do_stop
case "$?" in
0|1)
do_start
case "$?" in
0) log_end_msg 0 ;;
1) log_end_msg 1 ;; # Old process is still running
*) log_end_msg 1 ;; # Failed to start
esac
;;
*)
# Failed to stop
log_end_msg 1
;;
esac
;;
reload|force-reload)
log_daemon_msg "Reloading $DESC configuration" "$NAME"

# Check configuration before reload nginx
#
# This is not entirely correct since the on-disk nginx binary
# may differ from the in-memory one, but that's not common.
# We prefer to check the configuration and return an error
# to the administrator.
if ! test_nginx_config; then
log_end_msg 1 # Configuration error
exit 0
fi

do_reload
log_end_msg $?
;;
configtest|testconfig)
log_daemon_msg "Testing $DESC configuration"
test_nginx_config
log_end_msg $?
;;
status)
status_of_proc -p $PID "$DAEMON" "$NAME" && exit 0 || exit $?
;;
upgrade)
log_daemon_msg "Upgrading binary" "$NAME"
do_upgrade
log_end_msg 0
;;
rotate)
log_daemon_msg "Re-opening $DESC log files" "$NAME"
do_rotate
log_end_msg $?
;;
*)
echo "Usage: $NAME {start|stop|restart|reload|force-reload|status|configtest|rotate|upgrade}" >&2
exit 3
;;
esac

:

粘贴进去了,然后赋权,执行

$ sudo chmod 755 /etc/init.d/nginx
$ sudo service nginx start

这个时候贴上证书吧,顺便记得https监听的是443端口

就像这样:

server {
listen 443 ssl default_server;
server_name domain.com;
ssl_certificate /path/to/ssl/domain.crt;
ssl_certificate_key /path/to/ssl/domain.key;
ssl_session_timeout 5m;
error_page 404 /404.html;
location / {
root /path/to/app;
index index.html index.htm;
}
}

这个时候因为监听的是443,80端口还要做一个301重定向

server {
listen 80;
server_name *.domain.com;
return 301 https://www.domain.com$request_uri;
}

好了,差不多都好了。

这个时候关于ssl就已经完成了。安全性较之之前的http有了一定的提升。

我也觉得挺好的。至少url前面有个绿色的小锁,看起来是挺棒的,这个逼装的还是挺好的吧。

接下来要做更高的性能提升工作了。

HTTP2

关于HTTP2我并不做过多讲解了。因为我确实理解不够,只是稍微会用一点

最后我列出了几个关于HTTP2的博客,有意愿的可以看看。

我只关心HTTP2的性能提升。

通过TCP的多路复用有效的提升了速度。在Nginx中开启这个很简单。只要在ssl后面加一个http2就好了

server {
listen 443 ssl http2 default_server;
server_name domain.com;

现在只要支持http2的浏览器就会用http2协议了,而不支持的也会自动退回到http1.1

HSTS

不要以为上了HTTPS就很安全了,实际上每次懒省事都是通过301跳转到https的,而这一段路,是非常不安全的!因为很有可能有有心人剥离ssl。

更安全的做法是用上HSTS,在所设定的时限中必须通过https才能访问,这就一定程度上减少了ssl剥离攻击。

开启的方法也很简单,加上一个http header就可以了,默认为你是Nginx的web server

server {
add_header "Strict-Transport-Security: max-age=31536000; includeSubdomains; preload";
}

gzip压缩

好了,这里继续提升性能。

在前面的步骤上我把js的bundle压缩到了260kb,虽然有了相当大的性能提升,然而还可以做的更多

比如gzip。

只要在nginx的配置文件中这么写上就可了

gzip  on;
gzip_types
text/css
text/console
text/javascript
application/javascript
application/json
application/x-javascript
application/xml
application/xml+rss
application/xhtml+xml
application/x-font-ttf
application/x-font-opentype
application/vnd.ms-fontobject
image/svg+xml
image/x-icon
application/rss+xml
application/atom_xml;
gzip_comp_level 5;
gzip_vary on;

我的260kb的js文件经过gzip压缩,只有60kb大小了,又是相当不错的提升。

现在可以感觉网页更快了。

缓存

是时候开启缓存了。

这一步要求要给前端文件一个唯一的时间戳样的东西,可以要求浏览器强制刷新的东西。

类似于/build/output/app-1ce2f7093b.js的文件名

在nginx的配置文件中这么写一点儿吧,注意要是server{}

location ~*  \.(jpg|jpeg|png|gif|ico|css|js)$ {
expires 365d;
}

移除信息

在header上的php version可能会暴露一些信息,最好隐藏掉

在php.ini中设置这样一行就可以了。

expose_php = Off;

Nginx的版本号最好也能隐藏一下啊

在nginx.conf中设置下

server_token off;

完毕

$ sudo service php7-fpm restart
$ sudo service nginx restart

这个阶段我所能了解到的关于web服务器的性能提升差不多就是这样了。剩下的大概是代码层面,和数据库部分的提升了。

谢谢你能看到这里哈~

References