包简介

A simple and easy-to-use PWA (Progressive Web App) package for Laravel applications.

README 文档

README

Laravel PWA is a package designed to seamlessly integrate Progressive Web Application (PWA) functionality into your Laravel projects. With this package, you can easily configure, update the manifest, and register service workers, enabling any Laravel app to function as a PWA.

✨ Features 🚀

⚙️ Auto-generate PWA manifest and service worker files
🧩 Configurable "Add to Home Screen" install prompt with one-click integration
🔄 Supports Laravel versions 8.x to 13.x out of the box
⚡ Quick setup with minimal configuration required
📱🖥️ Fully responsive — works on both mobile and desktop browsers
🛠️ Customizable via config/pwa.php — control icons, theme color, name, and more
🧑‍💻 Blade directives included for effortless frontend usage
🔐 HTTPS ready — ensures secure and reliable PWA experience
🌐 Compatible with Blade, Livewire, Vue 3, and React

Important ⚠️

Note: PWAs require a secure HTTPS connection to work correctly. Ensure your application is hosted with HTTPS; otherwise, service workers and other PWA features will not function as expected.

Installation 📦

To get started, install the package using Composer:

composer require erag/laravel-pwa

Register the Service Provider

For Laravel (Optional) v11.x, v12.x, v13.x

Ensure the service provider is registered in your /bootstrap/providers.php file:

use EragLaravelPwa\EragLaravelPwaServiceProvider;


return [
    // ...
    EragLaravelPwaServiceProvider::class,
];

For Laravel v8.x, v9.x, v10.x

Ensure the service provider is registered in your config/app.php file:

'providers' => [
    // ...
    EragLaravelPwa\EragLaravelPwaServiceProvider::class,
],

Once installed, publish the PWA configuration files using:

php artisan erag:install-pwa

This will create the required configuration file config/pwa.php and set up PWA functionality for your application.

Configuration ⚙️

Main Configuration File: `config/pwa.php`

This is your main configuration file where you can customize the PWA settings.

return [
    'install-button' => true, // Show or hide the install button globally.

    'manifest' => [
        'name' => 'Laravel PWA',
        'short_name' => 'LPT',
        'background_color' => '#6777ef',
        'display' => 'fullscreen',
        'description' => 'A Progressive Web Application setup for Laravel projects.',
        'theme_color' => '#6777ef',
        'icons' => [
            [
                'src' => 'logo.png',
                'sizes' => '512x512',
                'type' => 'image/png',
            ],
        ],
    ],

    'debug' => env('APP_DEBUG', false), // Show or hide console.log in the browser globally.
    
    
    'livewire-app' => false,
];

Customizing Manifest File

After changing config/pwa.php in your manifest array, run this command You can update your PWA manifest file by running:

php artisan erag:update-manifest

Logo Path

The logo file name is fixed as logo.png, so it must exist at public/logo.png.

Usage 🛠️

To integrate PWA functionality into your layouts, use the provided Blade directives.

1. Add Meta Tags

Place the @PwaHead directive inside the <head> tag of your main layout file:

<!DOCTYPE html>
<html lang="en">
<head>
    @PwaHead <!-- Add this directive to include the PWA meta tags -->
    <title>Your App Title</title>
</head>
<body>

2. Register Service Worker

Just before the closing </body> tag in your main layout file, add:

    @RegisterServiceWorkerScript <!-- This registers the service worker -->
</body>
</html>

These directives will automatically generate the necessary tags and JavaScript for the PWA.

Facade Usage 🎯

You can easily update the manifest dynamically at runtime using the provided PWA Facade.

use EragLaravelPwa\Facades\PWA;

PWA::update([
    'name' => 'Laravel Apps',
    'short_name' => 'LA',
    'background_color' => '#6777ef',
    'display' => 'fullscreen',
    'description' => 'A Progressive Web Application setup for Laravel projects.',
    'theme_color' => '#6777ef',
    'icons' => [
        [
            'src' => 'logo.png',
            'sizes' => '512x512',
            'type' => 'image/png',
        ],
    ],
]);

This will immediately update your manifest.json file in the public directory.
You can call this from a controller, job, or anywhere inside your Laravel project where you need to update PWA settings dynamically.

✅ Make sure public/ folder is writable to allow manifest updates!

This command updates the manifest.json file located in the public directory of your Laravel project.

Uploading a Logo via PWA 🌟

To update the PWA logo dynamically, follow these steps: Your Laravel PWA is now configured to update the logo dynamically! 🚀

1. Create a Controller Method

Input Key Name: logo

Make sure the image is in PNG format, at least 512x512 pixels, and does not exceed 1024 KB in size.

<input type="file" name="logo" accept=".png">

