meteor.jsとreact.jsにデータベースを使用せずに、簡単なチャットを作成するにはどうすればよいですか?

alex10

に簡単なチャットを書きたいmeteor.jsので、にデータを保存したくありませんdatabaseしかし、私はdatabaseなしでアプリケーションを作成する方法を見つけられませんでした

これが私が想像できるコードの例です。サーバーコード:

export let ws = [{_id:'1', text:'test1'}, {_id:'2', text:'test2'}];
Meteor.publish('ws', function wsPub() { return ws; });
let ctr = 3;
Meteor.methods({
    'addMsg'(text) {  ws.push({_id:ctr+1, text:text});  }
});

およびクライアントコード:

import {ws} from '../api/model.js';

class Rtc extends Component {
  constructor(props) {
    super(props);
  }
  addMsg(e){
    e.preventDefault();
    Meteor.call('addMsg', this.refs.input.value);
  }
  render() {
    return (
      <div>
         {this.props.ws.map((item, i)=>{ 
           return(<span key={i._id}>{item.text}</span>); 
         })}
         <input type="text" ref="input" />
         <input type="submit" value="submit" onClick={this.addMsg.bind(this)}/>
       </div>
    );
  }
}
export default createContainer( () => {
  Meteor.subscribe('ws');
  return { ws: ws };
}, Rtc);

しかし、私が書いたものがそうではないのか分かりませんcreateContainerか?

UPD:サーバーコードを更新しましたが、それでもWebSocketが機能しません:

Meteor.publish('ws', function wsPub() {
  let self = this;
  ws.forEach( (msg)=> {
    self.added( "msg", msg._id, msg.text );
  });
  self.ready();
  // return ws;
});
DoctorPangloss

あなたは、パブリッシュ「インスタンスを公開する」(特定のサブスクリプションには本当に特定のクライアント)への参照を取得の上に送られるかを制御し、その使用したい場合はadd/ change/removeコマンドを:

let messages = [];
let clients = [];
Meteor.publish('ws', function() {
    clients.push(this);
    _.each(messages, (message) => {this.added('msg', message._id, message);});
    this.ready();
});
Meteor.methods({
    addMsg(text) {
        let newMessage = {_id: Meteor.uuid(), text: text};
        messages.push(newMessage);
        _.each(clients, (client) => {client.added('msg', newMessage._id, newMessage);});
    }
});

更新で記述したコードに関して:string関数addedがドキュメントを期待する場所(an object)を送信していますまた、上記のこの例とは異なり、ws(メッセージ配列)がいつ変更されたかをクライアントに通知しません

また、これらの名前をより冗長で明確になるように名前を変更することをお勧めします:)

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

Meteorで、d3.jsチャートで使用するために.tsvファイルからデータをインポートするにはどうすればよいですか?

分類Dev

Meteorでハイマップとハイチャートを使用するにはどうすればよいですか?

分類Dev

保存したDraft-JSデータをエディターに表示するにはどうすればよいですか?(React + Meteor)

分類Dev

Meteor.jsの各コマンドのハンドルバーを使用してブートストラップグリッドシステムにデータを入力するにはどうすればよいですか?

分類Dev

動的インポートをmeteorとチェーンするにはどうすればよいですか?

分類Dev

Meteor.jsを完全にアンインストールしてから再インストールするにはどうすればよいですか?

分類Dev

Meteor JSでBashスクリプトを実行するにはどうすればよいですか?

分類Dev

Meteorのパッケージを作成するときに、別のパッケージに依存するにはどうすればよいですか?

分類Dev

Meteor JSアプリをローカライズするにはどうすればよいですか?

分類Dev

meteor.jsを使用して特定のテンプレートの本体にonload関数を取得するにはどうすればよいですか?

分類Dev

Meteor JS:Meteorのウィンドウにイベントをバインドするにはどうすればよいですか?

分類Dev

Meteor.js-別のWebアプリからPOSTデータを受信するにはどうすればよいですか?

分類Dev

iconic.jsをMeteorアプリと統合するにはどうすればよいですか?

分類Dev

React with Meteorを設定するにはどうすればよいですか?

分類Dev

Meteor.jsのサーバーからユーザーをログアウトするにはどうすればよいですか?

分類Dev

ES6を使用してMeteorサブスクリプションデータをReactコンポーネントプロップに渡すにはどうすればよいですか?

分類Dev

既存のmongodbをMONGO_URLとして使用する場合、Meteorサーバーコレクションからクライアントコレクションにデータを確実にプルするにはどうすればよいですか?

分類Dev

React Meteor withTrackerデータが到着した後に関数を実行するにはどうすればよいですか?

分類Dev

