UEditor中为图片上传等添加自定义请求参数
微wx笑
2020-05-13【在线工具】
8
0关键字：
UEditor
官方文档中的做法：参考：自定义请求参数，存在一个问题，就是参数是以Get方式传递的。自定义请求参数很多情境下，编辑器与后台通信需要有登录状态，很多时候后台需要额外的参数。 UEdi
官方文档中的做法：
参考：自定义请求参数，存在一个问题，就是参数是以Get方式传递的。
自定义请求参数
很多情境下，编辑器与后台通信需要有登录状态，很多时候后台需要额外的参数。 UEditor 自1.4.0版本提供设置额外参数的命令serverparam命令，可动态设置自定义参数表。 在向后台发出请求时，会把参数表以GET方式加到请求里。
另外，编辑器上传使用webuploader插件，在低版本的ie下，浏览器使用Flash形式的上传。 flash发送的请求不带有cookie，这里也需要额外的参数，让后台判断是否登录。
设置自定义参数表
通过serverparam命令设置自定义参数表，有四种调用方式，看下面的例子（下文的ue指编辑器实例）：
/* 1.传入函数,命令里执行该函数得到参数表,添加到已有参数表里 */ue.ready(function() {
ue.execCommand('serverparam', function(editor) {
return {
'key': 'value'
};
}
};});
/* 2.传入参数表,添加到已有参数表里 */ue.ready(function() {
ue.execCommand('serverparam', {
'key': 'value'
});});
/* 3.按照键值添加参数 */ue.ready(function() {
ue.execCommand('serverparam', 'key', 'value');});
/* 4.清除参数表 */ue.ready(function() {
ue.execCommand('serverparam'
};});
查询自定义参数表
前端发出请求时，会通过queryCommandValue方法，查询当前自定义参数表，把参数表以GET方式加到请求里：
ue.ready(function() {
ue.queryCommandValue('serverparam'); //返回参数值键值对的对象});
使用例子
var ue = UE.getEditor('container');ue.ready(function() {
ue.execCommand('serverparam', {
'key1': 'value1',
'key2': 'value2',
});});
提交请求的时候会把key1和key2一起以GET的方式发送到后台。后台再通过$GET["key1"]和$GET["key2"]获取key1和key2的值。
网上的其它做法：
本例中用的是uEditor 1.3.6版本，以为图片上传添加动态自定义参数为例，后台用.Net
第一步：修改ueditor.config.js文件，为window.UEDITOR_CONFIG添加参数代码如下
...................................
window.UEDITOR_CONFIG = {
newsID: 0,//添加自定义参数newsID
//为编辑器实例添加一个路径，这个不能被注释
UEDITOR_HOME_URL : URL
..................................................
}第二步：修改UEditor1.3.6\dialogs\image\image.html
imageUploader.init(flashOptions, callbacks);
$G("upload").onclick = function() {
if (!savePathComplete) {
alert('请等待保存目录就绪!')
return;
}
/**
* 接口imageUploader.setPostParams()可以在提交时设置本次上传提交的参数（包括所有图片）
* 参数为json对象{"key1":"value1","key2":"value2"}，其中key即为向后台post提交的name，value即为值。
* 其中有一个特殊的保留key值为action，若设置，可以更改本次提交的处理地址
*/
var postParams = {
"dir": baidu.g("savePath").value,
"NewsID": editor.options.newsID //添加参数“NewsID”
};
imageUploader.setPostParams(postParams);
flashObj.upload();
this.style.display = "none";
$G("savePath").parentNode.style.display = "none";
};
});第三部：后台获取NewsID
var newsID = cxt.Request.Form["NewsID"];
第四步：构造编辑器是传入参数
baidu.editor.ui.Editor({ newsID: __newsID}).render('text');UE.getEditor('newstext').execCommand('serverparam', 'titleBase64', getTitle(30));
//自定义请求参数
newstext.ready(function(){
newstext.execCommand('serverparam',{
'filepass':'1341',//修改时候是信息ID
'classid' :'30',
'qiantai':0});
newstext.setContent("文章内容", false);
});本文由 微wx笑 创作，采用 署名-非商业性使用-相同方式共享 4.0 许可协议，转载请附上原文出处链接及本声明。
原文链接：https://www.ivu4e.cn/toolbox/online/2020-05-13/439.html
