前后端防XSS、SQL、CORS

灰太狼 2021-11-05 19:02 293阅读 0赞

**后端：**

1、filter拦截(过滤器)

<filter>
    		<filter-name>traceIdFilter</filter-name>
    		<filter-class>com.citydo.xclouddesk.servlet.TraceIdFilter</filter-class>
    		<async-supported>true</async-supported>
    	</filter>
    
    	<filter-mapping>
    		<filter-name>traceIdFilter</filter-name>
    		<url-pattern>/*</url-pattern>
    	</filter-mapping>

public class TraceIdFilter implements Filter {
    
    
        @Override
        public void init(FilterConfig filterConfig) throws ServletException {
    
        }
    
        @Override
        public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
            HttpServletRequest httpServletRequest = (HttpServletRequest)servletRequest;
            HttpServletResponse httpServletResponse = (HttpServletResponse)servletResponse;
            //TODO 编写验证逻辑
            httpServletResponse.addHeader("Cache-Control","no-cache");
            filterChain.doFilter(servletRequest, servletResponse);
        }
    
        @Override
        public void destroy() {
    
        }
    }

@Configuration
    public class FilterConfig {
    
        @Autowired
        private TraceIdFilter traceIdFilter ;
    
        @Bean
        public FilterRegistrationBean registerAuthFilter() {
            FilterRegistrationBean registration = new FilterRegistrationBean();
             //注入过滤器
            registration.setFilter(traceIdFilter );
            //拦截规则
            registration.addUrlPatterns("/*");
              //过滤器名称
            registration.setName("traceIdFilter ");
             //是否自动注册 false 取消Filter的自动注册
            registration.setEnabled(false);
             //值越小，Filter越靠前。
            registration.setOrder(1); 
            return registration;
        }
    }

2、采用jsoup过滤组件

<dependency>
                <groupId>org.jsoup</groupId>
                <artifactId>jsoup</artifactId>
                <version>1.9.2</version>
            </dependency>

package com.citydo.xclouddesk.utils;
    
    
    import org.apache.commons.lang3.StringUtils;
    import org.jsoup.Jsoup;
    import org.jsoup.nodes.Document;
    import org.jsoup.safety.Whitelist;
    import java.io.IOException;
    
    /**
     * xss非法标签过滤工具类
     * 过滤html中的xss字符
     */
    public class JsoupUtil {
    
        /**
         * 使用自带的basicWithImages 白名单
         * 允许的便签有a,b,blockquote,br,cite,code,dd,dl,dt,em,i,li,ol,p,pre,q,small,span,
         * strike,strong,sub,sup,u,ul,img
         * 以及a标签的href,img标签的src,align,alt,height,width,title属性
         */
        private static final Whitelist whitelist = Whitelist.basicWithImages();
        /** 配置过滤化参数,不对代码进行格式化 */
        private static final Document.OutputSettings outputSettings = new Document.OutputSettings().prettyPrint(false);
    
        static {
            // 富文本编辑时一些样式是使用style来进行实现的
            // 比如红色字体 style="color:red;"
            // 所以需要给所有标签添加style属性
            whitelist.addAttributes(":all", "style");
        }
    
        public static String clean(String content) {
            if(StringUtils.isNotBlank(content)){
                content = content.trim();
            }
            return Jsoup.clean(content, "", whitelist, outputSettings);
        }
    
        public static void main(String[] args) throws IOException {
            String text = "   <a href=\"http://www.baidu.com/a\" οnclick=\"alert(1);\">1</a><script>alert(1);</script>";
            System.out.println(clean(text));
        }
    }

**前端：**

1、js-xss

开源地址:  
[https://www.npmjs.com/package/xss][https_www.npmjs.com_package_xss]  
安装 NPM

npm install xss

使用方法、在Node.js的中使用

var xss = require('xss');
    var html = xss('<script>alert("xss");</script>');
    console.log(html);

在浏览器端使用、沉模式（参考文件test/test.html）：

XSS攻击详解：

2、[https://segmentfault.com/a/1190000016551188][https_segmentfault.com_a_1190000016551188]

CROS：

CORS定义一种跨域访问的机制，可以让AJAX实现跨域访问。CORS 允许一个域上的网络应用向另一个域提交跨域 AJAX 请求。实现此功能非常简单，只需由服务器发送一个响应标头即可。

解决CORS：

JSONP：利用script标签可跨域的特点，在跨域脚本中可以直接回调当前脚本的函数。  
CORS：服务器设置HTTP响应头中Access-Control-Allow-Origin值，解除跨域限制。  
NGINX：反向代理、白名单、或者正则拦截。  
F5：反向代理、白名单、或者正则拦截。

[https_www.npmjs.com_package_xss]: https://www.npmjs.com/package/xss
[https_segmentfault.com_a_1190000016551188]: https://segmentfault.com/a/1190000016551188