はじめに
自チームのプロダクトにてチャット機能のリプレースの検討を行うことになりました！
その移管先の一つとして、「Sendbird」 🕊️
狙いとしては、Sendbirdに関してのドキュメントが少ないので調査した結果ついでに貢献したい 🎉
前回に引き続き、Sendbirdのパッケージを使用して、
グループチャンネルに対してなんやかんややるシリーズ！(そんなシリーズない)
使用したパッケージ
フロント用
sendbird-chat-sdk-javascript v4.14.4
サーバー用
sendbird-platform-sdk-typescript v1.0.27
ファイルアップロード・送信機能
今回はファイルアップロード・送信機能を調査し、実装してみました〜
自分が調査した感じですと処理の流れとしては以下になります
- グループチャンネルに対して事前にファイルをアップロードします
- アップロードに成功したらURLがレスポンスとして返ってくるのでそれをメッセージ送信の引数としてリクエストを投げます
グループチャンネルに対してファイルをアップロード
まずは、グループチャンネルに対してファイルをアップロードする処理を紹介します
フロント用のパッケージを使用しての処理になります
sendbird-chat-sdk-javascript v4.14.4
ChatSDKの初期化
- まずは、Sendbird Chat SDKを初期化します
- 初期化にはSendbirdのApplication IDが必要なのですがそれはSendbirdダッシュボードから確認が可能です
import SendbirdChat from 'your_path_to_sdk/sendbird.js'
import { GroupChannelModule } from 'your_path_to_sdk/groupChannel.js'
const APP_ID = 'your_app_id'
sb = SendbirdChat.init({
appId: APP_ID,
modules: [
new GroupChannelModule()
]
})
ユーザーIDを元にSendbirdサーバーに接続
* ユーザーIDを引数にSendbirdサーバーと接続します
sb.connect(userId)
チャンネルURLを元にグループチャンネルを取得
- グループチャンネルにURLを引数としてグループチャンネルのインスタンスを取得します
- チャンネルURLはSendbirdダッシュボードのグループチャンネルから取得できます
const groupChannelUrl = 'group_channel_url'
sb.groupChannel.getChannel(url).then((data: GroupChannel) => {
groupChannel.value = data
// 何かしらの処理
}).catch((err) => {
// 何かしらの処理
})
グループチャンネルに対してファイルアップロード
- 取得したグループチャンネルに対してファイルをアップロードします
- レスポンスとして、
requestIdとurl情報が返ってきます
channel.value.uploadFile(
{ file, ... }
).then((data: FileUploadResult) => {
return data
}).catch((err) => {
console.log(err)
throw err
})
アップロードしたファイルURLを引数にメッセージを送信する
- 送信機能の処理内容自体に変更点などはないですが、ファイルを送信する際、パラメータに変更点があります
ファイル送信時のパラメータ設定
const body {
messageType: 'FILE',
userId: 'user_id',
channelType: 'group',
channelUrl: 'channel_url',
:
url: 'url', // ファイルアップロードした際のレスポンス内のURL
file: 'file_binary_data', // ファイルのバイナリーデータ
fileName: 'file_name', // ファイル名
fileSize: 'file_size', // ファイルサイズ
fileType: params.fileType, // MIMEタイプ
:
}
urlプロパティには、ファイルアップロードのレスポンスにアップロード先URLがあるのでそれを設定します
fileプロパティは、ファイルのバイナリーデータを設定します
残りのパラメータ差分に関しては、前回投稿したパラメータ設定の方法で行けると思います！
おわりに
Sendbird移管に際してSendbirdに貢献していきたい...！
ので、引き続き調べた内容など投稿していきたいです~
弊社について
自分が所属している会社についても紹介させてください 🙇♂️
弊社では物流課題解決や荷物を配送するドライバーの価値を向上させるために
「ピックゴー」 というサービスを運用しています
(ファイルアップロード制限？かかって画像アップロードできない...！ごめんなさい...🙇♂️)
代わりに弊社HPを...
あと、那覇Baseが本店になりました
10月25日に自分のいる那覇Baseが本店になりました🎉
自社開発したい方やエンジニアとして成長したい方など少しでも興味ありましたらカジュアル面談や会社説明会も開催していますの気軽にお問い合わせください！