Skip to content
This repository was archived by the owner on Jan 23, 2021. It is now read-only.
This repository was archived by the owner on Jan 23, 2021. It is now read-only.

runtimeCaching with client side routing with javascript and html #365

@amitvshah25

Description

@amitvshah25

i have web app with header,footer and content.. my content is similar to app-shell. and i am using page.js for client side routing.. so when user requests page xxx.com/app/example1 .. i load example1.html via jquery.load(..) and so on.. my sw-precache file looks like this..
function writeServiceWorkerFile(cachename,rootDir, handleFetch, callback) { var config = { cacheId: cachename, staticFileGlobs: [ rootDir + '/assets/min/css/**/*.css', //rootDir + '/assets/min/js/lib/**/*.css', rootDir + '/**.html', rootDir + '/assets/images/**.*', rootDir + '/assets/font/**.*', rootDir + '/assets/min/js/**/*.js' ], stripPrefix: rootDir + '/', verbose: false, runtimeCaching:[{ urlPattern:/\/app\//, handler: 'cacheFirst' }], //navigateFallback: 'index.html', navigateFallbackWhitelist: [/^\/app/] }; swPrecache.write(path.join(rootDir, 'service-worker.js'), config, callback) }

when i see the page.. it loads example1.html from service worker cache.. which works fine..
my example1.html looks like

<script type="text/javascript" src="assets/min/js/modules/xxx/findDetails.js"></script> <script type="text/javascript" src="assets/min/js/modules/xxx/findMain.js"></script> <script type="text/javascript" src="assets/min/js/modules/xxx/findResults.js"></script>

css files in example1.html gets loaded from cache.. but javascript files which are included in example1.html dont get loaded from cache.. how can i make sure they gets loaded from cache as well.. when i see service-worker under developer console --> application --> cache storage.. i see all above 3 js files are there..

i dont know what am i missing here.. do i need to set up custom-handler.js and use that ??

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions