国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

Spring+Vue整合UEditor富文本實現(xiàn)圖片附件上傳

luzhuqun / 2256人閱讀

摘要：下載下載完整源碼和版本后端集成解壓完整源碼，拷貝目錄下的源碼，到后端目錄下源碼集成后端配置解壓版本拷貝目錄下放到項目的目錄下，在這里是配置文件名稱，這里是項目常量配置文件新建，也放在目錄下，文件內(nèi)容如下地址文件上傳服務器地址端口普通圖片上傳

下載UEditor 
https://ueditor.baidu.com/web...

下載完整源碼和JSP版本

Spring后端集成 1. 解壓完整源碼，拷貝jsp目錄下的java源碼，到spring mvc后端 

jsp目錄下java源碼

集成spring mvc后端
2. 配置config.json

解壓JSP版本

拷貝jsp目錄下config.json

放到java項目的resource目錄下，在這里是ueditorConfig.json

配置config.json文件名稱，這里是ueditorConfig.json

3. 項目常量配置文件

新建upload.properties，也放在resouce目錄下，文件內(nèi)容如下：

#host地址
host=http://localhost:8081/ssm_project
#文件上傳服務器地址（ip+端口）
uploadHost=http://localhost:8090/
#普通圖片上傳保存目錄
imagePath = fileUpload/image/
#系統(tǒng)用戶頭像上傳保存目錄
headImgPath = fileUpload/image/headImg/
#系統(tǒng)用戶默認頭像
sysUserDefImg = sysUser-default.jpg
#文本文件上傳保存目錄
documentPath = fileUpload/document/
#音頻文件上傳保存目錄
soundPath = fileUpload/sound/
#視頻文件上傳保存目錄
videoPath = fileUpload/video/
#ueditor編輯器上傳文件保存目錄（包括圖片、視頻、音頻、文本等文件）
ueditor = fileUpload/ueditor/

將upload.properties添加到Spring啟動配置文件application.xml中，以便后面Controller訪問



    
        
            classpath:config.properties
            classpath:redis.properties
            classpath:upload.properties
4. 編寫工具類UploadUtil.java 
package cn.lega.common.util;

import com.sun.jersey.api.client.Client;
import com.sun.jersey.api.client.WebResource;
import org.apache.commons.io.FilenameUtils;
import org.springframework.util.FileCopyUtils;
import org.springframework.web.multipart.MultipartFile;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.File;
import java.io.IOException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.UUID;

public class UploadUtil {
    /**
     * 上傳文件
     *
     * @param request
     * @param response
     * @param serverPath 服務器地址:(http://172.16.5.102:8090/)
     * @param path       文件路徑（不包含服務器地址：upload/）
     * @return
     */
    public static String upload(Client client, MultipartFile file, HttpServletRequest request, HttpServletResponse response, String serverPath, String path) {
        // 文件名稱生成策略（日期時間+uuid ）
        UUID uuid = UUID.randomUUID();
        Date d = new Date();
        SimpleDateFormat format = new SimpleDateFormat("yyyyMMddHHmmss");
        String formatDate = format.format(d);
        // 獲取文件的擴展名
        String extension = FilenameUtils.getExtension(file.getOriginalFilename());
        // 文件名
        String fileName = formatDate + "-" + uuid + "." + extension;
        //相對路徑
        String relaPath = path + fileName;

//        String a = serverPath + path.substring(0, path.lastIndexOf("/"));
//        File file2 = new File(a);
//        if (!file2.exists()) {
//            boolean mkdirs = file2.mkdirs();
//            System.out.println(mkdirs);
//        }

        // 另一臺tomcat的URL（真實路徑）
        String realPath = serverPath + relaPath;
        // 設置請求路徑
//        WebResource resource = client.resource(realPath);

        // 發(fā)送開始post get put（基于put提交）
//        try {
//            resource.put(String.class, file.getBytes());
//            return fileName + ";" + relaPath + ";" + realPath;
//        } catch (IOException e) {
//            e.printStackTrace();
//            return "";
//        }

        // 用戶目錄/root/fileUpload/ueditor
        String userDir = System.getProperty("user.home");
        String ueditorUploadPath = userDir + File.separator + path;
        File file2 = new File(ueditorUploadPath);
        if (!file2.exists()) {
            file2.mkdirs();
        }
        String newFilePath = ueditorUploadPath + fileName;

        // 保存在本地
        File file3 = new File(newFilePath);
        try {
            FileCopyUtils.copy(file.getBytes(), file3);
            return fileName + ";" + relaPath + ";" + realPath;
        } catch (IOException e) {
            e.printStackTrace();
            return "";
        }
    }