React.JSで簡単なリストメーカーアプリを作成するにはどうすればよいですか?

分類Dev

Meteor account-ui:メールアドレスとパスワードを使用してユーザーを作成し、ログイン後にプロファイルを完成させるにはどうすればよいですか?

分類Dev

ボタンを押したときにMeteorテンプレートを変更するにはどうすればよいですか?

分類Dev

Meteor 1.5.2でreactを使用してページネーションを機能させるにはどうすればよいですか?

分類Dev

チャートjsでデータが利用可能な場合にのみツールチップを表示するにはどうすればよいですか?

分類Dev

meteorを使用してサーバー側のmain.jsのコレクションにデータを挿入するにはどうすればよいですか?

分類Dev

PostgreSQL:単体テスト用の一時的なユーザーとデータベースを作成するにはどうすればよいですか?

分類Dev

フォームが動的に作成されたときにMeteorイベントでHTMLフォームから値を取得するにはどうすればよいですか?

分類Dev

異なるnode.jsプロセスからmeteor.jsmongodbインスタンスに接続するにはどうすればよいですか?

分類Dev

Meteor&ReactでCordovaを使用するにはどうすればよいですか?

分類Dev

Meteorメソッド内で `$ set`と` $ pull`を実行するにはどうすればよいですか?

Related 関連記事

  1. 1

    Meteorで、d3.jsチャートで使用するために.tsvファイルからデータをインポートするにはどうすればよいですか?

  2. 2

    Meteorでハイマップとハイチャートを使用するにはどうすればよいですか?

  3. 3

    保存したDraft-JSデータをエディターに表示するにはどうすればよいですか?(React + Meteor)

  4. 4

    Meteor.jsの各コマンドのハンドルバーを使用してブートストラップグリッドシステムにデータを入力するにはどうすればよいですか?

  5. 5

    動的インポートをmeteorとチェーンするにはどうすればよいですか?

  6. 6

    Meteor.jsを完全にアンインストールしてから再インストールするにはどうすればよいですか?

  7. 7

    Meteor JSでBashスクリプトを実行するにはどうすればよいですか?

  8. 8

    Meteorのパッケージを作成するときに、別のパッケージに依存するにはどうすればよいですか?

  9. 9

    Meteor JSアプリをローカライズするにはどうすればよいですか?

  10. 10

    meteor.jsを使用して特定のテンプレートの本体にonload関数を取得するにはどうすればよいですか?

  11. 11

    Meteor JS:Meteorのウィンドウにイベントをバインドするにはどうすればよいですか?

  12. 12

    Meteor.js-別のWebアプリからPOSTデータを受信するにはどうすればよいですか?

  13. 13

    iconic.jsをMeteorアプリと統合するにはどうすればよいですか?

  14. 14

    React with Meteorを設定するにはどうすればよいですか?

  15. 15

    Meteor.jsのサーバーからユーザーをログアウトするにはどうすればよいですか?

  16. 16

    ES6を使用してMeteorサブスクリプションデータをReactコンポーネントプロップに渡すにはどうすればよいですか?

  17. 17

    既存のmongodbをMONGO_URLとして使用する場合、Meteorサーバーコレクションからクライアントコレクションにデータを確実にプルするにはどうすればよいですか?

  18. 18

    React Meteor withTrackerデータが到着した後に関数を実行するにはどうすればよいですか?

  19. 19

    React.JSで簡単なリストメーカーアプリを作成するにはどうすればよいですか?

  20. 20

    Meteor account-ui:メールアドレスとパスワードを使用してユーザーを作成し、ログイン後にプロファイルを完成させるにはどうすればよいですか?

  21. 21

    ボタンを押したときにMeteorテンプレートを変更するにはどうすればよいですか?

  22. 22

    Meteor 1.5.2でreactを使用してページネーションを機能させるにはどうすればよいですか?

  23. 23

    チャートjsでデータが利用可能な場合にのみツールチップを表示するにはどうすればよいですか?

  24. 24

    meteorを使用してサーバー側のmain.jsのコレクションにデータを挿入するにはどうすればよいですか?

  25. 25

    PostgreSQL:単体テスト用の一時的なユーザーとデータベースを作成するにはどうすればよいですか?

  26. 26

    フォームが動的に作成されたときにMeteorイベントでHTMLフォームから値を取得するにはどうすればよいですか?

  27. 27

    異なるnode.jsプロセスからmeteor.jsmongodbインスタンスに接続するにはどうすればよいですか?

  28. 28

    Meteor&ReactでCordovaを使用するにはどうすればよいですか?

  29. 29

    Meteorメソッド内で `$ set`と` $ pull`を実行するにはどうすればよいですか?

ホットタグ

アーカイブ