Почему Service Worker останавливает запросы http / https на сервер? - PullRequest
1 голос
/ 07 ноября 2019

Я создаю сайт, используя django и nuxtjs. Я установил service worker, чтобы улучшить скорость. Когда я отменяю регистрацию service worker на вкладке inspect/Application, время моего веб-сайта на вкладке inspect/Network выглядит следующим образом:

timing of a request to the server without service worker

Когда я использую service worker открытие сайта в первый раз нормально, но когда я перезагружаю страницу или открываю другую страницу сайта, запрос к серверу ставится в очередь долгое время. Время моего сайта выглядит следующим образом:

timing of a request to the server with service worker

, который стоит в очереди 1,91 секунды. здесь описывает причины постановки в очередь запроса, и все они находятся в управлении браузером.

Я установил service worker с модулем pwa , который имеет workbox в своих зависимостях,Мой nuxt.config.js файл находится здесь:

import pkg from './package'

import {modify_html} from './services/amp/hook';

export default {
    mode: 'universal',

    /*
    ** Headers of the page
    */
    head: {
    title: 'example',
    meta: [
        { charset: 'utf-8' },
        { name: 'viewport', content: 'width=device-width, initial-scale=1' },
        { hid: 'description', name: 'description', content: pkg.description }
    ],
    link: [
        { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
    },

    /*
    ** Customize the progress-bar color
    */
    loading: { color: '#fff' },

    /*
    ** Global CSS
    */
    css: [
        '~/static/css/base.css',
        '~/static/css/hooper.css',
        '~/static/css/font-awesome/css/all.min.css',
    ],

    /*
    ** Plugins to load before mounting the App
    */
    plugins: [
        { src: '~plugins/ga.js', ssr: false }
    ],

    /*
    ** Nuxt.js modules
    */
    modules: [
        // Doc: https://axios.nuxtjs.org/usage
        '@nuxtjs/axios',
        // Doc: https://bootstrap-vue.js.org/docs/
        'bootstrap-vue/nuxt',
        '@nuxtjs/pwa',
        '@nuxtjs/device',
    ],

    manifest:{
        "short_name": "example",
        "name": "example",
        "icons": [
            {
                "src": "/static/icon.png",
                "type": "image/png",
            },
        ],
        "start_url": "/",
        "background_color": "white",
        "display": "standalone",
        "scope": "/",
        "theme_color": "white"
    },

    workbox:{

    },


    /*
    ** Axios module configuration
    */
    axios: {
        // See https://github.com/nuxt-community/axios-module#options
    },

    /*
    ** Build configuration
    */
    build: {
        /*
        ** You can extend webpack config here
        */
        extend(config, ctx) {
        }
    },

    hooks:{
        // This hook is called before generatic static html files for SPA mode
        'generate:page': (page) => {
            if(page.path.includes('/amp/')){
                page.html = modify_html(page.html)
            }
        },
        // This hook is called before rendering the html to the browser
        'render:route': (url, page, { req, res }) => {
            if(url.includes('/amp/')){
                page.html = modify_html(page.html)
            }
        }
    }
}

Как мне исправить service worker, чтобы не блокировать новые запросы?

...