simditor编辑器对接自己的第三方图片仓库

技术控 Loading... 阅读

找到对应的文件,发现原本的代码是获取本程序提供的uploads上传接口,把原来的代码复制一份保存一下,之后直接上手修改。

对应代码:

原本的代码:

                editor.uploader.on('beforeupload', function (e, file) {
                    var formData = new FormData();
                    formData.append("files[]",file.obj);
                    $.ajax({
                        url:file.url,
                        type:'post',
                        data: formData,
                        contentType: false,
                        processData: false,
                        success:function(res){
                            if (res.code==200) {
                                editor.uploader.trigger("uploadsuccess", [file, {success: true, file_path: res.data[0].path}]);
                            } else {
                                layer.msg("上传失败");
                            }
                        }
                    })
                    return false;
                });

修改后的代码:

                editor.uploader.on('beforeupload', function (e, file) {
                    window.wpActiveEditor = null;
                    var formData = new FormData();
                    formData.append("file",file.obj);
                    formData.append('token', 'xxxxxxxxxxxxxxxxxxxxxxx');
                    $.ajax({
                        async:true,
                        crossDomain:true,
                        url:'https://pic.ooooo.cn/api/upload',
                        type : 'POST',
                        processData : false,
                        contentType : false,
                        data:formData,
                        success:function(res){
                            if (res.code==200) {
                                editor.uploader.trigger("uploadsuccess", [file, {success: true, file_path: res.data.url}]);
                            } else {
                                layer.msg("上传失败");
                            }
                           
                        }
                    })
                    return false;
                });

按照原来的格式返回上传完成的获取到的完整图片url,从而实现后台simditor编辑器对接到我们自己的第三方图片仓库。

效果图片:

simditor编辑器对接自己的第三方图片仓库

这个功能我之前已经使用过,挺好用的,找个备案域名把所有图片集中放在国内机器上,网站和图片完全分离,每周备份一次网站程序,每天备份一次网站数据就行。图片不需要管,集中管理保存好ftp空间的秘钥就行,把图床的删除功能去除,这下子只能通过ftp或者网站面板管理图片。

目前只在simditor编辑器上测试成功,后期再看看wangEditor编辑器,目前几个编辑器中我比较喜欢wangEditor这个编辑器。

不过按照这个格式还是不够理想,我的想法是返回的内容直接格式化对齐,在wordpress上上传图片会直接对齐格式化并生成图箱,目前这个程序也是可以实现的,需要使用到php代码来规范一下,后续再改了,目前就这样。

Tags:

版权声明:若无特殊注明,本文皆为《书蓝画青》原创,转载务必保留文章来源。

本文链接:simditor编辑器对接自己的第三方图片仓库 & https://boke.slhq.cn/1855.html

推荐阅读
分享