Clone project git clone https://github.com/Pushwoosh/web-push-notifications-sample.git
Open src/manifest.json and make the following changes:
- Change
nameandshort_nameto the name of your website. - Change
gcm_sender_idto your Google Project Number. Please keep in mind that Google Project Number is usually a 12-digit number, and it can't contain any letters.
Open src/index.html and make the following changes:
- Change
applicationCodeto your Pushwoosh Application Code. - Change
safariWebsitePushIDto your Safari Website Push ID.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Pushwoosh Web SDK Sample</title>
<link rel="manifest" href="/manifest.json">
<script src="https://cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>
<script>
var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(["init", {
logLevel: 'error', // possible values: error, info, debug
applicationCode: 'XXXXX-XXXXX',
safariWebsitePushID: 'web.com.example.domain',
defaultNotificationTitle: 'Pushwoosh',
defaultNotificationImage: 'https://cp.pushwoosh.com/img/logo-medium.png',
autoSubscribe: true,
userId: 'user_id',
tags: {
'Name': 'John Smith'
}
}]);
</script>
</head>
<body>
<h1>Pushwoosh Web SDK usage sample</h1>
</body>
</html>Requires installed Node.js
- Open in terminal directory with cloned project
cd web-push-notifications-sample/ - Install dependencies
npm install - Run http-server
npm start - Open
http://localhost:3003in your browser
Open src/debug/index.html and make the following changes:
- Change
applicationCodeto your Pushwoosh Application Code. - Change
safariWebsitePushIDto your Safari Website Push ID.
Open http://localhost:3003/debug/ in your browser.
Your server must have secure origins.
Copy all these files from src/ folder to top-level root of your website directory:
manifest.jsonpushwoosh-service-worker.jsindex.html*
* If you already have some html rendering system, insert this code inside <head></head> tag:
<link rel="manifest" href="/manifest.json">
<script src="https://cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>
<script>
var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(["init", {
logLevel: 'error', // possible values: error, info, debug
applicationCode: 'XXXXX-XXXXX',
safariWebsitePushID: 'web.com.example.domain',
defaultNotificationTitle: 'Pushwoosh',
defaultNotificationImage: 'https://cp.pushwoosh.com/img/logo-medium.png',
autoSubscribe: true,
userId: 'user_id',
tags: {
'Name': 'John Smith'
}
}]);
</script>