    public static String delete(String filePath) {
        try {
            Client client = new Client();
            WebResource resource = client.resource(filePath);
            resource.delete();
            return "y";
        } catch (Exception e) {
            e.printStackTrace();
            return "n";
        }
    }
}
5. 編寫Controller類UeditorController.java，為前端提供上傳接口 
package cn.lega.common.controller;

import cn.lega.common.baidu.ueditor.ActionEnter;
import cn.lega.common.util.ResponseUtils;
import cn.lega.common.util.StrUtils;
import cn.lega.common.util.UploadUtil;
import cn.lega.common.web.BaseController;
import com.alibaba.fastjson.JSON;
import com.alibaba.fastjson.JSONObject;
import com.sun.jersey.api.client.Client;
import org.apache.commons.io.FilenameUtils;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.core.io.ClassPathResource;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
import org.springframework.web.multipart.MultipartResolver;
import org.springframework.web.multipart.commons.CommonsMultipartResolver;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.*;
import java.util.Map;

/**
 * 用于處理關于ueditor插件相關的請求
 *
 * @author silianpan
 */
@RestController
@CrossOrigin
@RequestMapping("/common/ueditor")
public class UeditorController extends BaseController {

    // 后臺圖片保存地址
    @Value("#{configProperties["ueditor"]}")
    private String ueditor;

    @Value("#{configProperties["uploadHost"]}")
    private String uploadHost;    //項目host路徑

