transform-protocol v1.0.0

Web 缓存 For IOS 客户端缓存策略

阅读全文耗时约3分钟

背景说明

IOS 进行请求拦截，可能有审批失败风险，需要使用自定义协议头。 支持IOS 客户端缓存，需要经过以下三步： 1. 升级为 emp2 （不在本文档阐述） 2. 执行协议头转换:yarn transformProtocol 3. 修改 .gitlab-ci.yml 4. 修改服务治理上的 初始化脚本 和 nginx.conf

协议头转换

1. 安装 yarn add transformProtocol -D

2. 在项目新建配置 bdCacheConfig.json

{
  "iosProtocol": "bdglivewebhandle",
  "domain":"项目域名",
  "basePath":"项目发布的相对路径"
}

例如:

3. 执行 yarn transformProtocol，之后会在当前目录新增一个 distCache 目录，是所有资源文件都被替换成 bdglivewebhandle 的协议头

修改 .gitlab-ci.yml

1. 需要在原有 path 上增加 distCache/，将构建出来的 distCache 目录也放进镜像里

  artifacts:
      expire_in: 1 week
      paths:
      - dist/
      - distCache/

2. 原有的 script 增加 yarn transformProtocol ，将 dist 目录的资源协议头转换成 bdglivewebhandle

  script:
    yarn transformProtocol 

服务治理上的配置

初始化脚本

1. 打开发布中心-> 镜像管理 ->选择其中一个镜像,点 编辑
2. 根据实际情况修改 初始化脚本

# 复制nginx配置
if [ ! -d '/data/services/nginx_vhost' ]; then
mkdir /data/services/nginx_vhost
fi
cp /data/services/##{.PKG_NAME}##/conf/nginx.conf /data/services/nginx_vhost/
cp -rf /data/services/##{.PKG_NAME}##/dist/. /www/

# 创建带 IOS 协议头的目录
mkdir /www/iosStatic
cp -rf /data/services/##{.PKG_NAME}##/distCache/.  /www/iosStatic/

nginx.conf 配置

IOS 客户端缓存，Nginx 配置。根据客户端UA 走带特定协议头的页面

server {
    listen 80;
    # 不要直接复制，要修改成对应项目的域名
    server_name static1.bdgamelive.com;
    set $rooturi "/www";
    # 不要直接复制，要修改成对应项目的 location
    location /mobile/page_activity21 {
      alias $rooturi/;
    }
    # 不要直接复制，要修改成对应项目的 location
    location ^~ /mobile/page_activity21/ {
      alias $rooturi/;
      # 判断 IOS 客户端的UA，将访问目录指向带 IOS 缓存协议头的目录
      if ($http_user_agent ~ *"bdglivewebhandle"){
            alias $rooturi/iosStatic/;
        }
      expires 30d;
    }
}