使用Cloud Storage与Cloud CDN分发视频时iOS端播放延迟问题排查

核心问题 #

Flutter应用中，iOS端AVPlayer请求Cloud CDN加速的Cloud Storage（GCS）MP4视频时，会先全量下载再播放，Android端则加载正常；直接请求GCS源站时iOS也能秒开。根源是AVPlayer发送的初始Range: bytes=0-1请求，部分场景下Cloud CDN返回304 Not Modified响应，缺失Content-Type、Content-Length等关键头，导致AVPlayer无法识别视频类型与大小，只能触发全量下载。

304响应的触发原因 #

Cloud CDN返回304的核心逻辑：

• 客户端请求携带If-None-Match或If-Modified-Since头，且CDN缓存资源的ETag/修改时间与请求头匹配
• 初始Range:0-1请求的缓存条目仅存储了Age、Etag等基础响应头，未包含视频相关的Content-Type、Content-Range字段，导致304响应完全缺失这些关键信息

解决方案 #

1. 配置Cloud CDN缓存策略，强制返回完整206响应 #

在Cloud CDN的缓存规则中针对Range请求做以下调整：

• 缓存键包含Range头：确保不同Range请求的缓存条目独立，避免复用无完整头的缓存记录
• 强制缓存完整响应头：在GCS存储桶的对象元数据中，确保Content-Type: video/mp4、Accept-Ranges: bytes字段正确设置，同时配置Cloud CDN允许缓存这些响应头
• 调整Range请求的缓存TTL：给视频文件的Range请求设置合理TTL（如1天），避免CDN缓存不完整的响应头

2. 绕过Flutter VideoPlayer限制，自定义iOS请求逻辑 #

通过Flutter平台通道（MethodChannel）在iOS原生层拦截AVPlayer请求，仅针对初始Range请求调整缓存策略：

• 创建自定义AVAssetResourceLoaderDelegate，拦截AVPlayer的网络请求
• 仅对Range: bytes=0-1的请求设置CachePolicy.reloadIgnoringLocalCacheData，不影响其他请求的缓存
• 示例iOS原生代码：

func resourceLoader(_ resourceLoader: AVAssetResourceLoader, shouldWaitForLoadingOfRequestedResource loadingRequest: AVAssetResourceLoadingRequest) -> Bool {
    guard let url = loadingRequest.request.url else { return false }
    let mutableRequest = loadingRequest.request as! NSMutableURLRequest
    
    // 仅针对初始Range请求跳过缓存
    if let rangeHeader = mutableRequest.value(forHTTPHeaderField: "Range"), rangeHeader == "bytes=0-1" {
        mutableRequest.cachePolicy = .reloadIgnoringLocalCacheData
    }
    
    let task = URLSession.shared.dataTask(with: mutableRequest as URLRequest) { data, response, error in
        guard let httpResponse = response as? HTTPURLResponse, let data = data else {
            loadingRequest.finishLoading(with: error)
            return
        }
        loadingRequest.finishLoading(with: httpResponse, data: data, redirect: nil)
    }
    task.resume()
    return true
}

随后在Flutter端通过MethodChannel将该自定义加载器关联到VideoPlayer控制器。

3. 修复GCS对象元数据 #

确保GCS中的MP4文件元数据正确配置：

• 手动设置Content-Type: video/mp4（避免自动识别错误）
• 添加Accept-Ranges: bytes头，明确告知CDN与客户端支持分块请求
• 批量设置的gsutil命令：

gsutil setmeta -h "Content-Type:video/mp4" -h "Accept-Ranges:bytes" gs://your-bucket/**/*.mp4

临时方案优化 #

你之前使用的If-None-Match: "1"会导致全局缓存失效，可优化为仅对初始Range:0-1请求添加该头，其他请求正常走缓存。可通过Flutter网络拦截器（如dio拦截器）或iOS原生请求拦截实现，避免影响视频整体缓存效率。

内容的提问来源于stack exchange，提问作者scottynoshotty