HTML转义

  • 模板对上下文传递的字符串进行输出时，会对以下字符自动转义
小于号< 转换为&lt;

大于号> 转换为&gt;

单引号' 转换为'

双引号" 转换为 &quot;

与符号& 转换为 &amp;

示例

  • 打开booktest/views.py文件，创建视图zhuanyi
def zhuanyi(request):

    context={'content':'<h1>hello world</h1>'}

    return render(request,'booktest/zhuanyi.html',context)

　　

  • 打开booktest/urls.py文件，配置url
url(r'^zhuanyi/$', views.zhuanyi),

　　

  • 在templates/booktest/目录下创建zhuanyi.html
<html>

<head>

    <title>转义</title>

</head>

<body>

自动转义：{{content}}

</body>

</html>

　　

  • 运行服务器，在浏览器中输入如下网址
http://127.0.0.1:8000/zhuanyi/
  • 转义后标记代码不会被直接解释执行，而是被直接呈现，防止客户端通过嵌入js代码攻击网站
  • 浏览效果如下图

关闭转义

  • 过滤器escape可以实现对变量的html转义，默认模板就会转义，一般省略
{{t1|escape}}

　　

  • 过滤器safe：禁用转义，告诉模板这个变量是安全的，可以解释执行
{{data|safe}}

　　

  • 修改templates/booktest/zhuanyi.html代码如下
<html>

<head>

    <title>转义</title>

</head>

<body>

自动转义：{{content}}

<hr>

过滤器safe关闭转义：{{content|safe}}

</body>

</html>

　　

  • 刷新浏览器后效果如下图

  • 标签autoescape：设置一段代码都禁用转义，接受on、off参数
{%autoescape off%}

...

{%endautoescape%}

　　

  • 修改templates/booktest/zhuanyi.html代码如下
<html>

<head>

    <title>转义</title>

</head>

<body>

自动转义：{{content}}

<hr>

过滤器safe关闭转义：{{content|safe}}

<hr>

标签autoescape关闭转义：

{%autoescape off%}

{{content}}

{%endautoescape%}

</body>

</html>

　　

  • 刷新浏览器后效果如下图

字符串字面值

  • 对于在模板中硬编码的html字符串，不会转义
  • 修改templates/booktest/zhuanyi.html代码如下
<html>

<head>

    <title>转义</title>

</head>

<body>

自动转义：{{content}}

<hr>

过滤器safe关闭转义：{{content|safe}}

<hr>

标签autoescape关闭转义：

{%autoescape off%}

{{content}}

{%endautoescape%}

<hr>

模板硬编码不转义：{{data|default:'<b>hello</b>'}}

</body>

</html>

　　

  • 刷新浏览器后效果如下图

  • 如果希望出现转义的效果，则需要手动编码转义

  • 修改templates/booktest/zhuanyi.html代码如下

<html>

<head>

    <title>转义</title>

</head>

<body>

自动转义：{{content}}

<hr>

过滤器safe关闭转义：{{content|safe}}

<hr>

标签autoescape关闭转义：

{%autoescape off%}

{{content}}

{%endautoescape%}

<hr>

模板硬编码不转义：{{data|default:'<b>hello</b>'}}

<hr>

模板硬编码手动转义：{{data|default:"<b>123</b>"}}

</body>

</html>

　　

  • 刷新浏览器后效果如下图

