web-dev-qa-db-ja.com

JavaScriptロジックでEJS変数にアクセスする

Node.jsアプリ(ゲームです)に取り組んでいます。この場合、インデックスにアクセスして部屋を選択すると、適切な部屋にリダイレクトされるようにコードを設定しています。

現在、Express v2.5.8では次のように実行されています。

server.get("/room/:name/:roomId, function (req, res) {
  game = ~databaseLookup~
  res.render("board", { gameState : game.gameState });
}

Board.ejsで、次のようなコードを使用してgameStateにアクセスできます。

<% if (gameState) { %>
  <h2>I have a game state!</h2>
<% } %>

これをJavaScriptロジックにインポートする方法はありますか?私はvar gs = ~import ejs gameState~のようなことをしたいし、それで私がやりたいことを何でもできるようにしたい-その変数にアクセスし、検証のためにコンソールに出力する。最終的に、このgameStateでやりたいことは、ボードを適切に表示することです。そのためには、ピースの位置にアクセスして、画面に適切に表示するなどのことを行う必要があります。

ありがとう!

32
Catherine Hwang

GameState変数をページのjavascriptに直接挿入できます。

<% if (gameState) { %>
     <h2>I have a game state!</h2>
     <script>
        var clientGameState = <%= gameState %>            
     </script>
<% } %>

別のオプションは、ページが既にロードされたらサーバーにAJAXコールバックを行い、gameState JSONを返し、clientGameStateをJSON応答に設定することです。

これにも興味があるかもしれません: Node.jsとブラウザ間でコードを共有するにはどうすればよいですか?

46
Nick Hagianis

私は以下のロジックが優れていると感じ、それは私のために働いた。

Ejsページに渡される変数がuidであると仮定すると、divタグまたは渡された変数を持つhタグの内容を持つことができます。スクリプト内のdivまたはhタグのコンテンツにアクセスして、変数に割り当てることができます。

以下のコードサンプル:(ejs)

<script type="text/javascript">
    $(document).ready(function() {
        var x = $("#uid").html(); 
        alert(x);  // now JS variable 'x' has the uid that's passed from the node backend.
    });
</script>

<h2 style="display:none;" id="uid"><%=uid %></h2>

この場合、入力テキストを使用してデータを取得できます。 firebaseで使用する場合は簡単でテスト済みです。

<input type="text" id="getID" style="display: none" value="<%=id%>">
0
Raaj Kanchan