Chat Api Client

Thông qua đối tượng PSChatApiClient, chúng ta có thể làm việc với các Chat API.

export type PSChatApiClientOptions = {
  appId: string;
  fetchToken: () => Promise<string>;
};

Tên	Mô tả	Bắt buộc
appId	Tham số AppId	✓
fetchToken	Tham số gọi lại để lấy PiScale Token. Đây là 1 function sẽ được gọi khi chưa có token hoặc mỗi khi token hết hạn	✓

Bạn cần định nghĩa cách lấy PiScale Token trong hàm fetchToken. Luồng làm việc thông thường sẽ như sau:

Luồng lấy token

1. Khi chưa có PiScale Token hoặc mỗi khi PiScale Token hết hạn, PiScale Chat SDK sẽ chủ động gọi đến hàm fetchToken để nhận được token mới.
2. Hàm fetchToken sẽ thực hiện gọi đến api BE của bạn để yêu cầu PiScale Token mới.
3. Api BE của bạn sẽ thực hiện gọi đến Api Token của PiScale để lấy PiScale Token, sau đó trả về cho SDK.
4. Hàm fetchToken nhận được PiScale Token trả về cho PiScale Chat SDK, từ đây PiScale Chat SDK có thể thực hiện các hành động khác.

Ví dụ

Dưới đây là ví dụ việc triển khai hàm fetchToken ở client.

RN CLI

import {PSChat, PSChatProps, useIsMountedRef} from '@communi/chat-react-native';

Expo

import {PSChat, PSChatProps, useIsMountedRef} from '@piscale/chat-expo';

import React from 'react';
import axios from 'axios';

export const axiosInstance = axios.create({
  baseURL: 'YOUR_BASE_URL',
  headers: {
    'Content-Type': 'application/json',
  },
  timeout: 10000,
  withCredentials: false,
});

export const App = () => {
  const isMounted = useIsMountedRef();

  const fetchToken = React.useCallback(async (): Promise<string> => {
    try {
      const response = await axiosInstance.post<any, any>(
        'YOUR_FETCH_TOKEN_ENDPOINT',
      );
      const token = response.data.data.token as string;
      if (!token || !token.length) {
        throw new Error('Invalid Token');
      }
      return token;
    } catch (e) {
      console.log('fetchToken: ', e);
      // demo retry
      await new Promise(resolve => {
        setTimeout(() => {
          resolve('');
        }, 1000);
      });
      if (isMounted.current) {
        return await fetchToken();
      }
      return '';
    }
  }, []);

  const chatProps = React.useMemo(() => {
    ...
    return {
      chatApiClientOptions: {
        appId: 'YOUR_APP_ID',
        fetchToken: fetchToken,
      },
      ...
    } as PSChatProps;
  }, [fetchToken]);

  return (
    <PSChat props={chatProps}>{/** App components */}</PSChat>
  );
}