` link for **manifest.json**
5 | - Bug: **Property** **`ServiceWorkerBaseUrl`** - used to specify the base Url in the ServiceWorker was not being used in the _required files_ list.
6 | - Bug: **Property** **`ServiceWorkerBaseUrl`** - used to specify the base Url in the ServiceWorker was not being used in the index `` link for **ServiceWorker.js**
7 | - Also @SQL-MisterMagoo
8 | - Added code to automatically add leading and trailing slashes to **Property** **`ManifestBaseUrl`**
9 | - Added code to automatically add leading and trailing slashes to **Property** **`ServiceWorkerBaseUrl`**
10 |
11 | #### 11/11/2019
12 |
13 | - Added new **Property** **`ServiceWorkerIgnoreHosts`** - used to prevent service worker installation on specific hosts e.g. localhost
14 |
15 | #### 16/10/2019
16 |
17 | - Added new **Property** **`BlazorProjectType`** - used to select the type of Blazor project (SSB/CSB). This property will auto-configure but can be overridden in your csproj file in cases where auto-configure is wrong.
18 | - Added new **ServiceWorkerPattern** value - "none" - primarily intended for SSB projects (where it is the default) - this service worker does nothing.
19 | - Removed **Property** **`ServiceWorkerIndexUrl`**
20 | - Added new **Property** **`ProjectIndexPage`** - used to identify the name of a _CSB_ index page - defaults to `index.html`
21 | - Added new **Property** **`ProjectHomePage`** - used to identify the name of a _SSB_ index page - defaults to `Pages\_Host.cshtml`
22 | - Added **`BlazorProjectType`** to build output.
23 |
24 | #### 10/08/2019 - 13/08/2019
25 |
26 | - Added new **Property** **`ServiceWorkerUpdateAlertText`** - used to change the default text in the "Update available alert".
27 | - Added new **Property** **`ServiceWorkerRegisterUpdateType`** - used to select the "Update available alert" type.
28 | - Added new **Property** **`ServiceWorkerRegisterUpdateTemplate`** - The name of the template file for the "update available" event.
29 | - Added new **Property** **`ServiceWorkerRegisterInstallableType`** - used to select the "Installable PWA alert" type.
30 | - Added new **Property** **`ServiceWorkerRegisterInstallableTemplate`** - The name of the template file for the "Installable PWA alert" event.
31 | - Added new **Property** **`ServiceWorkerRegisterBeforeInstallPromptType`** - used to select the "Before Install Prompt" type.
32 | - Added new **Property** **`ServiceWorkerRegisterBeforeInstallPromptTemplate`** - The name of the template file for the "Before Install Prompt" event.
33 | - Moved the "Update available alert" to it's own template so we can have alternates
34 | - Moved the "Installable PWA alert" to it's own template so we can have alternates
35 | - Moved the "Before Install Prompt" to it's own template so we can have alternates
36 | - Tidied up default install alert a bit
37 | - Added new Installable PWA Alert type - "installable-blazor" which will call a Blazor static method, which is defined by:
38 | - **`ServiceWorkerBlazorAssembly`** which is used to define the Blazor Assembly namespace - defaults to the project name
39 | - **`ServiceWorkerBlazorInstallMethod`** which is used to define the Blazor method to call - defaults to 'PWAInstallable'
40 | - Updated README with Blazor interop example.
41 |
42 | #### 08/08/2019 Initial Release
--------------------------------------------------------------------------------
/LICENSE.txt:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2019 Mister Magoo
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README - nuget.md:
--------------------------------------------------------------------------------
1 | # Blazor PWA Builder - MSBuild
2 |
3 | The easiest way to turn your Server Side And Client Side Blazor projects into Progressive Web Apps (PWA).
4 |
5 | This project, when added to your build process, will generate the required files to enable basic PWA abilities for your project.
6 |
7 | It generates a manifest.json, a Service Worker with pre-caching of all required files (Blazor WebAssembly only) and an installer for the Service Worker.
8 |
9 | It currently includes a simple banner, by default, to notify the user that your application can be installed, and a simple alert to notify users when your application has been updated (CSB Only).
10 |
11 | This is now an official release - I am looking for feedback/issues/requests.
12 |
13 | ## Installation
14 |
15 | Install the nuget BlazorPWA.MsBuild
16 |
17 | #### Package Manager:
18 | `Install-Package BlazorPWA.MSBuild -Version 1.0.2`
19 |
20 | #### .NET Cli:
21 | `dotnet add package BlazorPWA.MSBuild --version 1.0.2`
22 |
23 | #### Package Reference
24 | ``
25 |
26 | ## Configuration
27 |
28 | Required configuration: none *.
29 |
30 | **Really! try it!*
31 |
32 | This PWA builder is constructed using MSBuild targets, which get installed in your .nuget cache.
33 |
34 | You are free to inspect those targets and customise any part of the build by adding Properties to your csproj, or to a **.props** file in the source tree.
35 |
36 | For example, by default, the PWA builder will only generate the PWA files once, which means, should you want to, you can add it to your project, build once - you will have the required files for a PWA and will be free to modify them to suit.
37 |
38 | Should you want to re-generate the PWA files every build, you can add this Property to your **csproj**
39 |
40 | **`true`**
41 |
42 | When you want to publish an update to your app, you may need to supply a new browser cache version - if you don't change anything in the Service Worker the end user will not use your new code!
43 |
44 | *Note: PWAs update when they detect a change in the Service Worker code - this cache version number is used in the Service Worker, so updating the cache version number will trigger an update of the PWA for the end user. It's also important as the cache is where your code is stored - if you don't update the cache version, it will not refresh with your new code*
45 |
46 | **`2`**
47 |
48 | The web manifest has properties for the application name, which are taken, by default, from your project and solution names, but you can override them
49 |
50 | **`My Project`**
51 |
52 | **`My Really Great Project`**
53 |
54 | There are dozens of Properties in the *targets* files supplied by this package - you *could* customise them all, but you probably don't need to, so proceed with caution.
55 |
56 | Please see the full README on GitHub for more details.
57 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Blazor PWA Builder - MSBuild (no longer under development due to official support now being available)
2 |
3 | The easiest way to turn your Server Side And Client Side Blazor projects into Progressive Web Apps (PWA).
4 |
5 | This project, when added to your build process, will generate the required files to enable basic PWA abilities for your project.
6 |
7 | It generates a manifest.json, a Service Worker with pre-caching of all required files (Blazor WebAssembly only) and an installer for the Service Worker.
8 |
9 | It currently includes a simple banner, by default, to notify the user that your application can be installed, and a simple alert to notify users when your application has been updated (CSB Only).
10 |
11 | This is now an official release - I am looking for feedback/issues/requests.
12 |
13 | ### Browser compatibility
14 |
15 | Note that chromium browsers will prompt you to install a PWA on a desktop computer.
16 | Firefox does not currently provide this experience on desktop.
17 | I don't have a Mac, but I believe Safari does not prompt on desktop either.
18 |
19 | ## Installation
20 |
21 | Install the nuget BlazorPWA.MsBuild
22 |
23 | #### Package Manager:
24 | `Install-Package BlazorPWA.MSBuild -Version 1.0.2`
25 |
26 | #### .NET Cli:
27 | `dotnet add package BlazorPWA.MSBuild --version 1.0.2`
28 |
29 | #### Package Reference
30 | ``
31 |
32 | ## Configuration
33 |
34 | Required configuration: none *.
35 |
36 | **Really! try it!*
37 |
38 | This PWA builder is constructed using MSBuild targets, which get installed in your .nuget cache.
39 |
40 | You are free to inspect those targets and customise any part of the build by adding Properties to your csproj, or to a **.props** file in the source tree.
41 |
42 | For example, by default, the PWA builder will only generate the PWA files once, which means, should you want to, you can add it to your project, build once - you will have the required files for a PWA and will be free to modify them to suit.
43 |
44 | Should you want to re-generate the PWA files every build, you can add this Property to your **csproj**
45 |
46 | **`true`**
47 |
48 | When you want to publish an update to your app, you may need to supply a new browser cache version - if you don't change anything in the Service Worker the end user will not use your new code!
49 |
50 | *Note: PWAs update when they detect a change in the Service Worker code - this cache version number is used in the Service Worker, so updating the cache version number will trigger an update of the PWA for the end user. It's also important as the cache is where your code is stored - if you don't update the cache version, it will not refresh with your new code*
51 |
52 | **`2`**
53 |
54 | The web manifest has properties for the application name, which are taken, by default, from your project and solution names, but you can override them
55 |
56 | **`My Project`**
57 |
58 | **`My Really Great Project`**
59 |
60 | There are dozens of Properties in the *targets* files supplied by this package - you *could* customise them all, but you probably don't need to, so proceed with caution.
61 |
62 | ### Handing the "Installable PWA" event in Blazor
63 |
64 | When a Chromium based browser detects an installable PWA, it fires an event that your application
65 | can use to display a prompt to the user.
66 |
67 | The default for this package is to simply display a bar at the bottom of the
68 | browser window prompting the user to install your app.
69 |
70 | You can customize the message, or you can override that and pass the event
71 | over to your Blazor application - by setting the property
72 | **`ServiceWorkerRegisterInstallableType`** to **`installable-blazor`** in your **.csproj**
73 |
74 | For example:
75 | ```
76 |
77 | installable-blazor
78 | true
79 |
80 | ```
81 |
82 | This will generate code in your **ServiceWorkerRegister.js** to make an
83 | interop call to Blazor when the **beforeinstallprompt** event fires in the browser.
84 |
85 | **ServiceWorkerRegisterInstallableType** tells it you are using Blazor for the install prompt.
86 | **ServiceWorkerForce** just lets it update the generated files (remove it when you have it working).
87 |
88 | In your Blazor application, you will need code to handle this call
89 | - by default it will use the **ProjectName** and method name **"InstallPWA"** to
90 | perform a `DotNet.InvokeAsync()`
91 | - These values can be customised using the properties **`ServiceWorkerBlazorAssembly`**
92 | and **`ServiceWorkerBlazorInstallMethod`**
93 |
94 | Here is an example Blazor implementation which could be added to **MainLayout**
95 |
96 | ``` HTML
97 | @if (Installable)
98 | {
99 |
100 |
Install this app?
101 |
102 |
103 | }
104 | ```
105 | This will display a bar at the bottom of the browser, which can be dismissed or clicked.
106 |
107 |
108 | The `code` section has the `JSInvokable` method **InstallPWS** that we called
109 | earlier from the browser and some supporting code to toggle the display and
110 | make an interop call back to the browser to trigger the app installation.
111 | ``` C#
112 | @code
113 | {
114 | [Inject] IJSRuntime JSRuntime { get; set; }
115 | static bool Installable = false;
116 | static Action ml;
117 | protected override void OnInitialized()
118 | {
119 | ml = () => InvokeAsync(StateHasChanged);
120 | }
121 |
122 | [JSInvokable("InstallPwaPrompt")]
123 | //a named method so that it is easy to call from JS Interop
124 | // with the following config
125 | // installable-blazor
126 | // TestPwa.Client
127 | // InstallPwaPrompt
128 | public static Task InstallPwaPrompt()
129 | {
130 | Installable = true;
131 | ml.Invoke();
132 | return Task.CompletedTask;
133 | }
134 | async void InstallClicked(MouseEventArgs args)
135 | {
136 | Installable = false;
137 | await JSRuntime.InvokeAsync