Question

我是Django的新手，试图将我构建的网站迁移到Django应用程序。我已经生成了一个HTML模板，我希望根据所请求的URL呈现动态内容。 HTML模板如下所示：

{% load staticfiles%}

<!DOCTYPE html>
<html lang="en">
<head>
    <script type="text/javascript">
    {{ script }}
    </script>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="{% static 'styles.css' %}"/>
    <title>{{ title }}</title>
</head>
<body>
<header>
    <h1>{{ title }}</h1>
</header>    
<section>
    <p>
        {{ date }}<br/><br/>
        SiteID: {{ site }}
        <br/>
        -----------------
    </p>
</section>
</body>
</html>

在我的views.py文件中，我使用此方法生成网址（例如）：

def site(request):
    return render(request, "sites/site.html", {'date': strftime("%A, %B %d %Y"),
                                               'site': '123456',
                                               'title': 'Test',
                                               'script': "window.lpTag=window.lpTag||{};if(typeof window.lpTag._tagCount==='undefined'){window.lpTag={site:'123456'||'',section:lpTag.section||'',autoStart:lpTag.autoStart===false?false:true,ovr:lpTag.ovr||{},_v:'1.6.0',_tagCount:1,protocol:'https:',events:{bind:function(app,ev,fn){lpTag.defer(function(){lpTag.events.bind(app,ev,fn);},0);},trigger:function(app,ev,json){lpTag.defer(function(){lpTag.events.trigger(app,ev,json);},1);}},defer:function(fn,fnType){if(fnType==0){this._defB=this._defB||[];this._defB.push(fn);}else if(fnType==1){this._defT=this._defT||[];this._defT.push(fn);}else{this._defL=this._defL||[];this._defL.push(fn);}},load:function(src,chr,id){var t=this;setTimeout(function(){t._load(src,chr,id);},0);},_load:function(src,chr,id){var url=src;if(!src){url=this.protocol+'//'+((this.ovr&&this.ovr.domain)?this.ovr.domain:'lptag.liveperson.net')+'/tag/tag.js?site='+this.site;}var s=document.createElement('script');s.setAttribute('charset',chr?chr:'UTF-8');if(id){s.setAttribute('id',id);}s.setAttribute('src',url);document.getElementsByTagName('head').item(0).appendChild(s);},init:function(){this._timing=this._timing||{};this._timing.start=(new Date()).getTime();var that=this;if(window.attachEvent){window.attachEvent('onload',function(){that._domReady('domReady');});}else{window.addEventListener('DOMContentLoaded',function(){that._domReady('contReady');},false);window.addEventListener('load',function(){that._domReady('domReady');},false);}if(typeof(window._lptStop)=='undefined'){this.load();}},start:function(){this.autoStart=true;},_domReady:function(n){if(!this.isDom){this.isDom=true;this.events.trigger('LPT','DOM_READY',{t:n});}this._timing[n]=(new Date()).getTime();},vars:lpTag.vars||[],dbs:lpTag.dbs||[],ctn:lpTag.ctn||[],sdes:lpTag.sdes||[],ev:lpTag.ev||[]};lpTag.init();}else{window.lpTag._tagCount+=1;}"})

问题是，这个方法实际上渲染了我的所有字符串，以便它可以转义撇号（＆＃39;）等字符，这导致JavaScript无法工作。这是我在运行页面时在浏览器控制台中看到的内容：

<script type="text/javascript">
window.lpTag=window.lpTag||{};if(typeof window.lpTag._tagCount===&amp;#39;undefined&#39;){window.lpTag={site:&#39;123456&#39;||&#39;&#39;,section:lpTag.section||&#39;&#39;,autoStart:lpTag.autoStart===false?false:true,ovr:lpTag.ovr||{},_v:&#39;1.6.0&#39;,_tagCount:1,protocol:&#39;https:&#39;,events:{bind:function(app,ev,fn){lpTag.defer(function(){lpTag.events.bind(app,ev,fn);},0);},trigger:function(app,ev,json){lpTag.defer(function(){lpTag.events.trigger(app,ev,json);},1);}},defer:function(fn,fnType){if(fnType==0){this._defB=this._defB||[];this._defB.push(fn);}else if(fnType==1){this._defT=this._defT||[];this._defT.push(fn);}else{this._defL=this._defL||[];this._defL.push(fn);}},load:function(src,chr,id){var t=this;setTimeout(function(){t._load(src,chr,id);},0);},_load:function(src,chr,id){var url=src;if(!src){url=this.protocol+&#39;//&#39;+((this.ovr&amp;&amp;this.ovr.domain)?this.ovr.domain:&#39;lptag.liveperson.net&#39;)+&#39;/tag/tag.js?site=&#39;+this.site;}var s=document.createElement(&#39;script&#39;);s.setAttribute(&#39;charset&#39;,chr?chr:&#39;UTF-8&#39;);if(id){s.setAttribute(&#39;id&#39;,id);}s.setAttribute(&#39;src&#39;,url);document.getElementsByTagName(&#39;head&#39;).item(0).appendChild(s);},init:function(){this._timing=this._timing||{};this._timing.start=(new Date()).getTime();var that=this;if(window.attachEvent){window.attachEvent(&#39;onload&#39;,function(){that._domReady(&#39;domReady&#39;);});}else{window.addEventListener(&#39;DOMContentLoaded&#39;,function(){that._domReady(&#39;contReady&#39;);},false);window.addEventListener(&#39;load&#39;,function(){that._domReady(&#39;domReady&#39;);},false);}if(typeof(window._lptStop)==&#39;undefined&#39;){this.load();}},start:function(){this.autoStart=true;},_domReady:function(n){if(!this.isDom){this.isDom=true;this.events.trigger(&#39;LPT&#39;,&#39;DOM_READY&#39;,{t:n});}this._timing[n]=(new Date()).getTime();},vars:lpTag.vars||[],dbs:lpTag.dbs||[],ctn:lpTag.ctn||[],sdes:lpTag.sdes||[],ev:lpTag.ev||[]};lpTag.init();}else{window.lpTag._tagCount+=1;}
</script>

所以我的问题是 - 如何生成一个动态页面，将实际的JavaScript代码作为变量获取而不渲染代码？（请记住，我也会传输简单的文本，例如页面标题，所以无论如何我都需要渲染页面。）

谢谢！

Answer 1

您应该将该脚本放在单独的文件中，然后将文件名传递给模板。

将您的脚本放在js文件中，比如my_script.js：

window.lpTag=window.lpTag||{};if(typeof window.lpTag._tagCount==='undefined') ...

然后在你看来：

def site(request):
    return render(request, "sites/site.html", {'date': strftime("%A, %B %d %Y"),
                                               'site': '123456',
                                               'title': 'Test',
                                               'script': 'my_script.js'})

然后在你的HTML中：

<head>
    <script type="text/javascript" src="{{ script }}"></script>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="{% static 'styles.css' %}"/>
    <title>{{ title }}</title>
</head>

Django 1.10 - 使用django.shortcuts.render生成一个包含javascript作为参数的变量的网页

1 个答案: