OneSignal subscribe user through web page using web-push-sdk
13,614
Solution 1
Here is solution, It may help someone else.
<script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async></script>
<script>
var useragentid = null;
var OneSignal = window.OneSignal || [];
OneSignal.push(["init", {
appId: "345345-asdf-345",
autoRegister: false,
notifyButton: {
enable: false
},
persistNotification: false
}]);
//Firstly this will check user id
OneSignal.push(function() {
OneSignal.getUserId().then(function(userId) {
if(userId == null){
document.getElementById('unsubscribe').style.display = 'none';
}
else{
useragentid = userId;
document.getElementById('unsubscribe').style.display = '';
OneSignal.push(["getNotificationPermission", function(permission){
}]);
OneSignal.isPushNotificationsEnabled(function(isEnabled) {
if (isEnabled){
document.getElementById('unsubscribe').style.display = '';
document.getElementById('subscribe').style.display = 'none';
}
else{
document.getElementById('unsubscribe').style.display = 'none';
document.getElementById('subscribe').style.display = '';
}
});
}
});
});
//Secondly this will check when subscription changed
OneSignal.push(function() {
OneSignal.on('subscriptionChange', function (isSubscribed) {
if(isSubscribed==true){
OneSignal.getUserId().then(function(userId) {
useragentid = userId;
}).then(function(){
// this is custom function
// here you can send post request to php file as well.
OneSignalUserSubscription(useragentid);
});
document.getElementById('unsubscribe').style.display = '';
document.getElementById('subscribe').style.display = 'none';
}
else if(isSubscribed==false){
OneSignal.getUserId().then(function(userId) {
useragentid = userId;
});
document.getElementById('unsubscribe').style.display = 'none';
document.getElementById('subscribe').style.display = '';
}
else{
console.log('Unable to process the request');
}
});
});
function subscribeOneSignal(){
if(useragentid !=null){
OneSignal.setSubscription(true);
}
else{
OneSignal.registerForPushNotifications({
modalPrompt: true
});
}
}
function unSubscribeOneSignal(){
OneSignal.setSubscription(false);
}
</script>
<div id="home-top" class="clearfix">
<p>OneSingle Testing</p>
<br>
<button id="subscribe" class="button" onclick="subscribeOneSignal()">Subscribe </button>
<button id="unsubscribe" class="button" onclick="unSubscribeOneSignal()">Unsubscribe </button>
</div>
<style>
.button {
background-color: #008CBA;border: none;color: white;padding: 15px 32px;text-align: center;text-decoration: none;display: inline-block;font-size: 16px;cursor: pointer;
}
</style>
Solution 2
Nice, but I have used it, but it want users to be registered after they login to my site with their emailadress as tag:
<?php
if ($_SESSION['sesId']!='')
{
$sr = mysqli_query($DBD->conn(),"SELECT * from members where id = '".$_SESSION['sesId']."'");
if ($rr = mysqli_fetch_array($sr))
{
if ($rr['pushtag']==1 && $rr['alreadysendpush'] ==0 )
{
?>
var OneSignal = window.OneSignal || [];
OneSignal.push(["init", {
appId: "1c398831-ce91-4a8e-90d8-56cc40b8fa97",
autoRegister:false,
showCredit:false,
disable:false, // betekend geen stanaard bericht als je geaceepteerd hebt notificaties te willen ontvangen
notifyButton: {
enable: true /* Set to false to hide */
},
safari_web_id: 'web.onesignal.auto.379e9ba9-232a-4433-a939-20e3e6310530'
}]
);
OneSignal.push(function() {
/* These examples are all valid */
var isPushSupported = OneSignal.isPushNotificationsSupported();
if (isPushSupported)
{
// Push notifications are supported
OneSignal.isPushNotificationsEnabled().then(function(isEnabled)
{
if (isEnabled)
{
console.log("Push notifications are enabled!");
OneSignal.sendTag("email", "<?=$rr['email']?>", function(tagsSent)
{
// Callback called when tags have finished sending
$.ajax({
type: "POST",
url: "<?=HTML_ROOT?>inc/webpush.php",
data: {
"email": "<?=$rr['email']?>",
"register": "1",
"verification":"<?=$rr['verificatie']?>"
},
dataType: "html"
}).done(function(e) {
});
})
}
else {
console.log("Push notifications are not enabled yet.");
}
});
} else {
// Push notifications are not supported
}
});
<?php
} else {
}
}
}
?>
THis works sometimes with tags and sometimes without tags. How to make it work that i will only register with email
Comments
-
Muhammad Shahzad over 1 year
Is there a way in one signal web-push-sdk to add user manually and unsubscribe?
I tried this in my
subscribeOneSignal()function but nothing happening.OneSignal.push(function() { OneSignal.registerForPushNotifications(); });I have simple html page where I have two buttons one "Subscribe" and other is "Unsubscribe", now when user click on Subscribe button he should add at one signal and when he clicked on "Unsubscribe" button he shouldn't receive the notifications.
<!DOCTYPE html> <html> <head> <link rel="manifest" href="/manifest.json"> <script src="https://cdn.onesignal.com/sdks/OneSignalSDK.js" async></script> <script> var OneSignal = window.OneSignal || []; OneSignal.push(["init", { appId: "345345-asdf-345", autoRegister: false, notifyButton: { enable: true } }]); function subscribeOneSignal(){ OneSignal.push(function() { OneSignal.registerForPushNotifications(); }); OneSignal.push(function() { OneSignal.registerForPushNotifications({ modalPrompt: true }); }); } function unSubscribeOneSignal(){ //unsubscribe functionality goes here } </script> </head> <body> <p>OneSingle Testing</p> <br> <button onclick="subscribeOneSignal()">Subscribe </button> <button onclick="unSubscribeOneSignal()">Unsubscribe </button> </body> </html>