php ueditor自定义请求地址,Ueditor实现自定义conttoller请求或跨域请求

本文介绍了如何将Ueditor的图片上传功能配置为保存到远程服务器,通过重写`getActionUrl`方法设置上传地址,并展示了上传成功后返回的JSON格式,包括解决图片中文名乱码的方法,涉及对返回值的处理和编码转换。
摘要由CSDN通过智能技术生成

UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码。我们在做网站文字编辑的时候会经常用到它。但是ueditor默认支持保存图片在网站的根目录下面。但是,对于网站来说,我们大多数的时候都要把静态资源保存到另外的服务器上,与应用服务器分开,以增加网站的性能

下面介绍一下这个方法:

一,

ueditor 1.4.2+ 推荐使用唯一的请求地址,通过GET参数action指定不同请求类型。 但很多用户都希望使用自己写好的上传地址,下面提供一种解决方法: 由于所有ueditor请求都通过editor对象的getActionUrl方法获取请求地址,可以直接通过复写这个方法实现,把这段js单独写到一个js中,加入的网页,并且在放在引用uditor的js之后。例子如下:

UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;

UE.Editor.prototype.getActionUrl = function(action) {

if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {

return 'http://a.b.com/upload.php';

} else if (action == 'uploadvideo') {

return 'http://a.b.com/video.php';

} else {

return this._bkGetActionUrl.call(this, action);

}

}

action类型以及说明

uploadimage://执行上传图片或截图的action名称

uploadscrawl://执行上传涂鸦的action名称

uploadvideo://执行上传视频的action名称

uploadfile://controller里,执行上传视频的action名称

catchimage://执行抓取远程图片的action名称

listimage://执行列出图片的action名称

listfile://执行列出文件的action名称

把上面的返回地址换成自己的controller地址或跨域地址就可以了

二,定义返回值的格式

由于ueditor是使用ajax的请求的,所以返回的格式是一个json串。格式如下:

{

"state": "SUCCESS",

"url": "upload/demo.jpg",

"title": "demo.jpg",

"original": "demo.jpg",

"type":".jpg",

"size" :"1024"

}

其中type是图片的类型;size是图片的大小,url就是图片插入到ueditor中的图片可访问的地址

我们还有另外一种方式知道返回的格式,就是在ueditor默认的配置情况下,看一下上传图片后成功的返回值格式就可以了。在浏览器上按下f12,点network->response

三,图片中文名返回乱码的解决方案

当图片的名字是中文的时候,返回的结果中中文却是乱码,比如:???;就算是配置了所有的编码是utf8之后也不可以。这是因为在显示的时候ueditor是按unicode方式显示的。这个时候我们需要把返回结果的json串转成unicode格式,如下:

(1) 接收图片的controller:

[java] view plain copy

package com.gametech.controller;

import java.io.File;

import java.io.IOException;

import java.util.Iterator;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import org.springframework.stereotype.Controller;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.ResponseBody;

import org.springframework.web.multipart.MultipartFile;

import org.springframework.web.multipart.MultipartHttpServletRequest;

import org.springframework.web.multipart.commons.CommonsMultipartResolver;

import com.alibaba.fastjson.JSON;

import com.gametech.entity.ReturnUpLoadImage;

import com.gametech.utils.StringUtils;

@Controller

@RequestMapping("upload")

public class UploadController {

/**

@return

*/

@RequestMapping("upImage")

@ResponseBody

public String upImage(HttpServletRequest request, HttpServletResponse response) {

// 创建一个通用的多部分解析器

CommonsMultipartResolver multipartResolver = new CommonsMultipartResolver(

request.getSession().getServletContext());

String[] filenames = null;

// 判断 request 是否有文件上传,即多部分请求

//{"state": "SUCCESS","title": "1437299650668072896.jpg","original": "rdn_508f4a9624572.jpg","type": ".jpg","url": "/ueditor/upload/image/20150719/1437299650668072896.jpg","size": "14262"}

ReturnUpLoadImage upLoadImage = new ReturnUpLoadImage();

upLoadImage.setUrl("upload/1.jpg");

if (multipartResolver.isMultipart(request)) {

// 转换成多部分request

//MultipartHttpServletRequest multiRequest = multipartResolver.resolveMultipart(request);

[java] view plain copy

MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;

filenames = new String[multiRequest.getFileMap().size()];

// 取得request中的所有文件名

Iterator iter = multiRequest.getFileNames();

int i = 0;

while (iter.hasNext()) {

// 记录上传过程起始时的时间,用来计算上传时间

int pre = (int) System.currentTimeMillis();

// 取得上传文件

MultipartFile file = multiRequest.getFile(iter.next());

if (file != null) {

// 取得当前上传文件的文件名称

String myFileName = file.getOriginalFilename();

upLoadImage.setOriginal(myFileName);

// 如果名称不为“”,说明该文件存在,否则说明该文件不存在

if (myFileName.trim() != "") {

System.out.println(myFileName);

// 重命名上传后的文件名

String fileName = "demoUpload" + file.getOriginalFilename();

upLoadImage.setTitle(fileName);

filenames[i] = fileName;

i++;

// 定义上传路径

String path = "E:/" + fileName;

File localFile = new File(path);

try {

file.transferTo(localFile);

} catch (IllegalStateException e) {

// TODO Auto-generated catch block

e.printStackTrace();

} catch (IOException e) {

// TODO Auto-generated catch block

e.printStackTrace();

}

}

}

// 记录上传该文件后的时间

int finaltime = (int) System.currentTimeMillis();

System.out.println(finaltime - pre);

}

}

upLoadImage.setType(".jpg");

upLoadImage.setSize("1024");

String result = JSON.toJSONString(upLoadImage);

result = StringUtils.chinaToUnicode(result);

return result;

//return "{\"state\": \"SUCCESS\",\"title\": \"1437300241099035569.jpg\",\"original\": \"QQ\u622a\u56fe20150327230133.jpg\",\"type\": \".jpg\",\"url\": \"/ueditor/upload/image/20150719/1437300241099035569.jpg\",\"size\": \"463908\"}";

}

}

(2) 中文转unicode方法

[java] view plain copy

/**

把中文转成Unicode码

@param str

@return

*/

public static String chinaToUnicode(String str){

String result="";

for (int i = 0; i < str.length(); i++){

int chr1 = (char) str.charAt(i);

if(chr1>=19968&&chr1<=171941){//汉字范围 \u4e00-\u9fa5 (中文)

result+="\u" + Integer.toHexString(chr1);

}else{

result+=str.charAt(i);

}

}

return result;

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值