2016-04-15 12 views
0

最初に私はWeb開発の初心者だと言いたいので、誤った語彙を使用するかもしれません。サーバー(playframework)からのビュー(Mithriljs)の更新

ビューを更新するためにクライアントにデータベースの変更を送信するために私のサーバーからアクションを開始したいと思います。

私はSPA(シングルページアプリケーション)モデルを尊重しようとしています。したがって、すべてのビューはmithriljsによって生成されます。

私は自分のデータベース上でいくつかの外部修正を行いますが、ブラウザを更新せずに私のビューを更新する最良の方法は何ですか?

私はサーバー側でplayframeworkを使用します。

+1

私はMithriljsに精通していないです - 元のモデルが更新されたときにビューが自動的に更新されるAngularと同様に機能しますか?はいの場合、もちろんWebSocket接続に行くことができます。Playアプリケーションはクライアントにデータをプッシュします。>データはモデルに入れます。>ビューはモデルに従って更新されます。 – Anton

+0

はい、そうです。ご回答有難うございます。私はWebSocketを見ていきます。 javascriptのwebsocket用の特別なライブラリをお勧めしますか? – GermainGum

+0

もしMithriljsにこれ用のコンポーネントがあれば、もちろんそれを使うことができます。しかし、たとえそうでないとしても - WebSocketの接続は、単純なJavaScriptの2〜3行で実装することができます - ここを見てください:http://www.websocket.org/echo.html - これを使ってサーバサイドをテストすることもできます – Anton

答えて

1

ミスリルをプッシュ技術で使用するのはとても簡単です。 Antonによって言及されているように、単純なWebSocket接続を作成し、関数内のデータをlistenすることができます。その後、データモデルを更新して処理します。すべてが正常であれば、m.redrawと呼んで完了です。 (https://www.websocket.org/echo.htmlで例を使用して)

// A simple model, an array of messages: 
var messages = m.prop([]); 

function onMessage(evt) { 
    var message = evt.data; 
    // Some validation, only strings allowed 
    if (typeof message === 'string' || message instanceof String) { 
     messages().push(message); 
     // All ok, redraw 
     m.redraw(); 
    } 
} 

次に、あなたのミスリルのビューは次のようになります。:

var WebSocketMessages = { 
    view: function() { 
     m("ul", messages().map(function(message) { 
      return m("li", message); 
     })) 
    } 
} 

そして、それを表示するには:このような何か

m.mount(document.body, WebSocketMessages); 
関連する問題