Ueditor富文本编辑器--上传图片自定义上传操作

最近负责将公司官网从静态网站改版成动态网站，方便公司推广营销人员修改增加文案，避免官网文案维护过于依赖技术人员。在做后台管理系统时用到了富文本编辑器Ueditor，因为公司有一个阿里云文件资源服务器，而Ueditor默认将上传图片上传到本地服务器，所以自己也是网上查了很多资料，最终解决了这个问题。这里使用到的Ueditor版本为net版

对于Ueditor的配置使用，我就不多说了。这里只讲如何上传图片到远程服务器上

配置好Ueditor之后，打开ueditor/App_Code/ListFileHandler.cs

ueditor上传图片后都会调用到这里面的一个方法——Process()，进行文件上传保存到本地处理



public override void Process()

    {

        uploadImg();//我们直接在方法的最前面自定义一个方法，只让它执行自定义方法里的逻辑

        return；

        try

        {

            Start = String.IsNullOrEmpty(Request["start"]) ? 0 : Convert.ToInt32(Request["start"]);

            Size = String.IsNullOrEmpty(Request["size"]) ? Config.GetInt("imageManagerListSize") : Convert.ToInt32(Request["size"]);

        }

        catch (FormatException)

        {

            State = ResultState.InvalidParam;

            WriteResult();

            return;

        }

        var buildingList = new List<String>();

        try

        {

            var localPath = Server.MapPath(PathToList);

            buildingList.AddRange(Directory.GetFiles(localPath, "*", SearchOption.AllDirectories)

                .Where(x => SearchExtensions.Contains(Path.GetExtension(x).ToLower()))

                .Select(x => PathToList + x.Substring(localPath.Length).Replace("\\", "/")));

            Total = buildingList.Count;

            FileList = buildingList.OrderBy(x => x).Skip(Start).Take(Size).ToArray();

        }

        catch (UnauthorizedAccessException)

        {

            State = ResultState.AuthorizError;

        }

        catch (DirectoryNotFoundException)

        {

            State = ResultState.PathNotFound;

        }

        catch (IOException)

        {

            State = ResultState.IOError;

        }

        finally

        {

            WriteResult();

        }

    }

//这个自定义方法就可以写上我们自己要上传的服务器代码了

private void uploadImg()

{

    //此处执行上传到远程服务器的代码

}

上传图片成功后，编辑器会自动返回一个路径，这里我们需要修改ueditor的config.json文件

这里的imageUrlPrefix的配置我们该为“”，这样我们返回的字符串路径就不会加上什么前缀，导致图片路径错误

这个上传图片的操作，我们剪切图片复制粘贴到编辑器里，编辑器处理截图的操作也会调用这里的方法，通过这个方法将所截图上传到对应的服务器上

巴特西

Ueditor富文本编辑器--上传图片自定义上传操作

最新文章

热门文章