百度编辑器上传视频php,百度ueditor编辑器文件视频图片直传OSS - 04)：附件直传OSS修改案例...

第一步：

写好获取直传oss所需要参数的接口，不懂的可以去看oss官网上的文档web直接oss

第二步：

前段页面引入插件、启动插件，并传入获取oss直传所需参数的接口地址

如：

无标题文档

var server_url = "{:url('alioss/get',['type'=>4])}";

var editor = UE.getEditor('container',{server_url:server_url});

第三步：

修改相关js代码段实现附件直传OSS，找到ueditor\dialogs\attachment\attachment.js查找内容修改：

/****************************************************************/

/*********   附件直传OSS修改(共有5处修改，第1处修改)   ********/

/***********************本段修改开始*****************************/

/*    新代码    */

OssSign = null,

/***********************本段修改结束*****************************/

/****************************************************************/

/*********   附件直传OSS修改(共有5处修改，第2处修改)   ********/

/***********************本段修改开始*****************************/

/*    原代码    */

// server: actionUrl,

// fileVal: editor.getOpt('imageFieldName'),

/*    新代码    */

fileVal: 'file',

/***********************本段修改结束*****************************/

/****************************************************************/

/*********   附件直传OSS修改(共有5处修改，第3处修改)   ********/

/***********************本段修改开始*****************************/

/*    原代码    */

// uploader.on('all', function (type, files) {

//     switch (type) {

//         case 'uploadFinished':

//             setState('confirm', files);

//             break;

//         case 'startUpload':

//             /* 添加额外的GET参数 */

//             var params = utils.serializeParam(

//    editor.queryCommandValue('serverparam')) || '',

//                 url = utils.formatUrl(actionUrl +

//    (actionUrl.indexOf('?') == -1 ? '?':'&') + 'encode=utf-8&' + params);

//             uploader.option('server', url);

//             setState('uploading', files);

//             break;

//         case 'stopUpload':

//             setState('paused', files);

//             break;

//     }

// });

/*    新代码    */

uploader.on('all', function (type, files) {

switch (type) {

case 'uploadFinished':

setState('confirm', files);

break;

case 'startUpload':

uploader.option('server', OssSign['host']);

setState('uploading', files);

break;

case 'stopUpload':

setState('paused', files);

break;

}

});

/***********************本段修改结束*****************************/

/****************************************************************/

/*********   附件直传OSS修改(共有5处修改，第4处修改)   ********/

/***********************本段修改开始*****************************/

/*    原代码    */

// uploader.on('uploadBeforeSend', function (file, data, header) {

//     //这里可以通过data对象添加POST参数

//     header['X_Requested_With'] = 'XMLHttpRequest';

// });

/*    新代码    */

uploader.on('uploadBeforeSend', function (file, data, header) {

// 获取新的文件名(这里只是为了每上传一个文件的名称都不一样)

$.get(editor.getOpt('server_url'), {}, function (sign) {

OssSign = JSON.parse(sign);

});

// 休眠0.1秒(休眠是为了让上面的先获取成功文件名)

var now = new Date();

var exitTime = now.getTime() + 100;

while (true) {

now = new Date();

if (now.getTime() > exitTime){

break;

}

}

// 获取文件后缀

var fileext = data.name ? data.name.substr(data.name.lastIndexOf('.')):'.jpeg';

data = $.extend(data, {

'OSSAccessKeyId': OssSign['accessid'],

'policy': OssSign['policy'],

'Signature': OssSign['signature'],

'key': OssSign['filename'] + fileext,

'success_action_status': '200',

'callback': OssSign['callback']

});

file.path = OssSign['filename'] + fileext;

});

/***********************本段修改结束*****************************/

/****************************************************************/

/*********   附件直传OSS修改(共有5处修改，第5处修改)   ********/

/***********************本段修改开始*****************************/

/*    原代码    */

// $upload.on('click', function () {

//     if ($(this).hasClass('disabled')) {

//         return false;

//     }

//     if (state === 'ready') {

//         uploader.upload();

//     } else if (state === 'paused') {

//         uploader.upload();

//     } else if (state === 'uploading') {

//         uploader.stop();

//     }

// });

/*    新代码    */

start = function () {

if (state === 'ready') {

uploader.upload();

} else if (state === 'paused') {

uploader.upload();

} else if (state === 'uploading') {

uploader.stop();

}

};

$upload.on('click', function () {

if ($(this).hasClass('disabled')) {

return false;

}

if (!OssSign) {

$.get(editor.getOpt('server_url'), {}, function (sign) {

OssSign = JSON.parse(sign);

uploader['options']['server'] = OssSign['host'];

start();

});

} else {

start();

}

});

/***********************本段修改结束*****************************/

至此附件直传OSS已经可以了

浏览器启用弹出窗口过滤功能，将无法跳转到下载页。在浏览器地址栏右边符号提示处点击允许就可以了！

郑重声明：

1、本站源码仅供个人学习研究和交流使用，请于下载后二十四小时内删除

2、本站大多资源来源于互联网、用户分享，仅供学习交流使用，本站不提供任何技术支持

3、本站联系方式Email：admin@youhutong.com ，收到邮件会第一时间处理。

4、如侵犯到任何版权问题，请立即告知本站(立即在线告知)，本站将及时删除并致以最深的歉意