2024年6月2日日曜日

LINEのようなチャットができるサイトを作りたいのですが、チャット系 (リアルタイム系)は作った事がないので、どうやって作ったらいいか教えてください (言語はなんでもいいです)?

https://codejp.quora.com/LINE%E3%81%AE%E3%82%88%E3%81%86%E3%81%AA%E3%83%81%E3%83%A3%E3%83%83%E3%83%88%E3%81%8C%E3%81%A7%E3%81%8D%E3%82%8B%E3%82%B5%E3%82%A4%E3%83%88%E3%82%92%E4%BD%9C%E3%82%8A%E3%81%9F%E3%81%84%E3%81%AE%E3%81%A7%E3%81%99%E3%81%8C-%E3%83%81%E3%83%A3%E3%83%83%E3%83%88%E7%B3%BB-%E3%83%AA%E3%82%A2%E3%83%AB%E3%82%BF%E3%82%A4%E3%83%A0%E7%B3%BB-%E3%81%AF%E4%BD%9C%E3%81%A3%E3%81%9F%E4%BA%8B%E3%81%8C%E3%81%AA%E3%81%84%E3%81%AE%E3%81%A7-%E3%81%A9%E3%81%86%E3%82%84%E3%81%A3%E3%81%A6%E4%BD%9C%E3%81%A3%E3%81%9F%E3%82%89%E3%81%84%E3%81%84%E3%81%8B%E6%95%99%E3%81%88%E3%81%A6%E3%81%8F%E3%81%A0%E3%81%95%E3%81%84-%E8%A8%80%E8%AA%9E%E3%81%AF%E3%81%AA%E3%82%93%E3%81%A7%E3%82%82%E3%81%84%E3%81%84%E3%81%A7%E3%81%99

https://codejp.quora.com/LINE%E3%81%AE%E3%82%88%E3%81%86%E3%81%AA%E3%83%81%E3%83%A3%E3%83%83%E3%83%88%E3%81%8C%E3%81%A7%E3%81%8D%E3%82%8B%E3%82%B5%E3%82%A4%E3%83%88%E3%82%92%E4%BD%9C%E3%82%8A%E3%81%9F%E3%81%84%E3%81%AE%E3%81%A7%E3%81%99%E3%81%8C-%E3%83%81%E3%83%A3%E3%83%83%E3%83%88%E7%B3%BB-%E3%83%AA%E3%82%A2%E3%83%AB%E3%82%BF%E3%82%A4%E3%83%A0%E7%B3%BB-%E3%81%AF%E4%BD%9C%E3%81%A3%E3%81%9F%E4%BA%8B%E3%81%8C%E3%81%AA%E3%81%84%E3%81%AE%E3%81%A7-%E3%81%A9%E3%81%86%E3%82%84%E3%81%A3%E3%81%A6%E4%BD%9C%E3%81%A3%E3%81%9F%E3%82%89%E3%81%84%E3%81%84%E3%81%8B%E6%95%99%E3%81%88%E3%81%A6%E3%81%8F%E3%81%A0%E3%81%95%E3%81%84-%E8%A8%80%E8%AA%9E%E3%81%AF%E3%81%AA%E3%82%93%E3%81%A7%E3%82%82%E3%81%84%E3%81%84%E3%81%A7%E3%81%99

 · 

フォロー

はいどうぞ

