超级简单的 html 转义与反转义 - Go语言中文社区

超级简单的 html 转义与反转义


目标 :

前后端通用,规范,实用的html转义与反转义

ps:

        网上这种的html转义与反转义博客太多了,并且也更有各的简介,好处是理解的深入,但是不容易统一规范,个人更倾向于规范。加上StringEscapeUtils的转义会把汉字也转义,有的时候也用的不方便,所以采用前端 underscore.js的通用工具类转义。

解决方案

1.前端采用 underscore.js 的_.escape(str) 
    如果不愿意集成这个js的可以采用下载源码1.8版本,把1342行到1356行copy出来用function就可以
2.后端根据_.escape(str) 源码编写一套相同的转义。 已经写好可以文章后自行下载

为什么这么解决呢?
是因为前后端通用,且规范

代码

1.前端

    <script type="text/javascript" src="js/lib/underscore/underscore.js"></script>
    <script>
        var source = "<font>chen磊  xing</font>";
        console.log(source);
        console.log(_.escape(source));
        console.log(_.unescape(_.escape(source)));
    </script>

这里写图片描述

2.后端

 package com.fanfan.util;

import org.apache.commons.lang.StringEscapeUtils;

/**
 * 学习一下 前端Underscorejs 的 思想
 * 
 * @ClassName UnderscoreUtil
 * @author <a href="892042158@qq.com" target="_blank">于国帅</a>
 * @date 2018年8月12日 下午8:02:20
 *
 */
public class _ {
    /**
     * var escapeMap = { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#x27;', '`': '&#x60;' };
     * 
     * @Title htmlEncode
     * @author 于国帅
     * @date 2018年8月12日 下午8:05:47
     * @param source
     * @return String
     */
    public static String escape(String source) {
        if (source == null) {
            return source;
        }
        StringBuffer buffer = new StringBuffer();
        char c = ' ';
        for (int i = 0; i < source.length(); i++) {
            c = source.charAt(i);
            switch (c) {
                case '&':
                    buffer.append("&amp;");
                    break;
                case '<':
                    buffer.append("&lt;");
                    break;
                case '>':
                    buffer.append("&gt;");
                    break;
                case '"':
                    buffer.append("&quot;");
                    break;
                case ''':
                    buffer.append("#x27;");
                    break;
                case '`':
                    buffer.append("&#x60");
                    break;
                default:
                    buffer.append(c);
            }
        }
        return buffer.toString();
    }

    public static void main(String[] args) {
        String source = "<font>chen磊  xing</font>";
        System.err.println("StringEscapeUtils的转义   汉字也会被转义");
        System.err.println(StringEscapeUtils.escapeHtml(source));
        System.err.println("模拟 underscore.js的转义");
        System.err.println(_.escape(source));

    }
}

控制台打印
这里写图片描述

版权声明:本文来源CSDN,感谢博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
原文链接:https://blog.csdn.net/mengxiangxingdong/article/details/82418880
站方申明:本站部分内容来自社区用户分享,若涉及侵权,请联系站方删除。
  • 发表于 2021-06-13 11:02:22
  • 阅读 ( 559 )
  • 分类:前端

0 条评论

请先 登录 后评论

官方社群

GO教程

猜你喜欢