You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

谷歌检测中网站CSS丢失,疑似Service Worker问题求助

网站移动友好性测试样式加载异常问题

我在浏览器中加载网站时显示正常,但使用谷歌移动友好性测试工具检测时,网站未加载样式表,无法通过移动端适配测试。怀疑是当前使用的Service Worker导致问题,但不清楚具体原因。

当前使用的Service Worker完整代码

const
    _           = {
        domain: 'https://matchflix.ch/',
        name: 'matchflix'
    },
    cachable    = [_.domain, 'https://fonts.googleapis.com/', 'https://ajax.googleapis.com/'],
    log         = 'ServiceWorker 1.1'
;

self.addEventListener('fetch', event => {
    if(event.request.method !== 'GET')
        return;

    if(!event.request.referrer.startsWith(_.domain))
        return;

    if(!cachable.some(url => event.request.url.startsWith(url)))
        return;

    function versionedURL(request){
        switch(request.destination){
            case 'image':
            case 'script':
            case 'style':
                let
                    version = self.serviceWorker.scriptURL.split('?')[1]
                ;
                return new Request(request.url + '?' + version);

            
            default:
                return request;
        }
    }

    let
        internal = event.request.url.startsWith(_.domain),
        request =  internal ? versionedURL(event.request) : event.request
    ;
    event.respondWith(caches.open(_.name)
        .then(cache => fetch(request)
            .then(response => {
                console.debug(log, 'Caching', internal, response, request);

                if(internal)
                    cache.put(request, response.clone());
                
                return response;
            })
            .catch(() => cache.match(request))
        )
    );
});

谷歌检测下的网站显示效果

谷歌检测下的网站显示效果

已尝试的操作

  • 注释掉Service Worker的注册,但问题未改善;
  • 在测试页面看到脚本和样式表加载出现未知错误,但无更多详细信息。

内容的提问来源于stack exchange,提问作者Simon Ferndriger

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.18 18:31:05