チュートリアル: WebSocket API、Lambda、DynamoDB を使用したサーバーレスチャットアプリケーションの構築
チュートリアル: WebSocket API、Lambda、DynamoDB を使用したサーバーレスチャットアプリケーションの構築 このチュートリアルでは、WebSocket API を使用してサーバーレスチャットアプリケーションを作成します。WebSocket API を使用すると、クライアント間の双方向通信をサポートできます。クライアントは、更新をポーリングしなくてもメッセージを受信できます。 このチュートリアルの完了には約 30 分かかります。最初に、AWS CloudFormation テンプレートを使用して API リクエストを処理する Lambda 関数と、クライアント ID を保存する DynamoDB テーブルを作成します。次に、API Gateway コンソールを使用して、Lambda 関数と統合する WebSocket API を作成します。最後に、API をテストして、メッセージが送受信されることを確認します。 このチュートリアルを完了するには、AWS アカウントと、コンソールへのアクセス権がある AWS Identity and Access Management ユーザーが必要です。詳細については、「 API Gateway の開始方法の前提条件 」を参照してください。 また、API に接続するには wscat も必要です。詳細については、「 wscat を使用した WebSocket API への接続とメッセージの送信 」を参照してください。 ステップ 1: Lambda 関数と DynamoDB テーブルを作成する AWS CloudFormation のアプリケーション作成テンプレート をダウンロードして解凍します。このテンプレートを使用して、アプリケーションのクライアント ID を保存する Amazon DynamoDB テーブルを作成します。接続されている各クライアントには、テーブルのパーティションキーとして使用する一意の ID があります。このテンプレートは、DynamoDB のクライアント接続を更新し、接続されたクライアントへのメッセージの送信を処理する Lambda 関数も作成します。 AWS CloudFormation スタックを作成するには https://console.aws.amazon.com/cloudformation で AWS CloudFormation コンソール を開きます。 [ スタックの作成 ] を選択し、[ With new resources (standard) 新しいリソースを使用 (標準) ] を選択します。 [ Specify template (テンプレートの指定) ] で、[ Upload a template file (テンプレートファイルのアップロード) ] を選択します。 ダウンロードしたテンプレートを選択します。 [ Next (次へ) ] を選択します。 [ Stack name ] (スタックの名前) で、 websocket-api-chat-app-tutorial と入力し、[ Next ] (次へ) を選択します。 [ Configure stack options ] (スタックオプションの設定) で、[ Next ] (次へ) を選択します。 [ Capabilities ] (機能) で、AWS CloudFormation がアカウントに IAM リソースを作成できることを承認します。 送信 を選択します。 AWS CloudFormation は、テンプレートで指定されたリソースをプロビジョニングします。リソースのプロビジョニングには数分かかることがあります。AWS CloudFormation スタックのステータスが CREATE_COMPLETE の場合は、次のステップに進む準備ができています。 ステップ 2: WebSocket API を作成する WebSocket API を作成して、クライアント接続を処理し、ステップ 1 で作成した Lambda 関数にリクエストをルーティングします。 WebSocket API を作成するには https://console.aws.amazon.com/apigateway で API Gateway コンソールにサインインします。 [ API の作成 ] を選択します。次に、[ WebSocket API ] で [ Build ] (ビルド) を選択します [ API 名 ] に「 websocket-chat-app-tutorial 」と入力します。 [ Route selection expression ] (ルート選択式) に「 request.body.action 」と入力します。ルート選択式は、クライアントがメッセージを送信したときに API Gateway が呼び出すルートを決定します。 [ Next ] を選択します。 [ Predefined routes ] (定義済みのルート) で、[ Add $connect ] ($connect の追加)、[ Add $disconnect ] ($disconnect の追加)、および [ Add $default ] ($default の追加) を選択します。[ $connect ] および [ $disconnect ] ルートは、クライアントが API に接続または切断したときに API Gateway が自動的に呼び出す特別なルートです。API Gateway は、他のルートがリクエストに一致するルートがない場合に、 $default ルートを呼び出します。 [ Custom routes ] (カスタムルート) で、[ Add custom route ] (カスタムルートの追加) を選択します。[ Route key ] (ルートキー) に「 sendmessage 」と入力します。このカスタムルートは、接続されたクライアントに送信されるメッセージを処理します。 [ Next ] を選択します。 [ Attach integrations ] (統合のアタッチ) で、各ルートと [ Integration type ] (統合タイプ) ごとに、Lambda を選択します。 [ Lambda ] には、ステップ 1 で AWS CloudFormation を使用して作成した、対応する Lambda 関数を選択します。各関数の名前はルートと一致します。例えば、[ $connect ] ルートの場合は、 websocket-chat-app-tutorial-ConnectHandler という名前の関数を選択します。 API Gateway が作成するステージを確認します。デフォルトでは、API Gateway はステージ名 production を作成し、API をそのステージに自動的にデプロイします。[ Next ] を選択します。 [ Create and deploy ] (作成してデプロイ) を選択します。 ステップ 3: A

バックが出来れば適当なWebSocketライブラリとか使って繋いで、Reactとか適当なJS WebUIで画面作れば完了しますね。

クライアント数がとても少ないなら、ロングポーリングである程度リアルタイムっぽいことも出来ます(ポーリングが都度更新をチェック行くのに対して、ロングポーリングはタイムアウト時間を延長して更新が無い間は応答を返さずに維持して更新があったときに応答を返すことで対応します)
 つまり、普通のプログラムであればサーバサイドは普通に処理してすぐに応答しますが、ロングポーリングの考えでは雑に言えばAPI側は

  1. def get_new_message(): 
  2. while True: 
  3. if timeline.check_updated(): 
  4. json = timeline.get_new_messsage().tojson() 
  5. break 
  6. sleep(1) 
  7. return json 

の様に、送るべき内容が来るまで待機します。 中間などがタイムアウトしたり、スマホ等IPが変わったりしたりして途切れるので、30秒とかでブレークして繋ぎ直す事になりますが、とてもシンプルで普通のポーリングほど負荷が上がらず一応のリアルタイム性が得られます。

イシヅカ マサヒロさんのプロフィール写真

 · 

P2Pを使用し、応用しても作れますか?

出来ない事は無いけどスマホなどでネットワークが切り替わりがちな対象では、ピアとの通信が安定しないのでピア情報をしょっちゅう問い合わせることになるので帯域をそれほど消費するわけでも無いチャットのようなメッセージングは中央集約の方が合理的に思います。 P2Pだと受ける側の端末のあるネットワーク制約問題もあり直接繋げない環境も多く(多くのWiFi等はNATゲートウェイ経由で着信不能)、クライアントからHTTP(S)でサーバに接続を開始するスタイルが一番汎用的であると思います。

-K.E-さんのプロフィール写真
 · 

websocketはレンタルサーバーあたりは受け入れてくれないことがある(xserverは受け入れてなかったと思う)websocket使うならVPS借りる形になるかも

p2pを使用するならjsにあるwebrtcapi辺りとか?

ローカルで作る場合は、私はnode.jsを使った記憶がある 、

ラインのようにしたいのであれば、webrtcAPIのデータチャネルを使えば良いような気がする。

まだ理解しきれていない部分があるから、間違っている部分があるかもしれません、ご容赦頂けると嬉しいです。

0 コメント:

コメントを投稿