silviolleite/laravel-pwa

Looks like an app, feels like an app, but IS NOT an app.

Laravel (PWA) Progressive Web Aplication

This Laravel pakage turns your project into a progressive web app. Navigating to your site on an Android phone will prompt you to add the app to your home screen.

Launching the app from your home screen will display your app. As such, it's critical that your application provides all navigation within the HTML (no reliance on the browser back or forward button).

See too the Laravel PWA Demo

Requirements

Progressive Web Apps require HTTPS unless being served from localhost. If you're not already using HTTPS on your site, check out Let's Encrypt and ZeroSSL.

Installation

Add the following to your composer.json file :

"require": {
    "silviolleite/laravelpwa": "~2.0.3",
},

or execute

composer require silviolleite/laravelpwa --prefer-dist

Publish

$ php artisan vendor:publish --provider="LaravelPWA\Providers\LaravelPWAServiceProvider"

Configuration

Configure your app name, description, icons and splashes in config/laravelpwa.php.

'manifest' => [
        'name' => env('APP_NAME', 'My PWA App'),
        'short_name' => 'PWA',
        'start_url' => '/',
        'background_color' => '#ffffff',
        'theme_color' => '#000000',
        'display' => 'standalone',
        'orientation' => 'any',
        'status_bar' => 'black',
        'icons' => [
            '72x72' => [
                'path' => '/images/icons/icon-72x72.png',
                'purpose' => 'any'
            ],
            '96x96' => [
                'path' => '/images/icons/icon-96x96.png',
                'purpose' => 'any'
            ],
            '128x128' => [
                'path' => '/images/icons/icon-128x128.png',
                'purpose' => 'any'
            ],
            '144x144' => [
                'path' => '/images/icons/icon-144x144.png',
                'purpose' => 'any'
            ],
            '152x152' => [
                'path' => '/images/icons/icon-152x152.png',
                'purpose' => 'any'
            ],
            '192x192' => [
                'path' => '/images/icons/icon-192x192.png',
                'purpose' => 'any'
            ],
            '384x384' => [
                'path' => '/images/icons/icon-384x384.png',
                'purpose' => 'any'
            ],
            '512x512' => [
                'path' => '/images/icons/icon-512x512.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' => 'Shortcut Link 1',
                'description' => 'Shortcut Link 1 Description',
                'url' => '/shortcutlink1',
                'icons' => [
                    "src" => "/images/icons/icon-72x72.png",
                    "purpose" => "any"
                ]
            ],
            [
                'name' => 'Shortcut Link 2',
                'description' => 'Shortcut Link 2 Description',
                'url' => '/shortcutlink2'
            ]
        ],
        'custom' => []
    ]

You can specify the size of each icon as key of the array or specify it:

[
    'path' => '/images/icons/icon-512x512.png',
    'sizes' => '512x512',
    'purpose' => 'any'
],

Obs: In the custom tag you can insert personalized tags to manifest.json like this e.g:

...
'custom' => [
    'tag_name' => 'tag_value',
    'tag_name2' => 'tag_value2',
    ...
]
...

Include within your <head> the blade directive @laravelPWA.

<html>
<head>
    <title>My Title</title>
    ...
    @laravelPWA
</head>
<body>
    ...
    My content
    ...
</body>
</html>

This should include the appropriate meta tags, the link to manifest.json and the serviceworker script.

how this example:

<!-- Web Application Manifest -->
<link rel="manifest" href="/manifest.json">
<!-- Chrome for Android theme color -->
<meta name="theme-color" content="#000000">

<!-- Add to homescreen for Chrome on Android -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="application-name" content="PWA">
<link rel="icon" sizes="512x512" href="/images/icons/icon-512x512.png">

<!-- Add to homescreen for Safari on iOS -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="PWA">
<link rel="apple-touch-icon" href="/images/icons/icon-512x512.png">

