玉器中的变量，全局对象和console.log [英] Variables, global objects, and console.log in jade

问题描述

我已经使用express框架创建了一个应用程序，该应用程序将jade用作模板引擎.在玩玉石的过程中，我进行了简单的测试:

I've created an app with the express framework, which comes with jade as its templating engine. While playing around with jade, I've set up what I feel to be a simple test:

在Node中，我正在将对象传递给渲染res.render('index', { title: 'Express', docs:"is jade cool?"});上的jade模板，并且在该模板中，我试图像这样调用这些值:

In Node I am passing an object to the jade template on render res.render('index', { title: 'Express', docs:"is jade cool?"});, and in the template I'm trying to call the values like so:

  h1= title
  p Hi!
  p Welcome to #{title}
  p #{docs}
   - console.log(docs)

  script(type='text/javascript').

   console.log(docs);

我发现我无法控制台记录全局对象的值，并且如果尝试使用#{docs}，它将尝试将其解析为文字命令，而不是其开头的字符串.我还发现我无法将其分配给JS变量，例如:var test = #{docs};.

What I've found is that I can't console log the global object values, and if I try #{docs}, it tries to parse it as a literal command rather than the string it started as. I also found that I cannot assign it to a JS var, like this: var test = #{docs};.

有人可以解释:

• #{docs}，!{docs}和docs有什么区别? (奇怪的是，在文档中使用了所有三个示例，但是并没有真正解释它们.)
• 控制台记录从Node传递给jade的全局对象属性的正确方法是什么，以及将这些相同的属性分配给本地JS变量的正确方法是什么?

• What is the difference between #{docs}, !{docs} and docs? (Oddly enough all three examples are used in the documentation, but none of them are really explained.)
• What is the correct way to console log the global object properties passed to jade from Node and the correct way to assign those same properties to local JS variables?

推荐答案

#{docs}，！{docs}和docs之间有什么区别(本文档中使用了所有三个示例，但确实没有对它们进行任何解释)

what is the difference between #{docs}, !{docs} and docs (oddly enough all three examples are used in the documentation, but none of them are really explained)

//This will output literal HTML <p>docs</p>
p docs

示例命令行:

echo "p docs" | jade
<p>docs</p>

---

//This will interpolate the variable docs into a string
//and also escape any HTML it may contain: <p>is jade cool?</p>
//To see what I mean, try passing docs: "jade is <b>cool</b>" (contains HTML)
//you'll get <p>jade is &lt;b&gt;cool&lt;/b&gt;</p>
p #{docs}

//This syntax is another flavor of the above
p= docs

示例命令行:

echo 'p #{docs}'  | jade --obj '{docs: "jade is <b>cool</b>"}'
<p>jade is &lt;b&gt;cool&lt;/b&gt;</p>

echo 'p= docs'  | jade --obj '{docs: "jade is <b>cool</b>"}'
<p>jade is &lt;b&gt;cool&lt;/b&gt;</p>

---

//This will do the same but NOT escape HTML
//The exclamation point is supposed to convey warning
//because this can be a XSS vulnerability
p !{docs}

示例命令行:

echo 'p !{docs}'  | jade --obj '{docs: "jade is <b>cool</b>"}'
<p>jade is <b>cool</b></p>

echo 'p!= docs'  | jade --obj '{docs: "jade is <b>cool</b>"}'
<p>jade is <b>cool</b></p>

---

什么是控制台记录从节点传递给jade的全局对象属性的正确方法，以及将这些相同的属性分配给本地js变量的正确方法

what is the correct way to console log the global object properties passed to jade from node and the correct way to assign those same properties to local js variables

这样做很常见，天真/不安全的答案是这样的:

It is very common to want to do this, and the naive/insecure answer is something like this:

script(type="text/javascript")!= "var myData = " + JSON.stringify(myData)

我可以通过哪个进行测试

Which I can test via

jade --obj '{myData: {foo: "FOO"}}' < t1.jade

并获得

<script type="text/javascript">var myData = {"foo":"FOO"}</script>

但是，在HTML文档中安全地嵌入JSON数据的规则很棘手(在此处进行详细说明)，所以我高度重视建议使用诸如 sharify 这样的帮助程序模块，以确保数据安全地在HTML中传递

However, the rules for securely embedding JSON data within an HTML document are tricky (details here), so I highly recommend using a helper module such as sharify which will make sure the data is passed in the HTML securely.

这篇关于玉器中的变量，全局对象和console.log的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！