Hey followers! Who is ready for another edition of #APIFriday?! I’m going to keep this one short and sweet. Today, we’re going to create a button you can add to your application to send a text message. Using Twilio, you can easily add the ability to send a SMS, MMS, voice calls, and 2 factor authentication.

To get started, you will need to sign up for a Twilio account and get a phone number. The trial version of the account is enough for this demo. Take a minute to read over the Twilio REST API documentation for sending and receiving messages as that is what we will be basing the AJAX call off of. I used the Curl code as a basis for my AJAX call construction. We will use a destination so the Authentication is handled for us and the –data flags will be part of the JSON data body of the AJAX call. We won’t be sending a picture, so you can ignore the media. We’ll be accessing the Messages endpoint.

Once you get your free API key, make sure to get a phone number. Click on the Programmable SMS icon (text message bubbles) and selected Getting Started. You will be able to generate a phone to use as your Twilio number for sending and receiving messages.

Make a note of your Account SID and Auth Token. This will be used in your authentication process. Twilio uses Basic Authentication (yay!) where the Account SID is your username and the Auth Toke is the password. You will need these for you SAP Cloud Platform destination.

Let’s move over to your SAP Cloud Platform instance! Go to your Destinations and select New Destination.

Go ahead and Save your destination. When the option appears, select Check Connection. You should get a green check saying the connection is successful. Awesome! Now we are ready to add it to our app! Open your Web IDE, or if you already have it open, refresh your Web IDE. Don’t forget that whenever you create a new destination or modify a old destination, you MUST refresh your Web IDE so the changes are available. If you don’t refresh, you will be grabbing the outdated destination information.

We’ll be creating a button so you can either add it to an existing app or create a new app. Choice is yours! I started with a fresh SAPUI5 App template project because I didn’t link the layouts of my existing apps to add a button too. However you do it, just make sure you have a view and a controller ready to go. First things first, adding the route to our manifest.json file. Since we configured the URL and Auth as a CP destination, we need to tell Web IDE that we are using the Twilio destination and where to find it. Add the Twilio destination to your routes array and save your changes. If you are a little rusty with using an API in your app via destinations, check out this tutorial as a refresher.

In your View file, let’s go ahead and add the button control. In your tags, add a . Don’t forget to define your button text and a press function which we’ll create in the controller next.

As always, SAVE your changes before switching over to the controller. If you want to run your app to make sure the button is showing up, go ahead! Then meet me in your controller.

In the corresponding Controller (for the view we just updated), create your new press function. In your AJAX call, we will specify the type as POST, since we need to include data, and the data array will contain the TO phone number (in this case, I used my personal number), the FROM phone number (your Twilio number), and the body or what you want the SMS to say. You will need your account SID to construct the URL. We are using the Messages.json endpoint to send a SMS message.

I defined myPhoneNumber and myTwilioNumber as global variables. Don’t forget to include the "+1" before your number. The country code IS necessary. Save your controller and run your application. You will see a new "Text me!" button in your UI. NOTE: If implemented correctly, this WILL actually SEND a SMS message to the specified TO number. Messaging rates may apply for the receipt so be thoughtful in your messaging choice. Open your Developer Console (by using F12 for PC or CMD+OPT+i for Mac in Chrome). When you click the button, you should see the response from Twilio. If it is successful, you will receive a SMS message on the TO phone number.

Add that’s how simple it is to send a text message from a SAPUI5 app! You can add an input field for the TO phone number and message or you could automate SMS alerts and use data from the triggering event for the message. You’ve got the basics and now the world is your oyster!

Thanks for joining me again this week for #APIFriday!

Next Friday, we’ll take a look at using an external library SDK called JustGages to spiffy up your application, I am using it for my current kegerator project, which we’ll be wrapping up phase 1 at the end of next week, so I can take you through my adventure in making a flashy app. Also on tap is a friend’s playlist app for Spotify requested by my teammate Lucia. As I am not a Spotify user (GASP!), I wanted to take the time to get to know the tool before I start building with it. Sorry for the delay Lucia, but I promise it’s coming!

，返利啦，淘客app源码，大淘客网站，淘客社区，云主机云服务器