<link href="/images/icons/splash-640x1136.png" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-750x1334.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1242x2208.png" media="(device-width: 621px) and (device-height: 1104px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1125x2436.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-828x1792.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1242x2688.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1536x2048.png" media="(device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1668x2224.png" media="(device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-1668x2388.png" media="(device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />
<link href="/images/icons/splash-2048x2732.png" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image" />

<!-- Tile for Win8 -->
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/images/icons/icon-512x512.png">

<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>

Troubleshooting

While running the Laravel test server:

1. Verify that /manifest.json is being served
2. Verify that /serviceworker.js is being served
3. Use the Application tab in the Chrome Developer Tools to verify the progressive web app is configured correctly.
4. Use the "Add to homescreen" link on the Application Tab to verify you can add the app successfully.

The Service Worker

By default, the service worker implemented by this app is:

var staticCacheName = "pwa-v" + new Date().getTime();
var filesToCache = [
    '/offline',
    '/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',
    '/images/icons/splash-640x1136.png',
    '/images/icons/splash-750x1334.png',
    '/images/icons/splash-1242x2208.png',
    '/images/icons/splash-1125x2436.png',
    '/images/icons/splash-828x1792.png',
    '/images/icons/splash-1242x2688.png',
    '/images/icons/splash-1536x2048.png',
    '/images/icons/splash-1668x2224.png',
    '/images/icons/splash-1668x2388.png',
    '/images/icons/splash-2048x2732.png'
];

// Cache on install
self.addEventListener("install", event => {
    this.skipWaiting();
    event.waitUntil(
        caches.open(staticCacheName)
            .then(cache => {
                return cache.addAll(filesToCache);
            })
    )
});

// Clear cache on activate
self.addEventListener('activate', event => {
    event.waitUntil(
        caches.keys().then(cacheNames => {
            return Promise.all(
                cacheNames
                    .filter(cacheName => (cacheName.startsWith("pwa-")))
                    .filter(cacheName => (cacheName !== staticCacheName))
                    .map(cacheName => caches.delete(cacheName))
            );
        })
    );
});

// Serve from Cache
self.addEventListener("fetch", event => {
    event.respondWith(
        caches.match(event.request)
            .then(response => {
                return response || fetch(event.request);
            })
            .catch(() => {
                return caches.match('offline');
            })
    )
});

To customize service worker functionality, update the public_path/serviceworker.js.

The offline view

By default, the offline view is implemented in resources/views/vendor/laravelpwa/offline.blade.php

@extends('layouts.app')

@section('content')

    <h1>You are currently not connected to any networks.</h1>

@endsection

To customize update this file.

Contributing

Contributing is easy! Just fork the repo, make your changes then send a pull request on GitHub. If your PR is languishing in the queue and nothing seems to be happening, then send Silvio an email.

laravel-pwa's Issues

Feature request: Add caching headers for manifest.json

I noticed that https://github.com/silviolleite/laravel-pwa/blob/master/Http/Controllers/LaravelPWAController.php does not add Cache-Control: and Expires: headers to the response for manifest.json. It seems like this causes Chrome to re-download manifest.json with every navigation.

Would it be possible for the route registrar to add the corresponding caching middleware with a configurable delay, e.g. one hour?

.mp4 broken video in Safari Mac Os and Ios

.mp4 videos are no longer played in Safari Mac Os and iOS after installing the PWA. After research, I found a solution.
I'm not a pro in SW, I can't have a crooked look at this JS but it works fine.
The origin is : https://stackoverflow.com/questions/52087208/pwa-cached-video-will-not-play-in-mobile-safari-11-4

Here is the adapted code for laravel-pwa (CURRENT_CACHES change to staticCacheName )
Only fetch part is changed in the original script.
///////////////////////////////

self.addEventListener('fetch', function(event) {

headersLog = [];
for (var pair of event.request.headers.entries()) {
    console.log(pair[0]+ ': '+ pair[1]);
    headersLog.push(pair[0]+ ': '+ pair[1])
}
console.log('Handling fetch event for', event.request.url, JSON.stringify(headersLog));

if (event.request.headers.get('range')) {
    console.log('Range request for', event.request.url);
    var rangeHeader=event.request.headers.get('range');
    var rangeMatch =rangeHeader.match(/^bytes\=(\d+)\-(\d+)?/)
    var pos =Number(rangeMatch[1]);
    var pos2=rangeMatch[2];
    if (pos2) { pos2=Number(pos2); }

    console.log('Range request for '+ event.request.url,'Range: '+rangeHeader, "Parsed as: "+pos+"-"+pos2);
    event.respondWith(
        caches.open(staticCacheName.prefetch)
            .then(function(cache) {
                return cache.match(event.request.url);
            }).then(function(res) {
            if (!res) {
                console.log("Not found in cache - doing fetch")
                return fetch(event.request)
                    .then(res => {
                        console.log("Fetch done - returning response ",res)
                        return res.arrayBuffer();
                    });
            }
            console.log("FOUND in cache - doing fetch")
            return res.arrayBuffer();
        }).then(function(ab) {
            console.log("Response procssing")
            let responseHeaders=  {
                status: 206,
                statusText: 'Partial Content',
                headers: [
                    ['Content-Type', 'video/mp4'],
                    ['Content-Range', 'bytes ' + pos + '-' +
                    (pos2||(ab.byteLength - 1)) + '/' + ab.byteLength]]
            };

            console.log("Response: ",JSON.stringify(responseHeaders))
            var abSliced={};
            if (pos2>0){
                abSliced=ab.slice(pos,pos2+1);
            }else{
                abSliced=ab.slice(pos);
            }

            console.log("Response length: ",abSliced.byteLength)
            return new Response(
                abSliced,responseHeaders
            );
        }));
} else {
    console.log('Non-range request for', event.request.url);
    event.respondWith(
        // caches.match() will look for a cache entry in all of the caches available to the service worker.
        // It's an alternative to first opening a specific named cache and then matching on that.
        caches.match(event.request).then(function(response) {
            if (response) {
                console.log('Found response in cache:', response);
                return response;
            }
            console.log('No response found in cache. About to fetch from network...');
            // event.request will always have the proper mode set ('cors, 'no-cors', etc.) so we don't
            // have to hardcode 'no-cors' like we do when fetch()ing in the install handler.
            return fetch(event.request).then(function(response) {
                console.log('Response from network is:', response);

                return response;
            }).catch(function(error) {
                // This catch() will handle exceptions thrown from the fetch() operation.
                // Note that a HTTP error response (e.g. 404) will NOT trigger an exception.
                // It will return a normal response object that has the appropriate error code set.
                console.error('Fetching failed:', error);

                throw error;
            });
        })
    );
}

});

absolute path for manifest.json file in vendor

Hi,
Great plugin for laravel, but i've issue with absolute path for manifest.json file in vendor directory. This issue can't be done if we're using proxy_pass in nginx/webserver which is set to subdirectory. Example:
myproduction url:
domain1.com/sub1/sub2/sub3/
deployment server:
domain2.com/public/manifest.json
The problem is, domain1 trying to access like this domain1.com/manifest.json
how can i change or create dynamic path for access file manifest.json in this case instead of change on vendor directory?
*sorry for my poor english

No manifest.json generated?

Do we need to create a manifest.json file ourselves? It's not being detected by lighthouse too.

I thought the point of this was that the config/laravelpwa.php file would sort out the manifest.json file automatically.

Failed to fetch (production)

in localhost with php artisan serve - work
in localhost/dir_proj/public - not work

in production gave this:

obs: i use same description in packagist and github example.

ajuda. help. ayuda. :)

Popup for app install not showing up

Hi there,
I have an issue with prompt to install the app.
Right now, when I login to the app there is no popup to add to the home screen. I can do it by opening menu and clicking Add to home in Chrome.
Is there a way to automatically show the prompt when user performs the login?
Thanks.

Install option not showing Android google chrome

I have heroku free host its http not https. And not working but local server it works.

In my android install option not showing but only shortcut show.

Does pwa works http domain ?
Why my android shortcut show not install ?
( Note : my android from shortcut i can use most things except service worker )

Thank you.

How to cache dynamic url?

idk how to cache the dynamic url in serviceworker. How to cache them? Thanks!

serviceworker.js:1 Uncaught (in promise) TypeError: Request failed

Hello i have the error:
Laravel PWA: ServiceWorker registration successful with scope: https://divuar.com.ua/

serviceworker.js:1 Uncaught (in promise) TypeError: Request failed

var staticCacheName = "pwa-v" + new Date().getTime();
var filesToCache = [
'/offline',
'/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',
];

Please Explain me what the problem.
You can check site url https://divuar.com.ua

Illegal string offset 'path'

Illegal string offset 'path'
hello i need help after successfully installed the latest update
then i run @php artisan config:clear

when i open my url it shows this error
Illegal string offset 'path' (View: C:\xampp\htdocs\Churchaut\resources\views\layouts\index.blade.php) (View: C:\xampp\htdocs\Churchaut\resources\views\layouts\index.blade.php)

the project manisfect.json
'start_url' => asset(config('laravelpwa.manifest.start_url')),
'display' => config('laravelpwa.manifest.display'),
'theme_color' => config('laravelpwa.manifest.theme_color'),
'background_color' => config('laravelpwa.manifest.background_color'),
'orientation' => config('laravelpwa.manifest.orientation'),
'status_bar' => config('laravelpwa.manifest.status_bar'),
'splash' => config('laravelpwa.manifest.splash')
];

    foreach (config('laravelpwa.manifest.icons') as $size => $file) {
        $fileInfo = pathinfo($file['path']);
        $basicManifest['icons'][] = [
            'src' => $file['path'],
            'type' => 'image/' . $fileInfo['extension'],
            'sizes' => $size,
            'purpose' => $file['purpose']
        ];
    }

    foreach (config('laravelpwa.manifest.custom') as $tag => $value) {
         $basicManifest[$tag] = $value;
    }
    return $basicManifest;
}

}

