mohamad kamel
mohamad kamel

Reputation: 21

pwa Laravel don't give me error in console but error in service workers in Cache

this first time to make PWA, I make everything like https://github.com/silviolleite/laravel-pwa and all thing is good in console but make error in manifest and service workers

my path project is :

_config
 |_laravelpwa.php
_resources
 |_views
  |_vendor
   |_laravelpwa
    |_meta.blade.php
_index.php
_serviceworker.js

meta.blade.php all same expect

<script type="text/javascript">
    // Initialize the service worker
    if ('serviceWorker' in navigator) {
        navigator.serviceWorker.register('/serviceworker.js', {
            scope: '.'
        }).then(function (registration) {
            // Registration was successful
            console.log('Laravel PWA: ServiceWorker registration successful with scope: ', registration.scope);
        }, function (err) {
            // registration failed :(
            console.log('Laravel PWA: ServiceWorker registration failed: ', err);
        });
    }
</script>

laravelpwa.php

<?php

return [
    'name' => 'baskotii',
    'manifest' => [
        'name' => 'baskotii',
        'short_name' => 'baskotii',
        'start_url' => '/',
        'background_color' => '#ffffff',
        'theme_color' => '#000000',
        'display' => 'standalone',
        'orientation'=> 'any',
        'status_bar'=> 'black',
        'icons' => [
            '72x72' => [
                'path' => asset('assets/front/img/logo72.png'),
                'purpose' => 'any'
            ],
            '96x96' => [
                'path' => '/public/images/icons/icon-96x96.png',//asset('assets/front/img/logo96.png'),
                'purpose' => 'any'
            ],
            '128x128' => [
                'path' => asset('assets/front/img/logo128.png'),
                'purpose' => 'any'
            ],
            '144x144' => [
                'path' => asset('assets/front/img/logo144.png'),
                'purpose' => 'any'
            ],
            '152x152' => [
                'path' => asset('assets/front/img/logo152.png'),
                'purpose' => 'any'
            ],
            '192x192' => [
                'path' => asset('assets/front/img/logo192.png'),
                'purpose' => 'any'
            ],
            '384x384' => [
                'path' => asset('assets/front/img/logo384.png'),
                'purpose' => 'any'
            ],
            '512x512' => [
                'path' => asset('assets/front/img/logo512.png'),
                'purpose' => 'any'
            ],
        ],
        'splash' => [
            '640x1136' => '/images/icons/splash-640x1136.png',
            '750x1334' => '/images/icons/splash-750x1334.png',
            '828x1792' => '/images/icons/splash-828x1792.png',
            '1125x2436' => '/images/icons/splash-1125x2436.png',
            '1242x2208' => '/images/icons/splash-1242x2208.png',
            '1242x2688' => '/images/icons/splash-1242x2688.png',
            '1536x2048' => '/images/icons/splash-1536x2048.png',
            '1668x2224' => '/images/icons/splash-1668x2224.png',
            '1668x2388' => '/images/icons/splash-1668x2388.png',
            '2048x2732' => '/images/icons/splash-2048x2732.png',
        ],
        'shortcuts' => [
            [
                'name' => 'baskotii',
                'description' => 'baskotii',
                'url' => '/',
                'icons' => [
                    "src" => '/public/images/icons/icon-96x96.png',
                    "purpose" => "any"
                ]
            ]
        ],
        'custom' => []
    ]
];

I use my img and default img and make the same warning

the Result:

console

Laravel PWA: ServiceWorker registration successful with scope:  https://baskotii.ae/

and this in serviceworker.js:1

Uncaught (in promise) TypeError: Failed to execute 'Cache' on 'addAll': Request failed

manifest warning

service workers error

Upvotes: 2

Views: 1154

Answers (1)

Heena Naaz
Heena Naaz

Reputation: 21

Try with update URL in serviceworker.js Like this


var filesToCache = [
    'css/app.css',
    'js/app.js',
    'images/icons/icon-72x72.png',
    'images/icons/icon-96x96.png',
    'images/icons/icon-128x128.png',
    'images/icons/icon-144x144.png',
    'images/icons/icon-152x152.png',
    'images/icons/icon-192x192.png',
    'images/icons/icon-384x384.png',
    'images/icons/icon-512x512.png',
];

Upvotes: 0

Related Questions