SpringSecurity和wangeditor上传图片时403_wangeditor网络图片403-优快云博客

本文链接：https://blog.youkuaiyun.com/u014559071/article/details/85610194

本文介绍如何在SpringSecurity环境下使用wangeditor上传图片，并解决403错误问题。通过设置XMLHttpRequest对象的请求头，加入CSRF令牌，实现安全的图片上传功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

SpringSecurity和wangeditor上传图片时403

上传图片之前设置xhr

    editor.customConfig.uploadImgHooks = {
        before: function (xhr, editor, files) {
            **var token = $("meta[name='_csrf']").attr("content");
            var header = $("meta[name='_csrf_header']").attr("content");
            xhr.setRequestHeader(header, token);**
            // 图片上传之前触发
            // xhr 是 XMLHttpRequst 对象，editor 是编辑器对象，files 是选择的图片文件


        },
        success: function (xhr, editor, result) {

        },
        fail: function (xhr, editor, result) {
 
        },
        error: function (xhr, editor) {

        },
        timeout: function (xhr, editor) {

        },
        customInsert: function (insertImg, result, editor) {
            // 图片上传并返回结果，自定义插入图片的事件（而不是编辑器自动插入图片！！！）
            // insertImg 是插入图片的函数，editor 是编辑器对象，result 是服务器端返回的结果

            // 举例：假如上传图片成功后，服务器端返回的是 {url:'....'} 这种格式，即可这样插入图片：
            var url = result.data
            insertImg(url)

            // result 必须是一个 JSON 格式字符串！！！否则报错
        }
    }