社区所有版块导航
Python
python开源   Django   Python   DjangoApp   pycharm  
DATA
docker   Elasticsearch  
aigc
aigc   chatgpt  
WEB开发
linux   MongoDB   Redis   DATABASE   NGINX   其他Web框架   web工具   zookeeper   tornado   NoSql   Bootstrap   js   peewee   Git   bottle   IE   MQ   Jquery  
机器学习
机器学习算法  
Python88.com
反馈   公告   社区推广  
产品
短视频  
印度
印度  
Py学习  »  NGINX

nginx+varnish+angular universal实现服务端页面渲染缓存

bugDeveloper • 7 年前 • 313 次点击  

nginx+varnish+angular universal实现服务端页面渲染缓存

项目使用angular universal实现服务端渲染,为了减轻服务器的压力,需要将用户频繁访问的页面进行缓存,这样就不必每次都去渲染相同的页面(例如首页),angular universal在features中有提到考虑加入缓存,但就目前来说,varnish是个不错的选择,但是varnish不支持https,所以还需要用nginx进行端口的转发

总的思路

  1. nginx监听80端口将http重定向到https
  2. nginx监听443端口,并将443端口的请求转发到8080端口
  3. varnish监听8080端口的请求,如果与缓存中的页面匹配,则返回页面,如果没有匹配的页面,则请求pm2启动的服务

总的流程

  1. 安装与配置nginx
  2. 安装SSL证书,nginx配置SSL
  3. 安装与启动PM2
  4. 安装与配置varnish

Nginx的安装与配置

  1. 安装nginx

    yum install nginx
    
  2. 配置nginx以安装SSL证书 ( 使用varnish时,不需要nginx监听80端口,nginx监听443端口然后转发到80端口即可 )

    //找到nginx配置文件所在目录
    Linux code: nginx -t
    
    //打开nginx.conf文件配置一个server
    server {
    	listen       80;  //监听的端口
    	server_name  panoramic.laipaiya.com; //域名
    	root         /usr/local/web/Panoramic; //文件路径
    	location / {
    		index  index.html; //主页
    	}
    }
    
    //检查配置是否有误
    Linux code: nginx -t
    
  3. 开启gzip

    //在config文件中加入以下代码
    gzip on;
    gzip_min_length 1k;
    gzip_buffers 4 16k;
    gzip_comp_level 5;
    gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php;
    
  4. 启动nginx

    service nginx start/restart/reload(修改配置后无需重启,reload即可)/stop
    

Certbot证书配置

  1. 下载certbot

    //安装git
    yum install git
    
    git clone https://github.com/certbot/certbot
    cd certbot
    
  2. 安装证书

    ./certbot-auto certonly --webroot --agree-tos -v -t --email 邮箱地址 -w 网站根目录 -d 网站域名
    
    //安装成功后会看到这样的信息,在配置nginx时会用上
    Congratulations! Your certificate and chain have been saved at:
       /etc/letsencrypt/live/beta.laipaiya.com/fullchain.pem
       Your key file has been saved at:
       /etc/letsencrypt/live/beta.laipaiya.com/privkey.pem
       Your cert will expire on 2018-06-28. To obtain a new or tweaked
       version of this certificate in the future, simply run certbot-auto
       again. To non-interactively renew *all* of your certificates, run
       "certbot-auto renew"
    
  3. 证书的有效期为3个月,需要更新证书

    ./certbot-auto renew
    

Nginx配置SSL

  1. 在nginx.conf文件中,新加一个server,将443端口转发到80端口

    server {
        listen 443 ssl;
        server_name beta.laipaiya.com;
        //将ssl证书生成后的pem路径复制到ssl_certificate、ssl_certificate_key
        ssl_certificate /etc/letsencrypt/live/beta.website.com/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/beta.website.com/privkey.pem;
        location / {
            proxy_pass http://127.0.0.1:80;
            proxy_set_header X-Real-IP  $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto https;
            proxy_set_header X-Forwarded-Port 443;
            proxy_set_header Host $host;
        }
    }
    

PM2

  1. 安装pm2

    npm install pm2 -g
    
  2. 启动pm2

    //启动参数
    --watch 监视项目,如有更改自动重启
    -n 为项目命名
    
    pm2 start /usr/local/web/PCbeta/server.js --watch -n PC_SSR_beta
    
  3. pm2命令

    pm2 list  //列出所有应用
    pm2 stop all  //停止所有应用
    pm2 stop name|app_id  //停止指定的应用
    pm2 restart name|app_id  //重启指定的应用
    pm2 logs  //查看日志
    
  4. 对于angular universal应用,需要将生成的dist目录、dist-server目录、server.js一并复制到项目文件夹中

Varnish

  1. 修改varnish配置

    //找到varnish所在目录
    Linux code: whereis varnish
    
    //打开 varnish.params,修改varnish监听的端口为80,接收该端口的http请求
    VARNISH_LISTEN_PORT=80
    
    //打开 default.vcl
    //修改指向服务器的地址和端口(pm2运行的端口)
    backend pc {
        .host = "127.0.0.1"; //指向本地服务器
        .port = "4000";  //监听8080端口运行的程序
    }
    
    //可同时存在多个backend,实现多域名同时使用varnish缓存
    backend pcbeta {
        .host = "127.0.0.1"; 
        .port = "4001";  
    }
    //对不需要使用cookie的页面屏蔽cookie检查,提高命中率,cookie不同varnish会认为是不同的页面,这里只对包含home路径的页面进行检查
    
    sub vcl_recv{
        if (!(req.url ~ "^/home/")) {
        	unset req.http.Cookie;
        }
    }
    
  2. varnish命令

    //启动
    service varnish start
    
    //停止
    service varnish stop
    
    //查看统计日志
    
    varnishtop:读取共享内存中的日志,同时会显示一个不断更新的列表
    
    varnishhist:读取varnishd共享内存日志,同时生成一个连续不断更新的柱状图显示最后 N 个请求的分布。
    
    N的值和垂直比例尺显示在左上角的位置。水平刻度是对数的,命中标记是“|”,未命中标记是“#”。
    
    varnishstat:统计未命中、命中、存储信息、线程创建、删除对象等
    

Python社区是高质量的Python/Django开发社区
本文地址:http://www.python88.com/topic/11423
 
313 次点击