Thử gửi tin nhắn trên ứng dụng LINE thông qua LIFF API

toan.nguyen

2021.02.23

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

I. Đặt vấn đề

Tiền đề

Ở phần trước chúng ta đã tích hợp tính năng Log in của LIFF (LINE Front-end Framework) vào ứng dụng có sẵn.

  • Chúng ta có 1 project react native sử dụng ngôn ngữ typescript
  • Chúng ta cần có 1 tài khoản LINE
  • Chúng ta có 1 project tích hợp tính năng Log in của LIFF

Mục tiêu

Tạo button với chức năng gửi tin nhắn với tư cách là user thông qua ứng dụng LIFF

II. Thực hiện

Bước 1:

Nếu bạn chưa thực hiện các bước như ở blog trước, hãy thực hiên theo các bước ở đây:

Tích hợp tính năng Login của LIFF (LINE Front-end Framework) vào ứng dụng Web

Bước 2:

Sau khi đã tích hợp tính năng Log in của LIFF (LINE Front-end Framework) thành công thì khi chạy project với npm start LINE sẽ yêu cầu Login trước khi vào ứng dụng.

Bước 3:

  • Tạo button với chức năng gửi tin nhắn

Thêm code tạo function gửi Text Message:

async function sendTextMessages() {
  try {
    await liff.sendMessages([
      {
        type: 'text',
        text: 'Hello, World!'
      }
    ])
    console.log('message sent');
  } catch(err) {
      console.log('error', err);
    }
};

Thêm code hiển thị button gọi tới function sendTextMessages:

function App() {
  return (
     <Text>Send Message</Text>
     </TouchableOpacity>
     <TouchableOpacity
       onPress={sendStickerMessages} 
     >
  );
};

Bước 4:

  • Cài đặt VConsole
npm install vconsole
  • Import VConsole vào file index.tsx của project:
import VConsole from 'vconsole';
// @ts-ignore: Unreachable code error
const vConsole = new VConsole ();

Sau khi cài đặt VConsole, khi khởi chạy dự án, chúng ta sẽ thấy màn hình hiển thị thêm button vConsole ở dưới góc phải màn hình. VConsole sẽ có chức năng tương tự Developer Tools trên Google Chrome. Chúng ta sẽ sử dụng VConsole để kiểm tra chức năng gửi tin nhắn thông qua LINE messaging API.

Sau khi chạy project, màn hình sẽ hiển thị như sau:

Bước 5:

Trước khi tiến hành kiểm tra chức năng, chúng ta cần chú ý như sau:

Trong tài liệu chính thức của LIFF API có viết:

liff.sendMessages()

Sends messages on behalf of the user to the chat screen where the LIFF app is opened. If the LIFF app is opened on a screen other than the chat screen, messages cannot be sent.

liff.sendMessages() can't be used with an external browser.

Như vậy việc gửi message trên danh nghĩa của user chỉ được thực hiện khi LIFF app được mở trong màn hình chat của LINE. Tức là chúng ta cần truy cập link LIFF app trong màn hình chat với 1 user khác.

Thực hiện ấn button Send Message và ấn vào button vConsole để kiểm tra xem message đã được gửi đi hay chưa.

Nếu message được gửi thành công thì trên vConsole sẽ hiển thị log như trên, đồng thời khi quay lại màn hình chat của LINE, chúng ta có thể thấy message đã được gửi đi thành công tương tự như sau

III. Kết luận

Vậy chúng ta đã hoàn thành các bước để sử dụng liff.sendMessage() API gửi message trên danh nghĩa user. Đây chỉ là 1 trong những loại message là chúng ta có thể gửi.

Còn nhiều loại message khác như:

  • Text message
  • Sticker message
  • Image message
  • Video message
  • Audio message
  • Location message
  • Imagemap message
  • Template message
  • Flex message

Mặc dù rất đa dạng, tuy nhiên ở phiên bản hiện tại, vẫn còn 1 số hạn chế như việc API chỉ sử dụng được trong màn hình chat của LINE phía trên.

Tham khảo thêm tại link sau: https://developers.line.biz/en/docs/messaging-api/sending-messages/

*