分为两步：

1.get请求的时候渲染xsrf数据：this.Data["xsrf_token"] = this.XSRFToken()

2.html中分为两步:

  • html中首先在meta中设置_xsrf，值为后端传的xsrf_token：

            <meta name="_xsrf" content="{{.xsrf_token}}" />

  • ajax提交的时候先对ajax进行扩展


    具体代码如下：

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="_xsrf" content="{{.xsrf_token}}" />
    <title>Title</title>
    <script src="/static/js/jquery.min.js"></script>
</head>
<body>

test_xsrf 页面

<form>
    <input type="button" value="提交" id="btn">
</form>


<script>
    // 对ajax进行扩展
    var ajax = $.ajax;
    $.extend({
        ajax: function(url, options) {
            if (typeof url === 'object') {
                options = url;
                url = undefined;
            }
            options = options || {};
            url = options.url;
            var xsrftoken = $('meta[name=_xsrf]').attr('content');
            var headers = options.headers || {};
            var domain = document.domain.replace(/\./ig, '\\.');
            if (!/^(http:|https:).*/.test(url) || eval('/^(http:|https:)\\/\\/(.+\\.)*' + domain + '.*/').test(url)) {
                headers = $.extend(headers, {'X-Xsrftoken':xsrftoken});
            }
            options.headers = headers;
            return ajax(url, options);
        }
    });

    // ajax提交部分，和原来使用ajax的方式没有区别
    var btn = document.getElementById("btn");
    btn.onclick = function (ev) {
       
     $.ajax({
                url:"/test_do_ajax_xsrf",
                type:"POST",
                data:{},
                success:function (data) {
                    if(data["code"] == 200){
                        alert(data["msg"])
    
                    }
                },
                error:function (data) {
                    alert(data["message"])
                }
     })
   }
</script>
</body>
</html>