diff --git a/README.md b/README.md index 75e2e7f..27e3b20 100755 --- a/README.md +++ b/README.md @@ -84,6 +84,25 @@ oneSignal: { } ``` +## Change Worker Path and Scope + +By default OneSignal expects you to put `OneSignalSDKWorker.js` in the root of your website (nuxt static folder). In case you're already using `@nuxt/pwa` with the `workbox` module, you already should have a service worker there. Two workers can't have the same scope. + +That is why this module changes the scope of `OneSignalSDKWorker.js` to `/_push_/onesignal/`. You can use options to customize path, scope, and filenames. + +```js +oneSignal: { + filesPath: '', // set to your path if you put worker files into a subdir, for example '/_push_/onesignal/' + workerFile: 'OneSignalSDKWorker.js', + updaterFile: 'OneSignalSDKUpdaterWorker.js', + swParams: { + scope: '/_push_/onesignal/' // set to an empty string ('') if you want OneSignal to be your main worker + } +} +``` + +Be sure to use the same settings in OneSignal. See [Service Worker Customizations (path and scope)](https://documentation.onesignal.com/docs/onesignal-service-worker-faq#sdk-parameter-reference-for-service-workers) + ## References - [Web Push SDK Reference](https://documentation.onesignal.com/docs/web-push-sdk) - Available options and API calls @@ -91,6 +110,7 @@ oneSignal: { - [Thanks for Subscribing Notifications](https://documentation.onesignal.com/docs/welcome-notifications) - [Product overview](https://documentation.onesignal.com/docs/product-overview) - More info about OneSignal - [Web Push SDK Setup](https://documentation.onesignal.com/docs/web-push-sdk-setup-https) - Setup guides for in-depth reading what this modules does. +- [Service Worker Customizations (path and scope)](https://documentation.onesignal.com/docs/onesignal-service-worker-faq#sdk-parameter-reference-for-service-workers) ## License diff --git a/example/.gitignore b/example/.gitignore index 06a75e9..a6c7c28 100644 --- a/example/.gitignore +++ b/example/.gitignore @@ -1 +1 @@ -OneSignalSDK* +*.js diff --git a/example/nuxt.config.js b/example/nuxt.config.js index 1ad984b..52a8707 100644 --- a/example/nuxt.config.js +++ b/example/nuxt.config.js @@ -9,6 +9,12 @@ export default { oneSignal: { init: { appId: 'd867ac26-f7be-4c62-9fdd-b756a33c4a8f' - } + }, + workerFile: 'OneSignalSDKWorker.js', + updaterFile: 'OneSignalSDKUpdaterWorker.js', + swParams: { + scope: '' + }, + filesPath: '' } } diff --git a/lib/module.js b/lib/module.js index 2ddbc4b..52bc28f 100755 --- a/lib/module.js +++ b/lib/module.js @@ -1,5 +1,5 @@ import path from 'path' -import { writeFileSync, readFileSync } from 'fs' +import { writeFileSync, readFileSync, mkdirSync } from 'fs' import hasha from 'hasha' import defu from 'defu' import { getRouteParams, joinUrl } from './utils' @@ -17,25 +17,29 @@ export default function nuxtOneSignal (oneSignalOptions) { } function addOneSignal (oneSignalOptions) { - const { publicPath } = getRouteParams(this.options) + const context = this + const { publicPath } = getRouteParams(context.options) // Merge options const defaults = { OneSignalSDK: undefined, cdn: true, GcmSenderId: '482941778795', - importScripts: [ - '/sw.js?' + Date.now() - ], init: { allowLocalhostAsSecureOrigin: true, welcomeNotification: { disable: true } + }, + filesPath: '', + workerFile: 'OneSignalSDKWorker.js', + updaterFile: 'OneSignalSDKUpdaterWorker.js', + swParams: { + scope: '/_push_/onesignal/' } } - const options = defu({ ...this.options.oneSignal, ...oneSignalOptions }, defaults) + const options = defu({ ...context.options.oneSignal, ...oneSignalOptions }, defaults) if (options.OneSignalSDK === undefined) { if (options.cdn) { @@ -63,8 +67,8 @@ function addOneSignal (oneSignalOptions) { } // Add the oneSignal SDK script to head - if (!this.options.head.script.find(s => s.hid === 'onesignal')) { - this.options.head.script.push({ + if (!context.options.head.script.find(s => s.hid === 'onesignal')) { + context.options.head.script.push({ async: true, src: options.OneSignalSDK, hid: 'onesignal' @@ -72,28 +76,34 @@ function addOneSignal (oneSignalOptions) { } // Adjust manifest for oneSignal - if (!this.options.manifest) { - this.options.manifest = {} + if (!context.options.manifest) { + context.options.manifest = {} } - this.options.manifest.gcm_sender_id = options.GcmSenderId - - // Adjust swURL option of Workbox for oneSignal - if (!this.options.workbox) { - this.options.workbox = {} - } - this.options.workbox.swURL = 'OneSignalSDKWorker.js' + context.options.manifest.gcm_sender_id = options.GcmSenderId // Provide OneSignalSDKWorker.js and OneSignalSDKUpdaterWorker.js - const makeSW = (name, scripts) => { - const workerScript = `importScripts(${scripts.map(i => `'${i}'`).join(', ')})\r\n` - writeFileSync(path.resolve(this.options.srcDir, 'static', name), workerScript, 'utf-8') + const { + filesPath: workerDir, + workerFile, + updaterFile + } = options + + const staticDir = path.resolve(context.options.srcDir, 'static') + + const writeWorker = (fileName, script) => { + const workerScript = `importScripts('${script}')\r\n` + mkdirSync(path.join(staticDir, workerDir), { recursive: true }) + writeFileSync(path.join(staticDir, workerDir, fileName), workerScript, 'utf-8') } - makeSW('OneSignalSDKWorker.js', [].concat(options.importScripts || []).concat(options.OneSignalSDK)) - makeSW('OneSignalSDKUpdaterWorker.js', [options.OneSignalSDK]) + writeWorker(workerFile, options.OneSignalSDK) + writeWorker(updaterFile, options.OneSignalSDK) + + options.workerPath = path.join(workerDir, workerFile) + options.updaterPath = path.join(workerDir, updaterFile) // Add OneSignal plugin - this.addPlugin({ + context.addPlugin({ src: path.resolve(__dirname, '../templates/plugin.js'), ssr: false, fileName: 'onesignal.js', diff --git a/templates/plugin.js b/templates/plugin.js index ea1fbbd..86f14e1 100755 --- a/templates/plugin.js +++ b/templates/plugin.js @@ -1,6 +1,11 @@ window.$OneSignal = window.OneSignal = window.OneSignal || []; -OneSignal.push(['init', <%= JSON.stringify(options.init, null, 2) %>]) +OneSignal.push(() => { + OneSignal.SERVICE_WORKER_PARAM = <%= JSON.stringify(options.swParams) %> + OneSignal.SERVICE_WORKER_PATH = <%= JSON.stringify(options.workerPath) %> + OneSignal.SERVICE_WORKER_UPDATER_PATH = <%= JSON.stringify(options.updaterPath) %> + OneSignal.init(<%= JSON.stringify(options.init, null, 2) %>) +}) export default function (ctx, inject) { inject('OneSignal', OneSignal) diff --git a/test/module.test.js b/test/module.test.js index 66d5d2e..4338004 100644 --- a/test/module.test.js +++ b/test/module.test.js @@ -4,6 +4,9 @@ import { setup, build } from '@nuxtjs/module-test-utils' import onesignalModule from '..' const url = path => `http://localhost:3000${path}` +const testPath = '/__pu__/os/' +const testWorkerFile = 'osw.js' +const testUpdaterFile = 'osu.js' describe('module', () => { let nuxt, browser @@ -18,7 +21,10 @@ describe('module', () => { oneSignal: { init: { appId: 'd867ac26-f7be-4c62-9fdd-b756a33c4a8f' - } + }, + filesPath: testPath, + workerFile: testWorkerFile, + updaterFile: testUpdaterFile } } @@ -40,4 +46,10 @@ describe('module', () => { expect($OneSignal).toBeDefined() expect($OneSignal.length).toBe(1) }) + + test('worker\'s path is correctly set in OneSignal', async () => { + const page = await browser.page(url('/')) + const workerPath = await page.runScript(() => window.OneSignal.config.userConfig.serviceWorkerPath) + expect(workerPath).toBe(path.join(testPath, testWorkerFile)) + }) })