array:2 [▼ // EragLaravelPwa/src/Core/PWA.php:19
  "_token" => "iKbZh21VsYZMpNd9TN12Ul5SoysQzkMXlQkhB5Ub"
  "logo" => Illuminate\Http\UploadedFile{#1426 ▶}]

namespace App\Http\Controllers;

use EragLaravelPwa\Core\PWA;
use Illuminate\Http\Request;
use Illuminate\Routing\Controller;

class SettingsController extends Controller
{
    public function uploadLogo(Request $request)
    {
        $response = PWA::processLogo($request);

        if ($response['status']) {
            return redirect()->back()->with('success', $response['message']);
        }

        return redirect()->back()->withErrors($response['errors'] ?? ['Something went wrong.']);
    }
}

Once uploaded, the new logo will be available at http://yourdomain.com/logo.png.

Screenshots 📸

Installing PWA App

Offline Page

Contribution 🧑‍💻

We appreciate your interest in contributing to this Laravel PWA project! Whether you're reporting issues, fixing bugs, or adding new features, your help is greatly appreciated.

Forking and Cloning the Repository

Go to the repository page on GitHub.
Click the Fork button at the top-right corner of the repository page.

Clone your forked repository:

git clone https://github.com/your-username/laravel-pwa.git

Reporting Issues

If you encounter any issues, please check if the issue already exists in the Issues section. If not, create a new issue with the following details:

Steps to reproduce the issue
Expected and actual behavior
Laravel version
Any relevant logs or screenshots

Submit a Pull Request

When you're ready to contribute, open a pull request describing the changes you’ve made and how they improve the project. Please ensure:

All commits are squashed into one clean commit.
The code follows PSR-12 standards.
You’ve tested the changes locally.

Coding Standards

Follow the PSR-12 PHP coding standards.
Keep your commit history clean and meaningful.
Add comments where needed but avoid over-commenting.

Example Workflow 🌟

Here’s a simple example of how to use this package:

Install the package via Composer.
Publish the configuration files.
Add the @PwaHead directive in your layout file’s <head>.
Add the @RegisterServiceWorkerScript directive before the closing </body> tag.
Customize the config/pwa.php to fit your project’s needs.
Run php artisan erag:update-manifest to update the manifest file.
That's it! Your Laravel app is now PWA-enabled. 🚀

erag/laravel-pwa 适用场景与选型建议

erag/laravel-pwa 是一款基于 PHP 开发的 Composer 扩展包，目前已累计 125.8k 次下载、GitHub Stars 达 177，最近一次更新时间为 2024 年 09 月 19 日，在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向：「laravel」「manifest」「offline」「laravel package」「pwa」「service worker」等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 erag/laravel-pwa 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。

围绕 erag/laravel-pwa 我们能提供哪些服务？

定制开发 / 二次开发

基于 erag/laravel-pwa 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ：316430983 微信：yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

与 erag/laravel-pwa 相关的其它包

同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：

nystudio107/craft-plugin-manifest 4

Plugin Manifest is the conduit between Craft CMS plugins and webpack, with manifest.json & webpack-dev-server HMR support

payum/payum-laravel-package 123

Rich payment solutions for Laravel framework. Paypal, payex, authorize.net, be2bill, omnipay, recurring paymens, instant notifications and many more

idleberg/wordpress-vite-assets 149

Injects assets from a Vite manifest to the Wordpress head, supports themes and plugins

danielbartet/offline-conversions-fb 0

Set Facebook offline conversion

payum/payum-yii-extension 12

Rich payment solutions for Yii framework. Paypal, payex, authorize.net, be2bill, omnipay, recurring paymens, instant notifications and many more

malyusha/laravel-webpack-assets 6

Package to use WebpackManifestPlugin in laravel

erag/laravel-pwa

包简介

关键字：

README 文档

README

✨ Features 🚀

Important ⚠️

Installation 📦

Register the Service Provider

For Laravel (Optional) v11.x, v12.x, v13.x

For Laravel v8.x, v9.x, v10.x

Configuration ⚙️

Main Configuration File: `config/pwa.php`

Customizing Manifest File

Logo Path

Usage 🛠️

1. Add Meta Tags

2. Register Service Worker

Facade Usage 🎯

Uploading a Logo via PWA 🌟

1. Create a Controller Method

Screenshots 📸

Installing PWA App

Offline Page

Contribution 🧑‍💻

Forking and Cloning the Repository

Reporting Issues

Submit a Pull Request

Coding Standards

Example Workflow 🌟

erag/laravel-pwa 适用场景与选型建议

与 erag/laravel-pwa 相关的其它包

统计信息

GitHub 信息

其他信息

erag/laravel-pwa

包简介

关键字：

README 文档

README

✨ Features 🚀

Important ⚠️

Installation 📦

Register the Service Provider

For Laravel (Optional) v11.x, v12.x, v13.x

For Laravel v8.x, v9.x, v10.x

Configuration ⚙️

Main Configuration File: config/pwa.php

Customizing Manifest File

Logo Path

Usage 🛠️

1. Add Meta Tags

2. Register Service Worker

Facade Usage 🎯

Uploading a Logo via PWA 🌟

1. Create a Controller Method

Screenshots 📸

Installing PWA App

Offline Page

Contribution 🧑‍💻

Forking and Cloning the Repository

Reporting Issues

Submit a Pull Request

Coding Standards

Example Workflow 🌟

erag/laravel-pwa 适用场景与选型建议

与 erag/laravel-pwa 相关的其它包

统计信息

GitHub 信息

其他信息

Main Configuration File: `config/pwa.php`