Making API Endpoint Calls to Send Push Notifications

Ionic Framework ionic-v3
1

I want to manually make an api call to the API endpoint for push notifications, http://api.ionic.io/push/notifications.

So far I have this POST request setup but I am unsure of how to pass the data in a JSON string.

  send_note(){

var headers = new Headers();
headers.append('Content-Type', 'application/json');

this.http.post("https://api.ionic.io/push/notifications",
    JSON.stringify({
      //data goes here
    }), {headers: headers})
    .map(res => res.text())
    .subscribe(data => console.log(data)
        , err => console.log("server_error"));
 }

I think I need to pass variables for the following:

{
“tokens”: [“DEVICE_TOKEN”],
“profile”: “PROFILE_TAG”,
“notification”: {
“message”: “Hello World!”
}
}

However how do I get my device token and how do I specify the message property under notification? Can someone give me an api call code example? Thank you!

2

Do you managed to solve this? I’m stuck on this matter too

3

The device token needed for the API can be retrieved by going to https://apps.ionic.io then selecting your project, going to SETTINGS, clicking “API Keys”, then “+New Token”

To create a profile go to SETTINGS again and click “Certificates” then “+New Security Profile”

Here’s a working example using XHR, this will send to all devices:

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script type="text/javascript">


	function sendNotification() {

		var title = document.getElementById("title").value;
		var body = document.getElementById("body").value;

		var data = JSON.stringify({
		  "profile": "[INSERT THE NAME OF THE PROFILE YOU SETUP]",
		  "send_to_all": true,
		  "notification": {
		    "title": title,
		    "message": body
		  }
		});

		var xhr = new XMLHttpRequest();
		xhr.withCredentials = true;

		xhr.addEventListener("readystatechange", function () {
		  if (this.readyState === 4) {
		    console.log(this.responseText);
		  }
		});

		xhr.open("POST", "https://api.ionic.io/push/notifications");
		xhr.setRequestHeader("content-type", "application/json");
		xhr.setRequestHeader("authorization", "Bearer [INSERT YOUR API TOKEN HERE]");
		xhr.setRequestHeader("cache-control", "no-cache");

		xhr.send(data);

	}

	</script>

	<style type="text/css">
		.container {
			display: flex;
			flex-direction: column;
			width: 300px;
		}

		.container > div {
			margin-bottom: 30px;
		}

		textarea {
			width: 400px;
			height: 100px;
		}
	</style>
</head>
<body>

<div class="container">
	<div><input type="text" id="title" placeholder="Title"></div>
	<div><textarea id="body" placeholder="Notification Message"></textarea></div>
	<div><button onclick="sendNotification()">Send Notification</button></div>
</div>

</body>
</html>