    /**
     * ueditor文件上傳（上傳到外部服務器）
     *
     * @param request
     * @param response
     * @param action
     */
    @ResponseBody
    @RequestMapping(value = "/ueditorUpload.do", method = {RequestMethod.GET, RequestMethod.POST})
    public void editorUpload(HttpServletRequest request, HttpServletResponse response, String action) {
        response.setContentType("application/json");
        String rootPath = request.getSession().getServletContext().getRealPath("/");

        try {
            if ("config".equals(action)) {    // 如果是初始化
                String exec = new ActionEnter(request, rootPath).exec();
                PrintWriter writer = response.getWriter();
                writer.write(exec);
                writer.flush();
                writer.close();
            } else if ("uploadimage".equals(action) || "uploadvideo".equals(action) || "uploadfile".equals(action)) {    // 如果是上傳圖片、視頻、和其他文件
                try {
                    MultipartResolver resolver = new CommonsMultipartResolver(request.getSession().getServletContext());
                    MultipartHttpServletRequest Murequest = resolver.resolveMultipart(request);
                    Map files = Murequest.getFileMap();// 得到文件map對象
                    // 實例化一個jersey
                    Client client = new Client();

                    for (MultipartFile pic : files.values()) {
                        JSONObject jo = new JSONObject();
                        long size = pic.getSize();    // 文件大小
                        String originalFilename = pic.getOriginalFilename();  // 原來的文件名
                        if (StrUtils.isEmpty(uploadHost) || uploadHost.equals("default")) {
                            uploadHost = System.getProperty("user.home") + File.separator;
                        }
                        String uploadInfo = UploadUtil.upload(client, pic, request, response, uploadHost, ueditor);
                        if (!"".equals(uploadInfo)) {    // 如果上傳成功
                            String[] infoList = uploadInfo.split(";");
                            jo.put("state", "SUCCESS");
                            jo.put("original", originalFilename);//原來的文件名
                            jo.put("size", size); // 文件大小
                            jo.put("title", infoList[1]); // 隨意，代表的是鼠標經(jīng)過圖片時顯示的文字
                            jo.put("type", FilenameUtils.getExtension(pic.getOriginalFilename())); // 文件后綴名
                            jo.put("url", infoList[2]);// 這里的url字段表示的是上傳后的圖片在圖片服務器的完整地址（http://ip:端口/***/***/***.jpg）
                        } else {    // 如果上傳失敗
                        }
                        ResponseUtils.renderJson(response, jo.toString());
                    }
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
        } catch (Exception e) {
        }
    }

//    @RequestMapping(value = "/exec")
//    public void config(HttpServletRequest request,  HttpServletResponse response) {
//        // response.setContentType("application/json");
//        String rootPath = request.getSession().getServletContext().getRealPath("/");
//        response.setHeader("Content-Type" , "text/html");
//        try {
//            String exec = new ActionEnter(request, rootPath).exec();
//            PrintWriter writer = response.getWriter();
//            writer.write(exec);
//            writer.flush();
//            writer.close();
//        } catch (IOException e) {
//            e.printStackTrace();
//        }
//    }

    @RequestMapping(value = "/exec")
    @ResponseBody
    public String exec(HttpServletRequest request) throws UnsupportedEncodingException {
        request.setCharacterEncoding("utf-8");
        String rootPath = request.getSession().getServletContext().getRealPath("/");
        return new ActionEnter(request, rootPath).exec();
    }

    @RequestMapping("/ueconfig")
    public void getUEConfig(HttpServletRequest request, HttpServletResponse response) {
        org.springframework.core.io.Resource res = new ClassPathResource("ueditorConfig.json");
        InputStream is = null;
        response.setHeader("Content-Type", "text/html");
        try {
            is = new FileInputStream(res.getFile());
            StringBuffer sb = new StringBuffer();
            byte[] b = new byte[1024];
            int length = 0;
            while (-1 != (length = is.read(b))) {
                sb.append(new String(b, 0, length, "utf-8"));
            }
            String result = sb.toString().replaceAll("/*(.|[
])*?*/", "");
            JSONObject json = JSON.parseObject(result);
            PrintWriter out = response.getWriter();
            out.print(json.toString());
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            try {
                is.close();
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
    }
}
Vue前端集成 1. 解壓jsp版本，拷貝到Vue前端項目static目錄中

2. 前端常量配置 
// 靜態(tài)目錄
export const STATIC_PATH = process.env.NODE_ENV === "production" ? "./static/" : "/static/"
// UEditor服務路徑，對應UeditorController.java上傳接口
export const UEDITOR_SERVER = API_BASEURL + "/common/ueditor/ueditorUpload.do"
3. 安裝插件vue-ueditor-wrap 
npm install vue-ueditor-wrap
or
yarn add vue-ueditor-wrap
4. 編寫組件
Tomcat文件服務

配置tomcat/conf/server.xml，添加如下代碼

port=8090 文件訪問服務端口  
docBase="/home/" 文件存儲目錄
至此，大功告成~

轉(zhuǎn)載請注明：思戀 ? Spring+Vue整合UEditor富文本實現(xiàn)圖片附件上傳

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/75239.html

相關文章

  • Ueditor結(jié)合七牛云存儲上傳圖片、附件和圖片在線管理的實現(xiàn)和最新更新

    摘要：版本修復提供多文件上傳，解決了以前不能多文件上傳問題，最大上傳圖片張，最大上傳附件，如果感覺時間不足可修改中的時間，現(xiàn)在是修復了文件同名上傳失敗的問題，解決方案是同名上傳覆蓋，即的方式修復了丟失的問題修改了上一版執(zhí)行安全漏洞還有個小就是上傳 1.0版本修復bug 提供多文件上傳，解決了以前不能多文件上傳問題，最大上傳圖片32張，最大上傳附件10，如果感覺時間不足可修改getToke...

    xavier 評論0 收藏0

  • vue用element來實現(xiàn)上傳圖片和修改圖片功能

    　　項目要求上傳圖片的模塊，這個簡單，但是要在保存圖片后需要編輯就不怎么好處理了，現(xiàn)在就和大家一起分享。　　一、應用場景　　1.上傳圖片并進行放大預覽　　2.圖片上傳代碼　　就是直接將圖片上傳到接口，成功后返回圖片路徑，表單提交時，后臺要路徑拼成的字符串格式，類似str=‘/uploads/20220418/d93905dbcd041a0a88abc72fd34b6c98.jpg,/uploads...

    3403771864 評論0 收藏0

  • Ueditor與SpringMVC整合

    摘要：目的本文旨在整合百度前端富文本與，使用作為的后端，提供上傳圖片等后臺相關的功能，即使用替換官方提供的后臺方式。 目的 本文旨在整合百度前端富文本Ueditor與SpringMVC，使用Spring Controller作為Ueditor的后端，提供上傳圖片等后臺相關的功能，即使用SpringMVC替換官方提供的JSP后臺方式。 步驟 創(chuàng)建web工程，本文以maven進行創(chuàng)建和管理，最...

    linkin 評論0 收藏0

  • Ueditor與SpringMVC整合

    摘要：目的本文旨在整合百度前端富文本與，使用作為的后端，提供上傳圖片等后臺相關的功能，即使用替換官方提供的后臺方式。 目的 本文旨在整合百度前端富文本Ueditor與SpringMVC，使用Spring Controller作為Ueditor的后端，提供上傳圖片等后臺相關的功能，即使用SpringMVC替換官方提供的JSP后臺方式。 步驟 創(chuàng)建web工程，本文以maven進行創(chuàng)建和管理，最...

    lbool 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<