wechat im

微信

WeChat ミニ プログラム インスタント メッセージング

私はこのプロジェクトの開発に多大な労力を費やしましたが、それがあなたの役に立ち、インスピレーションを与えてくれるなら、 GitHubでstarを付けたいと思っています。私の仕事をサポートし、肯定してくれるのです！

また、プロジェクト内の長すぎるテキストのオーバーフロー レイアウトの問題を修正して提出してくれた kulovecc にも非常に感謝しています。

導入：

wechat-im は、ミニ プログラム プラットフォームにインスタント メッセージング機能を迅速に実装できる完全なテンプレートです。

バージョン 2.xx に更新されました

1.0.x 以前のバージョンと比較して、2.xx の新機能

• ES6 構文が完全に使用されており、非同期操作では Promise と非同期構文シュガーを使用してコードをよりセマンティックにしています。 (新しい WeChat 開発ツールと「拡張コンパイル」を有効にする必要があります)
• 文字入力機能がコンポーネント化され、前バージョンよりも性能が向上しました！
• サポートされる WeChat 基本ライブラリの最小バージョンは 2.6.1 です (以前のサポートされる最小バージョンは 1.4.0 でした)
• 一部のシナリオでの問題を修正しました。たとえば、音声メッセージを再生しているときにチャット インターフェイスを終了しても、音声は引き続き再生されます。
• 2.xx ドキュメント。数日以内に更新してください。能力のある学生はそれを更新できます。そのほとんどは構文の更新とコンポーネント化です。最近とても忙しかったので、クラスメートの皆さんには申し訳ありませんでした。

特性：

• 現在、IMの通信機能を実現するプロジェクトではwebSocketが使われています！現在、セッション一覧ページ、セッションページ、フレンドページが含まれています。 nodejs を使用してローカル WebSocket サービスを開くことをサポートします。
• テキスト、画像、音声の送信をサポートし、入力メソッドで絵文字表現をサポートします
• 写真の撮影、ギャラリーからの写真の選択、写真のプレビューをサポートします
• テキスト入力に切り替えるときの送信ボタンの表示をサポートします。
• 音声再生とアニメーション再生をサポートします。
• 音声録音の最小時間と最大時間の構成をサポートします。
• カスタム イベントの構成をサポートします。
• 時間順に並べ替えられたチャット メッセージをサポートします。
• メッセージを送信すると、ページが一番下に戻ります。
• 最新の音声再生イン​​ターフェイスを使用しており、下位バージョンの音声再生イン​​ターフェイスと互換性があります。
• メッセージの送信中、送信成功、送信失敗のステータス更新
• メッセージ送信失敗をサポートします。再送信ボタンをクリックして再送信します。
• タイムバブル表示ロジックを最適化します。隣接する情報が 5 分を超えてから、後者の情報が表示されます。
• ページ上部にセッションステータスの UI 表示を追加しました
• カスタムバブルを表示するカスタム関数。
• 音声または画像メッセージ情報を解析することにより、最初にローカル ファイルが読み込まれます。
• ファイル ストレージ アルゴリズムは、10M ストレージ スペース内の音声ファイルと画像ファイルが最新であることを保証するために実装されています。
• 各メッセージ タイプと各関数はモジュール化されているため、コードを快適かつ簡単に参照できます。 (実際には、これはコンポーネントの機能ではありません...)

現在サポートされていない機能:

• グループ チャットを使用する場合、現在の UI ではメンバーのニックネームがアバターの横に表示されません。
• ローカルに保存されるチャット メッセージの履歴はありません。理由については、ドキュメントの最後を参照してください。
• 現在、WebSocket のすべての機能は学習と参考用にのみ提供されており、商用で使用する場合はご自身で開発してください。
• 現在、プラグインとしてはサポートされていません。

このプロジェクトを研究または使用するにはどのような条件が必要ですか?

• ES6 の構文仕様とデザイン パターンに精通している必要があります。そうでないと、プロジェクトの敷居が高くなってしまいます。
• WebSocket を深くマスターする必要はありませんが、WebSocket の一般的な API と使用法については知っておく必要があります。詳細については、ミニ プログラム WebSocket を参照してください。
• npm 依存関係のインストールとコマンドの実行を理解する (このブロックは主にローカル WebSocket サービスを開始するために使用されます)

インストール方法と使用方法

1. 開発者ツールインポートプロジェクト

修改app.js文件中下面配置的url为你本地网络ip及固定的端口号8001，即ws://xx.xx.xx.xx:8001
this.imWebSocket.createSocket({url: 'ws://10.4.97.87:8001'});

2. ローカル WebSocket サービスを構築する

项目根目录下启动Terminal
需先安装依赖 npm install
执行 npm run server  即可开启WebSocket服务

3. 開発者ツールを使用してプロジェクトを実行する

あなたのプロジェクトがこのフレームワークを使用し、正式に運用される場合、ご都合がよければ、ミニプログラムの QR コードを提供していただければ、ここで宣伝することができます。

リンク

書類

質問

変更ログ

ライセンス

協力する

技術的な交流については、QQ グループに参加してください: グループ 1: 821711186 (フル) グループ 2: 834335591

協力の意図がある場合、または製品を宣伝したい場合は、QQ: 1178545208 を追加できます。

ヒントは大歓迎です