zoukankan      html  css  js  c++  java
  • UEditor跨域上传图片文件配置说明

    1.修改ueditor.config.js 后台接收地址

    // 服务器统一请求接口路径
       , serverUrl: "http://xxxxx/Utility/UEditor"

    2.服务器配置对于的接收程序:
    1).设置服务器允许跨域:

     <system.webServer>
       <httpProtocol>
          <customHeaders>
            <add name="Access-Control-Allow-Origin" value="*" />
            <add name="Access-Control-Allow-Headers" value="*" />
            <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
          </customHeaders>
        </httpProtocol>
      </system.webServer>

    2).修改config中config.json 文件返回的图片访问路径,不然上传图片后无法展示,其他路径依次修改

      

    3).收到包含callback的请求action,必须把 callback返回,不然 警告Cross-Origin Read Blocking (CORB) blocked cross-origin response,导致按钮无妨点击,文件列表无法显示

    string callback = Request["callback"];
    return Content(callback + "(" + 返回的Json+ ")");

    3.上传图片成功,但是一直提示上传失败,需修改本地ueditor.all.js,修改后注意页面是否引用ueditor.all.js而不是ueditor.all.min.js

    //  domUtils.on(iframe, 'load', callback);
    // form.action = utils.formatUrl(imageActionUrl + (imageActionUrl.indexOf('?') == -1 ? '?':'&') + params);
    //form.submit();
                    function ajaxUploadFile(url, form) {
                        $.ajax({
                            cache: true,
                            type: "POST",
                            url: url,
                            data: new FormData(form),// 你的formid
                            processData: false,
                            contentType: false,
                            error: function (request) {
                                console.log(22);
                            },
                            success: function (json) {
                                var link, loader,
                                    body = (iframe.contentDocument || iframe.contentWindow.document).body,
                                    result = body.innerText || body.textContent || '';
                                var json = eval('('+json+')');
                                link = me.options.imageUrlPrefix + json.url;
                                if (json.state == 'SUCCESS' && json.url) {
                                    loader = me.document.getElementById(loadingId);
                                    loader.setAttribute('src', link);
                                    loader.setAttribute('_src', link);
                                    loader.setAttribute('title', json.title || '');
                                    loader.setAttribute('alt', json.original || '');
                                    loader.removeAttribute('id');
                                    domUtils.removeClasses(loader, 'loadingclass');
                                } else {
                                    showErrorLoader && showErrorLoader(json.state);
                                }
                                form.reset();
                            }
                        });
                    }
                    var action = utils.formatUrl(imageActionUrl + (imageActionUrl.indexOf('?') == -1 ? '?' : '&') + params);
                    ajaxUploadFile(action, form);

    完美解决UEditor跨域上传遇到的问题

  • 相关阅读:
    NET5 WebApi 解决跨域问题
    CentOS7安装MYSQL
    VMWare安装CentOS7
    MSSQL还原数据库,更改用户登陆权限
    Vue自定义页面路由
    解决VSCODE"因为在此系统上禁止运行脚本"报错
    简析 HTTP 2.0 多路复用
    Git放弃本地修改,强制拉取最新版
    eclipse安装OpenExplorer插件--快速打开文件目录
    git统计某段时间内代码的修改量/总代码量
  • 原文地址:https://www.cnblogs.com/BillBlog/p/12618565.html
Copyright © 2011-2022 走看看