OneSignal supports assigning users to data tags which can then be used for subscription management, to subscribe or unsubscribe users to different categories of notifications.

Data tags are name-value pairs of strings. More info on OneSignal tags at
https://documentation.onesignal.com/docs/data-tags

Setting Data Tags within OneSignal

You may set data tags for users within OneSignal directly on the OneSignal dashboard and via the OneSignal API. https://documentation.onesignal.com/docs/how-to-add-and-edit-data-tags

Setting Data Tags On-Device

Data tags can be set by users themselves on-device. You may expose a native UI available within your app wherein users can toggle some or all of the available tags on/off to self-manage their subscriptions. And/or you may develop your own UI and set data tags for specific users programmatically using JavaScript.

Method 1 - Native UI

Host a JSON file that specifies your tags in the format per the example provided below. Add the URL for this file on the Push Notifications > OneSignal tab as Data Tags Native UI JSON URL.

https://median.dev/onesignal/tags.json

{
  "sections": [{
    "name": "News",
    "items": [{
      "name": "National",
      "identifier": "national"
    }, {
      "name": "New York City",
      "identifier": "nyc"
    }, {
      "name": "US Politics",
      "identifier": "us_politics"
    }, {
      "name": "International",
      "identifier": "international"
    }]
  }, {
    "name": "Sports",
    "items": [{
      "name": "NFL Football",
      "identifier": "nfl"
    }, {
      "name": "NBA Basketball",
      "identifier": "nba"
    }, {
      "name": "MLB Baseball",
      "identifier": "mlb"
    }]
  }, {
    "name": "Lifestyle",
    "items": [{
      "name": "Fashion",
      "identifier": "fashion"
    }, {
      "name": "Dining",
      "identifier": "dining"
    }, {
      "name": "Live Entertainment",
      "identifier": "entertainment"
    }]
  }, {
    "name": "Journalists",
    "items": [{
      "name": "Mary Poppins",
      "identifier": "mpoppins"
    }, {
      "name": "Snow White",
      "identifier": "swhite"
    }, {
      "name": "Captain Hook",
      "identifier": "chook"
    }]
  }]
}

↔️Median JavaScript Bridge

Run the following command to display the native UI within your app:

JavascriptHTML

median.onesignal.showTagsUI();

<button onclick="median.onesignal.showTagsUI()">Edit Notification Subscriptions</button>

Subscription Management Native UI

Native UI Demo App

Method #2 - Web UI and JavaScript

Build a UI in your web environment to provide toggle options for subscription management through Data Tags. This web UI can be a listing of all subscriptions similar to the native UI or can be within context of specific related information.

↔️Median JavaScript Bridge

Run the following commands to set, get and delete tags via JavaScript

Set TagsGet TagsDelete TagsDelete All Tags

/* Tags Object with values to set */
var onesignalTags = {
  tags: {
    tag1: 'value1',
    tag2: 'value2'
  },
  callback: tagSetCallbackFunction //optional for callback method only
};


/* Promise-based method */
median.onesignal.tags.setTags(onesignalTags).then(function (tagResult){
  console.log(tagResult);
});


/* Callback method */
function tagSetCallbackFunction(tagResult){
	console.log(tagResult);
}
median.onesignal.tags.setTags(onesignalTags);


/* tagResult contains the below */
{
  success: true
}

/* Promise-based method */
median.onesignal.tags.getTags().then(function(tagResult){
  console.log(tagResult);
});


/* Callback method */
function tagGetCallbackFunction(tagResult){
	console.log(tagResult);
}
median.onesignal.tags.getTags({callback:tagGetCallbackFunction});


/* tagResult contains the below */
{
  success: true,
    tags: {
      tag1: "value1",
        tag2: "value2"
    }
}

/* Promise-based method */
median.onesignal.tags.deleteTags('tags':['tag1','tag2']).then(function (tagResult){
  console.log(tagResult);
});


/* Callback method */
function tagGetCallbackFunction(tagResult){
	console.log(tagResult);
}
median.onesignal.tags.deleteTags({
  'tags':['tag1','tag2'],
  callback:tagGetCallbackFunction
});


/* tagResult contains the below */
{
  success: true
}

/* Promise-based method */
median.onesignal.tags.deleteTags().then(function (tagResult){
  console.log(tagResult);
});


/* Callback method */
function tagGetCallbackFunction(tagResult){
	console.log(tagResult);
}
median.onesignal.tags.deleteTags({callback:tagGetCallbackFunction});


/* tagResult contains the below */
{
  success: true
}

Example Web UI

Web UI Subscription Management

Web UI Subscribe In-Context