This tutorial will explain how you can set up a combination of GET and POST webservice blocks to send a push message to a selected category from within your app.
Prerequisites:
- An active Pro app. Your app needs to be live and published to be able to send/receive push messages.
- Push message categories need to be set up prior to starting this tutorial. If you have no categories set up, the GET webservice will not return anything.
Creating the GET webservice
We'll start with setting up a GET webservice that will retrieve the push message categories.
- Add a webservice block and pick the "Custom webservice" option.
- Enter the following URL as webservice URL: https://api.appmachine.com/v1/pushnotification/categories - and leave the type of webservice set to "GET":
- As Authorization provider you will have to select the AppMachine API from the list of predefined providers.
- Click GO and verify that the correct checkbox is marked in the mapping screen:
- Hit Next, name your webservice, hit Next again and name your block. Click Finish.
- By default the "Name" will be shown in the Layout editor, you can leave this as is.
- Next, select and deactivate the "Info" block by clicking the "ON" switch on the top right of the CMS. Your "Info" block will be disabled:
You can remove the block if you want, as we won't be using it. - As a last step you can add your own preferred styling to the GET webservice block, or perhaps add a label in the Header tab with some explanation for the app users.
- My end result looks like this:
Creating the POST webservice
The second part of this tutorial will show you an example of a POST webservice setup you could use.
- Start by adding another Webservice block and select "Custom webservice" once again.
- Change the webservice type to "POST" and enter the following URL: https://api.appmachine.com/v1/pushnotification
- Select the AppMachine API provider from the list of Authorization providers.
- Select the "Body" tab in the input parameters table:
- The following input parameters are available in the push message API:
{
But.. For this tutorial I will only be using the these parameters:
"message": "string",
"deliveryDateTime": "2019-03-14T11:15:56.875Z",
"isEnabledIOS": true,
"isEnabledAndroid": true,
"isEnabledWindowsPhone": true,
"categoryId": "string",
"badge": 0,
"userId": "string",
"userIds": [
"string"
],
"deviceToken": "string",
"deviceTokens": [
"string"
]
}{
You can enter these parameters and values in the fields below the "Body" tab. The image in the next step shows what it should look like once you're done.
"message": "",
"isEnabledIOS": true,
"isEnabledAndroid": true,
"isEnabledWindowsPhone": false,
"categoryId": "",
"badge": 1,
} - After entering these parameters your setup should look like this:
- Click the Next button, name your webservice, click Next again and name your block. Click Finish. Make sure the block is nested below your GET webservice block:
- Select and remove the following textfields from the layout editor:
- IsEnabledIOS
- IsEnabledAndroid
- IsEnabledWindowsPhone
- Badge
- Select the CategoryId field and enter the following value in the text field: {data:id1}
This value is a reference to the returned data from your GET webservice and will give you the CategoryId for the category you've selected. Please note: Your users should not empty this field. More on this later, in the "Bonus" features section. - Next we're going to edit the "Execute" button by changing the caption and altering the Logic behavior. First, click the "Execute" button and rename it:
DO NOT CHANGE THE "Name" FIELD, as this is directly linked to the Logic functionality of your button. - Then, click the Logic tab and select the btnExecute.Click action:
- Edit the Succes and Error messages. Leave the rest default:
You can add whatever Success/Error message you'd like. - The only thing left for the setup of your POST webservice block is changing the styling of your labels and perhaps adding some info/instructions for the user. My end result looks like this:
I'm displaying both the layout editor and the result in the simulator to show how I've hidden the CategoryId field, to prevent users from editing it. To set this up, follow the steps listed in the "Bonus" features section.
Using your push webservice and the downsides
Now that you've finished building the blocks, it's time to take them for a spin. Update your app and wait for the content update to arrive. You're ready to send your first push message to a category!
There are a couple of downsides to using this setup opposed to setting up the messages in the AppMachine CMS:
- You cannot select a block that will be opened upon receiving the message.
- You cannot limit the amount of characters the user will fill in. Our push messages are limited to 140 characters. The user will have to make sure they do not exceed this.
- There is no ideal way to schedule the push messages. Adding a date/time picker is possible, but it does not work well due to timezones.
"Bonus" features and tips
- Use a <framelayout> to hide the CategoryId field. This prevents users from editing it:
Add <framelayout> and </framelayout> around the CategoryId field and Send button in the source of your layout. This will stack them. Make sure you also empty the "label" parameter of the control as can be seen in the image above (label="") - You can use Emojis. :-)
- Place the blocks you've just created behind a Lock block. Set the Lock type to whatever form of authentication you want. Personally I recommend setting it to "Authorization level" and grant the users who need to access this setup a higher Authorization level than regular "Registered" users. This does require User Registration to be enabled of course.
This concludes the tutorial. Any questions or suggestions can be sent to support@appmachine.com.
Comments
0 comments
Please sign in to leave a comment.