need help guys!!!!

Restrict admin dashboard pages being cached or offline access

I used this package and it is working great. Thanks for the support.
As I have some admin panel so I want that all the pages related to admin panel including login page being accessed only if the network is connected. These pages do not even cached via ServiceWorker and hence can't be accessed in offline mode.
Any suggestion or code. Thanks all.

Add to Home Button not showing in Chrome Dev tool

Add to home button is not showing in chrome Dev tool

How can I remove the "Laravel" writing when opening the PWA from mobile

When opening the PWA from mobile after adding it on homescreen through Chrome, there is a screen before the app has been loaded, and it loads the logo I put in the laravelpwa.php and on the bottom it says "Laravel". How can I remove that Laravel writing?

I put the screenshot as an attachment (I blurred out the logo and the top part of the phone), as you can see there is a "Laravel" writing on the bottom of the screen.

How can this work with apis

I have api for orders. I want to get json data from there and cache in sw. How can I do so.

not working on server centos7 apache

not working on server centos7 apache

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

In the console, I see this error : Uncaught (in promise) TypeError: Failed to execute 'Cache' on 'addAll': Request failed

In the serviceworker.js, I have
var filesToCache = [
'/offline',
'/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',
];

However, if I remove '/offline', I dont see this error.

I have added this route
Route::get('offline', function () { return view('vendor/laravelpwa/offline'); });

