|
| 1 | +# OneSignal Module |
| 2 | + |
| 3 | +[![npm version][npm-version-src]][npm-version-href] |
| 4 | +[![npm downloads][npm-downloads-src]][npm-downloads-href] |
| 5 | +[![Github Actions CI][github-actions-ci-src]][github-actions-ci-href] |
| 6 | +[![Codecov][codecov-src]][codecov-href] |
| 7 | +[![License][license-src]][license-href] |
| 8 | + |
| 9 | +OneSignal is a Free, high volume and reliable push notification service for websites and mobile applications. Setting and using this module is a little tricky as OneSignal requires to register its own Service worker. |
| 10 | + |
| 11 | +## Setup |
| 12 | + |
| 13 | +1. Follow steps to insall [pwa module](https://pwa.nuxtjs.org) |
| 14 | + |
| 15 | +2. Add `@nuxtjs/onesignal` dependency to your project |
| 16 | + |
| 17 | +```bash |
| 18 | +yarn add @nuxtjs/onesignal # or npm install @nuxtjs/onesignal |
| 19 | +``` |
| 20 | + |
| 21 | +2. Add `@nuxtjs/onesignal` **BEFORE** `@nuxtjs/pwa` to the `modules` section of `nuxt.config`: |
| 22 | + |
| 23 | +```js |
| 24 | +modules: [ |
| 25 | + '@nuxtjs/onesignal', |
| 26 | + '@nuxtjs/pwa' |
| 27 | +] |
| 28 | +``` |
| 29 | + |
| 30 | +3. Add `oneSignal` options to `nuxt.config`: |
| 31 | + |
| 32 | +```js |
| 33 | +// Options |
| 34 | +oneSignal: { |
| 35 | + init: { |
| 36 | + appId: 'YOUR_APP_ID', |
| 37 | + allowLocalhostAsSecureOrigin: true, |
| 38 | + welcomeNotification: { |
| 39 | + disable: true |
| 40 | + } |
| 41 | + } |
| 42 | +} |
| 43 | +``` |
| 44 | + |
| 45 | +See references below for all `init` options. |
| 46 | + |
| 47 | +4. Add `OneSignalSDK*` to `.gitignore` |
| 48 | + |
| 49 | +## Async Functions |
| 50 | +This module exposes oneSignal as `$OneSignal` everywhere. So you can call it. |
| 51 | +Please note that because of async loading of OneSignal SDK script, every action should be pushed into `$OneSignal` stack. |
| 52 | + |
| 53 | +```js |
| 54 | +// Inside page components |
| 55 | +this.$OneSignal.push(() => { |
| 56 | + this.$OneSignal.isPushNotificationsEnabled((isEnabled) => { |
| 57 | + if (isEnabled) { |
| 58 | + console.log('Push notifications are enabled!') |
| 59 | + } else { |
| 60 | + console.log('Push notifications are not enabled yet.') |
| 61 | + } |
| 62 | + }) |
| 63 | +}) |
| 64 | + |
| 65 | +// Using window and array form |
| 66 | +window.$OneSignal.push(['addListenerForNotificationOpened', (data) => { |
| 67 | + console.log('Received NotificationOpened:', data )} |
| 68 | +]); |
| 69 | +``` |
| 70 | + |
| 71 | +## Change OneSignal SDK Script URL |
| 72 | + |
| 73 | +By default this modules ships with latest SDK dist. |
| 74 | + |
| 75 | +You can use recommended CDN by using `cdn: true` or changing it to a custom value using `OneSignalSDK`. |
| 76 | + |
| 77 | +```js |
| 78 | +oneSignal: { |
| 79 | + // Use CDN |
| 80 | + cdn: true, |
| 81 | + |
| 82 | + // Use any custom URL |
| 83 | + OneSignalSDK: 'https://cdn.onesignal.com/sdks/OneSignalSDK.js' |
| 84 | +} |
| 85 | +``` |
| 86 | + |
| 87 | +## References |
| 88 | + |
| 89 | +- [Web Push SDK Reference](https://documentation.onesignal.com/docs/web-push-sdk) - Available options and API calls |
| 90 | +- [Customize Permission Messages](https://documentation.onesignal.com/docs/customize-permission-messages) |
| 91 | +- [Thanks for Subscribing Notifications](https://documentation.onesignal.com/docs/welcome-notifications) |
| 92 | +- [Product overview](https://documentation.onesignal.com/docs/product-overview) - More info about OneSignal |
| 93 | +- [Web Push SDK Setup](https://documentation.onesignal.com/docs/web-push-sdk-setup-https) - Setup guides for in-depth reading what this modules does. |
| 94 | + |
| 95 | +## License |
| 96 | + |
| 97 | +[MIT License](./LICENSE) |
| 98 | + |
| 99 | +<!-- Badges --> |
| 100 | +[npm-version-src]: https://img.shields.io/npm/v/@nuxtjs/onesignal/latest.svg |
| 101 | +[npm-version-href]: https://npmjs.com/package/@nuxtjs/onesignal |
| 102 | + |
| 103 | +[npm-downloads-src]: https://img.shields.io/npm/dt/@nuxtjs/onesignal.svg |
| 104 | +[npm-downloads-href]: https://npmjs.com/package/@nuxtjs/onesignal |
| 105 | + |
| 106 | +[github-actions-ci-src]: https://github.com/nuxt-community/onesignal-module/workflows/ci/badge.svg |
| 107 | +[github-actions-ci-href]: https://github.com/nuxt-community/onesignal-module/actions?query=workflow%3Aci |
| 108 | + |
| 109 | +[codecov-src]: https://img.shields.io/codecov/c/github/nuxt-community/onesignal-module.svg |
| 110 | +[codecov-href]: https://codecov.io/gh/nuxt-community/onesignal-module |
| 111 | + |
| 112 | +[license-src]: https://img.shields.io/npm/l/@nuxtjs/onesignal.svg |
| 113 | +[license-href]: https://npmjs.com/package/@nuxtjs/onesignal |
0 commit comments