部署静态资源

创建目录存放静态文件

mkdir  /opt/app/angular-ssr

将编译后的代码文件放到创建的目录当中

image.png

修改conf文件

vim /etc/nginx/conf.d/default.conf

修改root对应的路径为资源文件路径

image.png

reload服务

nginx -s reload -c /etc/nginx/nginx.conf

查看界面

image.png

缓存机制

缓存原理

image.png

设置 expires 请求头

 location ~ .*\.(html|htm)$ {
      expires 24h;
      root /app/nginx/code;
}

image.png

跨域

设置跨域请求头

location ~ .*\.(html|htm)$ {
   add_header Access-Control-Allow-Origin http://www.jesonc.com;
   add_header Access-Control-Allow-Methods GET,POST,PUT,DELETE,OPTIONS;
   root /app/nginx/code;
}

防盗链

• 目的：防止资源被盗用
• 设置思路：区别哪些请求是非正常的用户请求

基于 http_refer 防盗链配置模块

location ~ .*\.(jpg|gif|png)$ {
    gzip on;
    gzip_http_version 1.1;
    gzip_types text/plain application/javascript application/x-javascript text/css application/xml text/javacript application/x-httpd-php image/jpeg image/gif image/png;
    # 防盗链
    valid_referers none blocked 116.62.103.228;
    if ($invalid_referer) {
        return 403;
    }
    root /app/nginx/code/images;
}