in the routes file.

Can someone guide me why this error is happening ?

Laravel 8

Will the package support Laravel 8?

Audio no Playing on embeded videos [youtube]

I created an app with and used laravel-pwa which works well, but unfortunately when i decide to test embeded video, it plays well but the audio was muted. The youtude video was loaded using iframe embed.

=> I test the video on youtube/chome on my phone, audio came out
=> I tested it on previously app created with Andriod WebView, audio came out
=> the volume control did not fix the audio

Is there anything missing? kindly help

Remove from App

How can I fully remove this package? I ran into problems where somewhat older browsers were showing a warning about performance issues probably regarding the service worker in the background.

I remove the composer package and any files I could find, but when I login it directs me to /serviceworker.js and I cannot seem to remove that.

Undefined variable config in meta.blade.php file

I am getting this error when I include the meta.blade.php.
Or Am I including it in a wrong way? This is how I am doing it:
@include('modules.laravelpwa.meta') in my app.blade.php file. I get this error though
Undefined variable: config (View: C:\xampp\htdocs\queendom\resources\views\modules\laravelpwa\meta.blade.php) (View: C:\xampp\htdocs\queendom\resources\views\modules\laravelpwa\meta.blade.php) (View: C:\xampp\htdocs\queendom\resources\views\modules\laravelpwa\meta.blade.php)

