如何将Node.js变量放在我的<script> </script>中?

时间:2016-11-03 18:37:07

标签: javascript jquery node.js firebase

问题:

我在脚本标记中有一些Firebase代码,但它不会执行。我该怎么写我的&lt;%= id%&gt;变量呢?

通常,当我点击按钮时,应该触发一个请求以更新Firebase中的upvote值,但没有任何反应。

代码没有执行但我没有错误。

CODE:

file.ejs

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://www.gstatic.com/firebasejs/3.5.0/firebase.js"></script>

<script>
  // Initialize Firebase
  // TODO: Replace with your project's customized code snippet
  var config = {
    apiKey: "info",
    authDomain: "info",
    databaseURL: "info",
    storageBucket: "info",
    messagingSenderId: "info"
  };
  firebase.initializeApp(config);
</script>

<div class ="containerMarginsDetails">

    <h1 class= "detailsTitle"><%=post.title %></h1>
    <div class="row">
        <img class = "postImg"  src="/images/uploads/<%= post.image %>">
        <span class="UpvoteButton"> </span><span class="DownvoteButton"> </span> <span class="HP"><%= post.upvotes - post.downvotes%> HP</span>
    </div>

</div>

<script>

        var upvotesRef =  firebase.database().ref("posts/fun/<%=id%>/upvotes");
        var downvotesRef = firebase.database().ref("posts/fun/<%=id%>/downvotes");

        $('.UpvoteButton').click(function () {

                      upvotesRef.transaction(function (upvotes) {  
                       if (!upvotes) { 
                          upvotes = 0; 
                       } 
                         upvotes = upvotes - 1; 
                         return upvotes; 
                      }); 
       });

</script>

这是路由器文件。

file.js

var express = require("express");
var router = express.Router();

var firebase = require("firebase");

router.get('/details/:id', function(req, res){
    global.page_name = "fun";
    var id = req.params.id;
    var funPostRef = firebase.database().ref("posts/fun/"+id);

    funPostRef.once('value', function(snapshot){
        var funPost = snapshot.val();
        res.render('fun/details', {post: funPost, id:id});
    });
});

module.exports = router;

N.B。:我的app.js文件中也初始化了Firebase。

修改

如果我尝试使用此版本的代码,则每次重新加载页面时都会触发firebase请求,而不是在我单击时触发。如何确保仅在我点击时触发?

<% var upvotesRef =  firebase.database().ref("posts/fun/"+id+"/upvotes");
var downvotesRef = firebase.database().ref("posts/fun/"+id+"/downvotes"); %>

$('.UpvoteButton').click(function () {
      <% upvotesRef.transaction(function (upvotes) {  
          if (!upvotes) { 
             upvotes = 0; 
          } 
             upvotes = upvotes + 1; 
             return upvotes; 
      }); %>
   });

编辑2:

发现错误!这是什么意思?

enter image description here

这很奇怪,因为当我点击按钮进行身份验证时,这些是我的安全规则:

{
  "rules": {
    ".read": "true",
    ".write": "auth != null"
  }
}

编辑3:

我之前还收到以下(非崩溃)错误消息:

主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用。如需更多帮助,请查看https://xhr.spec.whatwg.org/

编辑4:

如果我将规则更改为:

{
  "rules": {
    ".read": "true",
    ".write": "true"
  }
}

按钮效果很好!

但是,虽然我已经过身份验证,但代码怎么能用于以前的规则???

2 个答案:

答案 0 :(得分:2)

由于您使用的是模板语言,因此您不需要+运算符:

var upvotesRef =  firebase.database().ref("posts/fun/<%=id%>/upvotes");

答案 1 :(得分:1)

你可以尝试回声&#34; &lt;% - id%&gt;

的ID

遗憾的是我不能发表评论(代表不够)否则如果你检查按钮,我会问你是否看到了id。