如何在我的< script>< / script>中放置一个Node.js变量？ [英] How to put a Node.js variable inside my <script></script>?
问题描述
我在脚本标记中有一些Firebase代码，但不会执行。我应该如何在其中写入<％= id％>变量？
通常，当我点击按钮时，应该触发一个请求来更新upvote的值Firebase，但没有任何反应。
代码没有执行，但没有错误。
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>
//初始化Firebase
// TODO：替换为您项目的自定义代码段
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>
< span class =UpvoteButton> < / span>< span class =DownvoteButton> < /跨度> < span class =HP><％= post.upvotes - post.downvotes％> HP< /跨度>
< / div>
< / div>
< script>
$ b $ var upvotesRef = firebase.database（）。ref（posts / fun /<％= id％> / upvotes）;
var downvotesRef = firebase.database（）。ref（posts / fun /<％= id％> / downvotes）;点击（函数（）{
upvotesRef.transaction（函数（upvotes）{
if（！upvotes）{
$（'。UpvoteButton'）） b $ b 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;
注意：Firebase也在我的应用中初始化。 js文件。编辑：
如果我尝试这个版本的代码，firebase每次重新加载页面时都会触发请求，而不是单击时触发。
<％var upvotesRef = firebase.database（）。ref我怎样才能确定它只是当我点击触发？ （ 帖/开心/ + ID + / upvotes）;
var downvotesRef = firebase.database（）。ref（posts / fun /+ id +/ downvotes）; ％GT;点击（功能（）{
<％upvotesRef.transaction（函数（upvotes）{
如果（！upvotes）{
upvotes = 0;
}
upvotes = upvotes + 1;
return upvotes;
}）;％>
}）;
编辑2：
发现错误！这是什么意思？
奇怪，因为我点击按钮，这些是我的安全规则进行身份验证：
{
rules： {
.read：true，
.write：auth！= null
}
}
编辑3：
崩溃）之前的错误消息：
主线程上的同步XMLHttpRequest被弃用，因为它对最终用户的体验有不利的影响。如需更多帮助，请查看 https://xhr.spec.whatwg.org/ 。
编辑4：
如果我将规则更改为：
$ b{
rules：{
.read：true，
.write： true
}
}
完美的按钮
但是，如何验证代码不符合以前的规则？
+ 操作符：var upvotesRef = firebase.database（）。ref（posts / fun /<％= id％> / upvotes）;
PROBLEM:
I have some Firebase code in a script tag, but it doesn't execute. How should I write my <%=id%> variable in it ?
Normally, when I click the button, a request should be fired to update the upvote value in Firebase, but nothing happens.
The code doesn't execute but I get no errors.
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>
Here is the router file.
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.: Firebase is also initialised in my app.js file.
EDIT:
If I try this version of the code, the firebase request is triggered every time I reload the page, not when I click. How can I make sure it is triggered only when I click ?
<% 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; }); %> });EDIT 2:
Found the error ! What does it mean ?
This is very weird since I am authenticated when I click the button and these are my security rules:
{ "rules": { ".read": "true", ".write": "auth != null" } }EDIT 3:
I also get the following (non crashing) error message before:
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.
EDIT 4:
If I change my rules to:
{ "rules": { ".read": "true", ".write": "true" } }The button works perfectly !
But how come the code doesn't work with the previous rule although I am authenticated ???
解决方案Since you're using a templating language you don't need the
+operators:var upvotesRef = firebase.database().ref("posts/fun/<%=id%>/upvotes");
这篇关于如何在我的< script>< / script>中放置一个Node.js变量？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