HTML转义的更多相关文章

  1. .NET 基础 一步步 一幕幕[运算符、占位符、转义符]

      运算符.占位符.转义符 好吧,在五局全胜之后,终于升到了三个钻,距离一个星星还有一大段距离,忽然想起来今天的博客还没写,果断坑队友,来写博客了....感觉以后还是每天更新一篇比较好.要不晚上就该熬 ...

  2. Unicode转义(\uXXXX)的编码和解码

    在涉及Web前端开发时, 有时会遇到\uXXXX格式表示的字符, 其中XXXX是16进制数字的字符串表示形式, 在js中这个叫Unicode转义字符, 和\n \r同属于转义字符. 在其他语言中也有类 ...

  3. java转换 HTML字符实体，java特殊字符转义字符串

    为什么要用转义字符串? HTML中<,>,&等有特殊含义(<,>,用于链接签,&用于转义),不能直接使用.这些符号是不显示在我们最终看到的网页里的,那如果我们希 ...

  4. SharePoint文档库文件夹特殊字符转义

    当我们在SharePoint网站文档库中新建文件夹时包含了~ " # % & * : < > ? / \ { | }字符时(一共15个), 或者以.开头或者结束,或者包含 ...

  5. 利用StringEscapeUtils对字符串进行各种转义与反转义（Java）

    apache工具包common-lang中有一个很有用的处理字符串的工具类,其中之一就是StringEscapeUtils,这个工具类是在2.3版本以上加上的去的,利用它能很方便的进行html,xml ...

  6. 阿里云提示：对输入参数id未进行正确类型转义，导致整型注入的发生

    类似以下提示: XXX.php中,对输入参数id未进行正确类型转义,导致整型注入的发生 解决办法: 找到对应文件:$id = $_GET['id']; 增加以下标红过滤: $id = $_GET['i ...

  7. Mysql字符转义

    在字符串中,某些序列具有特殊含义.这些序列均用反斜线('\')开始,即所谓的转义字符.MySQL识别下面的转义序列: \0 ASCII 0(NUL)字符. \' 单引号('''). \" 双 ...

  8. angularJS绑定数据时自动转义html标签

    angularJS在进行数据绑定时默认是会以文本的形式输出,也就是对你数据中的html标签不进行转义照单全收,这样提高了安全性,防止了html标签中的注入攻击,但有些时候还是需要的,特别是从数据库读取 ...

  9. java后台对前端输入的特殊字符进行转义

    转自:http://www.cnblogs.com/yangzhilong/p/5667165.html java后台对前端输入的特殊字符进行转义 HTML: 常见的帮助类有2个:一个是spring的 ...

  10. Linux Shell 通配符、元字符、转义符【转帖】

    作者:程默 说到shell通配符(wildcard),大家在使用时候会经常用到.下面是一个实例: 1   1 2 3 4 [chengmo@localhost ~/shell]$ ls a.txt  ...

随机推荐

  1. DKH大数据分析平台解决方案优势说明

    大数据技术的发展与应用已经在深刻地改变和影响我们的日常生活与工作,可以预见的是在大数据提升为国家战略层面后,未来的几年里大数据技术将会被更多的行业应用. 相信很多人对于大数据技术的应用还是处于一个非常 ...

  2. nginx和apache最核心的区别在于apache是同步多进程模型，一个连接对应一个进程；nginx是异步的，多个连接（万级别）可以对应一个进程

    nginx和apache的一些优缺点比较,摘自网络,加自己的一些整理. nginx相对于apache的优点: 1.轻量级,同样是web 服务,比apache 占用更少的内存及资源 2.抗并发,ngin ...

  3. linux中uptime命令查看linux系统负载

    阅读目录 uptime cat /proc/loadavg 何为系统负载呢? 进阶参考 uptime 另外还有一个参数 -V(大写),是用来查询版本的 [appdeploy@CNSZ22PL0088: ...

  4. 夜神模拟器+seleinm抓取手机app（参考资料集合）

    目前准备开始实现这个技术,将看起来还算可靠的参考链接粘贴如下: http://www.cnblogs.com/puresoul/p/4597211.html https://www.cnblogs.c ...

  5. 关于clearfix和clear的研究

    今天领导跟我说到这个问题,我上网找了些资料,已转载一篇文章到本博客(后一篇),摘自百度文库. ps:还有一种写法就是: CSS代码: .clearfix:after { content: " ...

  6. 1084 Broken Keyboard （20 分）

    1084 Broken Keyboard (20 分) On a broken keyboard, some of the keys are worn out. So when you type so ...

  7. oracle 年龄计算 岁 月 天

    select trunc(months/12) || '岁' || trunc(mod(months, 12)) || '月' ||       trunc(sysdate - add_months( ...

  8. Vuex 状态管理模式

    Vuex 是一个专为 Vue.js 设计的状态管理模式 vuex解决了组件之间同一状态的共享问题.当我们的应用遇到多个组件共享状态时,会需要: 多个组件依赖于同一状态.传参的方法对于多层嵌套的组件将会 ...

  9. 【RL前沿】深度强化学习的最新进展 by 2017.12.12

    作者:Volodymyr Mnih Google DeepMind科学家. 在Geoffrey Hinton的指导下完成了多伦多大学的机器学习博士学位. 在此之前,在Csab Szepesvari的指 ...

  10. Java反射机制 —— 简单了解

    一.概述 JAVA反射机制是在运行状态中,对于任意一个类,都能够知道这个类的所有属性和方法:对于任意一个对象,都能够调用它的任意一个方法和属性:这种动态获取的信息以及动态调用对象的方法的功能称为jav ...