如何从 json 有效负载中获取 iframe 以在 pug 中呈现？

Question

问题是我的 iframe 被渲染为文本而不是 iframe。这是他的有效载荷

 var payload = {
  'iat': now,
  'nbf': now,
  'exp': now + 86400, //one day from now.
  'dashboard': 224277,
  'organization': 19190,
  'env': {"MYVAR": 42}
};

var token = jwt.encode(payload, ORGANIZATION_SECRET, 'HS256');
var src = 'iframe#dash.embedf(src=\'' + BASE_URL + '/' + token + '\')';
console.log(src);
res.render("pages/sponsorship", {frame: src});
});

这是哈巴狗模板，赞助。

#container
  .row
    #chart-container

include ../../partials/footer

  script
    | var src  = !{JSON.stringify(frame)}
    | document.getElementById('chart-container').innerHTML = (src);

浏览器中的输出是原始文本，而不是渲染 iframe。

pic of output in browser

Answer 1

您要求浏览器编译 pug 代码，但它没有这样做。相反，将 src 变量更改为使用标准 html：

var payload = {
  'iat': now,
  'nbf': now,
  'exp': now + 86400, //one day from now.
  'dashboard': 224277,
  'organization': 19190,
  'env': {"MYVAR": 42}
};

var token = jwt.encode(payload, ORGANIZATION_SECRET, 'HS256');
var src = '<iframe id="dash" class="embedf" src="' + BASE_URL + '/' + token + '"></iframe>';
console.log(src);
res.render("pages/sponsorship", {frame: src});
});