Preface – This post is part of the UI5 Integration Programs series.
Table of Contents
Introduction
WhatsApp is a messaging app that allows users to communicate with each other through text-based chat, voice and video calls, and other multimedia features. The chat function on WhatsApp is one of its main features and is used by users to have conversations with their contacts.
To start a chat on WhatsApp, you first need to have the app installed on your device and have an active account. Once you have the app open, you can navigate to the chat tab, where you will see a list of all your existing chats.
To start a new chat, you can tap the “New Chat” button and then select the contact you want to chat with. You can also create a group chat with multiple contacts by selecting the “New Group” option.
Once you are in a chat, you can type your message in the text box at the bottom of the screen and press the send button to send it. You can also use other features such as emojis, stickers, and GIFs to enhance your messages. If you want to make a voice or video call, you can use the call button at the top of the screen.
WhatsApp also offers end-to-end encryption, which means that your messages are secure and can only be seen by you and the recipient. You can also customize your chat settings, such as notifications and chat backgrounds, to make your chatting experience more personalized.
Overall, the chat function on WhatsApp is a simple and easy-to-use feature that allows users to communicate with their contacts in a fast and secure way.
What is Chat on WhatsApp API
WhatsApp API is a platform provided by WhatsApp that allows businesses to interact with their customers through the messaging app. The Chat function on WhatsApp API allows businesses to create and manage conversations with their customers using a programmable interface.
With WhatsApp API, businesses can use their own applications to send and receive messages, media, and other types of content with their customers. This can include sending order confirmations, shipping notifications, and customer support messages. The chat function on WhatsApp API also allows businesses to automate certain parts of the conversation using chatbots, which can provide customers with quick answers to frequently asked questions.
To use the Chat function on WhatsApp API, businesses need to have an approved WhatsApp Business Account and an integration with the WhatsApp Business API. Once these requirements are met, businesses can access the Chat API documentation and start building their chatbots and other messaging features.
The Chat function on WhatsApp API is a powerful tool for businesses that want to reach their customers where they are, in a fast and convenient way. It can help businesses provide better customer support, increase engagement, and streamline their communication processes.
How to use click to chat for WhatsApp
Click to Chat is a feature on WhatsApp that allows you to create a link that, when clicked, opens a new chat with a specific phone number or contact. This can be useful if you want to make it easy for people to start a conversation with you on WhatsApp, without having to add your phone number to their contacts.
To use Click to Chat for WhatsApp, follow these steps:
- Open your web browser and go to https://wa.me/ followed by the phone number you want to chat with in international format, without any spaces or symbols. For example, if the phone number is +1 (555) 123-4567, the link should be https://wa.me/15551234567.
- Hit the “Enter” key or click “Go” to load the link.
- If the phone number is associated with an active WhatsApp account, a new chat window will open with the phone number already entered.
- If the phone number is not associated with an active WhatsApp account, an error message will appear.
You can also add a message to the link by adding ?text= followed by the message you want to send. For example, if you want to send a message that says “Hello, how can I help you?”, the link should be https://wa.me/15551234567?text=Hello,%20how%20can%20I%20help%20you%3F.
Note that Click to Chat links can be shared on social media, email, websites, or any other platform where links can be posted. However, it’s important to be cautious when sharing your phone number or WhatsApp account information online, and to only share it with people or organizations you trust.
How to Integrate Chat on WhatsApp button in SAP UI5
To integrate WhatsApp in SAP UI5, you need to use the “click to chat” option, we have implemented as below:
View.xml
<mvc:View controllerName="Test.Test.controller.Main" xmlns:mvc="sap.ui.core.mvc" displayBlock="true" xmlns="sap.m" xmlns:core="sap.ui.core"
xmlns:html="http://www.w3.org/1999/xhtml">
<Shell id="shell">
<App id="app">
<pages>
<Page id="page" title="Chat on WhatsApp button Integration in SAP UI5">
<content>
<Input id="idNumber" value="" placeholder="Enter a number with country code"/>
<Input id="idText" value="" placeholder="Enter a text to send"/>
<Image width="20%" src="./view/whatsapp.png" press="handleWhatsAppPress"/>
</content>
</Page>
</pages>
</App>
</Shell>
</mvc:View>
Controller.js
sap.ui.define([
"sap/ui/core/mvc/Controller",
"sap/m/MessageBox",
"sap/m/MessageToast"
], function (Controller, MessageBox, MessageToast) {
"use strict";
return Controller.extend("Test.Test.controller.Main", {
handleWhatsAppPress: function () {
var number = this.byId("idNumber").getValue();
var text = this.byId("idText").getValue();
// for Mobile Phone
// var url = 'https:' + '//wa.me/' + number + '?text=' + text;
// for Web Whatsapp
var url = 'https:' + '//web.whatsapp.com/send/?phone=' + number + '&text=' + text + '&type=phone_number&app_absent=0';
sap.m.URLHelper.redirect(url, true);
// eg. +917070022222
}
});
});
Note: Remember to add an image in your view (or other) folder, we have added the image with name ‘whatsapp.png’.
Output
0 Comments