does not work in laravel 7

i have a problem with my code

once install and configured shows a problem in the manifest, errors and warnings

1 icon https://127.0.0.1:8000/images/icons/icon-72x72.png does no specify its size in the manifest
2 Shortcut #1 should include a 96x96 pixel icon
3 Icon src is not set
4 Shortcut #2 should include a 96x96 pixel icon

Installability

No matching service worker detected. you may need to reload the page, or check that the scope of the service worker for the current page encloses the scope and start.

but when I run the lighthouse show other problems

start_url does not respond with a 200 when offlineTimed out waiting for start_url (http://localhost:8000/) to respond.

Does not register a service worker that controls page and start_url
Manifest doesn't have a maskable icon

when I go to the console it shows me

Laravel PWA: ServiceWorker registration successful with scope: http://localhost:8000/

serviceworker.js:1 Uncaught (in promise) TypeError: Request failed

i use this the tutorial

https://www.youtube.com/watch?v=4af3btW1foc

Erro em Publish

php artisan vendor:publish --provider="LaravelPWA\Providers\LaravelPWAServiceProvider"

Symfony\Component\ErrorHandler\Error\FatalError
Declaration of Carbon\Translator::setLocale($locale) must be compatible with Symfony\Contracts\Translation\LocaleAwareInterface::setLocale(string $locale)

Larval Auth

When a user signs in with Laravel Auth, I get the iOS webview after Auth is successful. If I tap done, it takes me to the login screen then throws a 419, but once I close the PWA and reopen it, it works as expected (the users Auth state remains signed in).

Do I have to add anything to stop this from happen?

popup for install not showing up

hi i want to know if there is any possible way to show up and force users to use pwa in mobile because now though i meet all criteria but popup is not showing up and if possible i want to force my users to use pwa with a custom message . thanks in advance

Cache not refreshed using default serviceworker.js

The page cache doesn't get updated when using default config.

My laravel app has cache-control headers defined but i guess the serviceworker takes precedence? I'm logging the staticCacheName variable and it can confirm it is updated correctly and outputs pwa-v{{ timestamp of now() }}. But still, it serves the cached version of the app weeks ago.

Any ideas @silviolleite ?

Actually, the serviceworker seems to give an error Uncaught (in promise) TypeError: Request failed the filesToCache only include images/icons.

Blade doesn't parse the @laravelPWA directive

Please I'm trying to use this package on my laravel 5 site. but Blade doesn't parse the @laravelPWA directive, instead it appears on the front-end between text tags like this, <text>@laravelPWA</text>
The directive is inside the head

Manifest error 404

Manifest file is not generated. The route and blade directive is all ok, but when access the route, domain/manifest.json it gives me error 404.

Add to Home Mini Bar not Showing

Use the "Add to homescreen" link on the Application Tab to verify you can add the app successfully.

I don't see this link on Application Tab, do you have a picture.

Splash screen is not displayed on iOS devices

Hey,
I installed this package and followed all the steps carefully. When I tested it on my iOS device (iPhone 7 plus) the splash screen is not visible and a blank screen comes up. It works fine on android devices.

Invalid argument supplied for foreach()

hello...
i'have installed on laravel 6.
but i get some error..
vendor/silviolleite/laravelpwa/Services/ManifestService.php:27
url : https://flareapp.io/share/dmknY653#F56
can you fix this ?

Deprecation Notice

Deprecation Notice: Class LaravelPWA\Database\Seeders\LaravelPWADatabaseSeeder located in ./vendor/silviolleite/laravelpwa/database/seeders/LaravelPWADatabaseSeeder.php does not comply with psr-4 autoloading standard.

The script has an unsupported mime type ('text/html')

I get this error on production only. Everything is served over HTTPS and set up correctly. On my local machine it works just fine.

@laravelPWA isn't displaying the header

Everything in the title. The @laravelPWA in the code isn't displaying the header.

Instead I used to temporary fix the problem

    @include('laravelpwa::meta', [
        'config' => (include('../config/laravelpwa.php'))["manifest"]
    ])

Did I missed something to make it works ?

Splash screen for iOS

Hi,
First, thanks to your package !
Did you considered to add splash screen meta for iOS ? https://medium.com/@applification/progressive-web-app-splash-screens-80340b45d210

Quite simple to implement and great benefits !

Laravel method assertSeeText() failing because of JavaScript comment

The Laravel method TestResponse::assertSeeText() fails when turning on laravel-pwa.

It is because this method uses strip_tags() to remove HTML tags before checking if a given text is found in the page.

The bug is simply caused by a this JavaScript comment in views/modules/laravelpwa/meta.blade.php:

// <--- THIS BIT IS REQUIRED

Strangely, <-- apparently confuses strip_tags(). Like this:

$str = "aaa bbb <-- ccc ddd";
echo strip_tags( $str ); // Displays "aaa bbb " (tested in a PHP 7.2.4 sandbox)

popup image icon not working dynamically

Hello i try to change image of popup to work dynamic but it not working ,

Storage::url(setting('site.favicon_logo'))

erroren app.css y app.js

cuando se compilan archivos diferentes a los clasicos llamados app.js y app.css generan problemas al cargar en el servidor demora en hacer cambios y genera error en el serviceworker.js

no matching service worker detected

When I try to check if everything is working, I get this error. Yet everything seems ok. Someone had this problem? And if so, does anyone have a track to fix that? Thank you in advance!

Wont install

Hi Thanks for this by the way, ive got a problem when adding to homescreen from mobile because it wont install and just create a shortcut that says the site cant be reached when you open the app in offline.

[Question] Link to PWA (Safari/iOS)

Thanks for this package @silviolleite !

I know this is out of scope. But , is there any additional config to make installed PWA open from a external link?

On iOS13 when click http://www.mysite.com it opens on Safari, not installed PWA.

Laravel PWA: ServiceWorker registration failed: DOMException

Laravel: 5.8
PHP: 7.3

After a fresh install of this library on my Laravel app, I get the following error:

Laravel PWA: ServiceWorker registration failed:  DOMException

Laravel and vuejs

Is possible use this package with laravel and vuejs?
I try use that in my vue/laravel project but dont work

Laravel PWA: ServiceWorker registration failed: TypeError

For a company we I work for, I tried to deploy this project and I get this error in the console (url redacted):
Laravel PWA: ServiceWorker registration failed: TypeError: "ServiceWorker script at https://<url>/serviceworker.js for scope https://<url>/ encountered an error during installation."

[Question] How do I force a redownload of resources

I changed some images but the PWA keeps showing the old ones. How do I force the client to redownload all resources?

@laravelPWA no run

Hello
@laravelPWA the blade directive no run ....

we can do another method to implement ?

Cache not working

Cache do not save. My chrome dev tab under application/cache tab there is no cache save its empty.

How do i solve this cache issue.

Thank you.

cannot include new parameters in manifest.json

when I include new parameters in the laravelpwa.php file, these are not reflected in the manifest.json file generated

Offline view

Hi !
Thanks for your work, its great !
I have a question, maybe do you know wky my app still displaying the default offline view?
I have already changed file on \resources\views\modules\laravelpwa (also on vendor folder), cleared cache from web server, reinstalled the movil app etc, and still see the same view.

Any clue would be appreciated

How can i use laravelPWA without "php artisan serve" ?

When i run http://localhost/myapp/public ,it bring me error "Laravel PWA: ServiceWorker registration failed"

manifest.json 403 error

Hi All,

I have a 403 error in my manifest.json. anyone can help me to solve this?