Bootstrap 可视化HTML编辑器,summernote(3)

简介: Bootstrap 可视化HTML编辑器,summernote

注释当中加的很详细,这里把其他关联的代码一并贴出,仅供参照。

  debug : function(msg) {
    if (this._set.debug) {
      if (typeof (console) != "undefined")
        console.log(msg);
      else
        alert(msg);
    }
  },
jsonEval : function(data) {
    try {
      if ($.type(data) == 'string')
        return eval('(' + data + ')');
      else
        return data;
    } catch (e) {
      return {};
    }
  },
  ajaxError : function(xhr, ajaxOptions, thrownError) {
    if (xhr.responseText) {
      $.showErr("<div>" + xhr.responseText + "</div>");
    } else {
      $.showErr("<div>Http status: " + xhr.status + " " + xhr.statusText + "</div>" + "<div>ajaxOptions: " + ajaxOptions + "</div>"
          + "<div>thrownError: " + thrownError + "</div>");
    }
  },
  ajaxDone : function(json) {
    if (json[YUNM.keys.statusCode] == YUNM.statusCode.error) {
      if (json[YUNM.keys.message]) {
        YUNM.debug(json[YUNM.keys.message]);
        $.showErr(json[YUNM.keys.message]);
      }
    } else if (json[YUNM.keys.statusCode] == YUNM.statusCode.timeout) {
      YUNM.debug(json[YUNM.keys.message]);
      $.showErr(json[YUNM.keys.message] || YUNM.msg("sessionTimout"), YUNM.loadLogin);
    }
  },


####2、后端springMVC文件保存


#####2.1、为springMVC增加文件的配置


<bean id="multipartResolver"
  class="org.springframework.web.multipart.commons.CommonsMultipartResolver" p:defaultEncoding="UTF-8">
  <property name="maxUploadSize" value="1024000000"></property>
  </bean>
<mvc:annotation-driven conversion-service="conversionService" />
  <bean id="conversionService"
  class="org.springframework.format.support.FormattingConversionServiceFactoryBean">
  <property name="converters">
    <list>
    <!-- 这里使用string to date可以将dao在jsp到controller转换的时候直接将string格式的日期转换为date类型 -->
    <bean class="com.honzh.common.plugin.StringToDateConverter" />
<!--      为type为file类型的数据模型增加转换器 -->
    <bean class="com.honzh.common.plugin.CommonsMultipartFileToString" />
    </list>
  </property>
  </bean>

这里就不做过多介绍了,可参照我之前写的SpringMVC之context-dispatcher.xml,了解基本的控制器


#####2.2、FileController.java


package com.honzh.spring.controller;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.log4j.Logger;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import com.honzh.common.base.UploadFile;
import com.honzh.spring.service.FileService;
@Controller
@RequestMapping(value = "/file")
public class FileController extends BaseController {
  private static Logger logger = Logger.getLogger(FileController.class);
  @Autowired
  private FileService fileService;
  @RequestMapping("")
  public void index(HttpServletRequest request, HttpServletResponse response) {
  logger.debug("获取上传文件...");
  try {
    UploadFile uploadFiles = fileService.saveFile(request);
    renderJsonDone(response, uploadFiles);
  } catch (Exception e) {
    logger.error(e.getMessage());
    logger.error(e.getMessage(), e);
    renderJsonError(response, "文件上传失败");
  }
  }
}


#####2.3、FileService.java

package com.honzh.spring.service;
import java.io.IOException;
import java.util.Iterator;
import java.util.Map;
import java.util.Random;
import javax.servlet.http.HttpServletRequest;
import org.apache.commons.io.FileUtils;
import org.apache.log4j.Logger;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
import com.honzh.common.Variables;
import com.honzh.common.base.UploadFile;
import com.honzh.common.util.DateUtil;
@Service
public class FileService {
  private static Logger logger = Logger.getLogger(FileService.class);
  public UploadFile saveFile(HttpServletRequest request) throws IOException {
    logger.debug("获取上传文件...");
    // 转换为文件类型的request
    MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
    // 获取对应file对象
    Map<String, MultipartFile> fileMap = multipartRequest.getFileMap();
    Iterator<String> fileIterator = multipartRequest.getFileNames();
    // 获取项目的相对路径(http://localhost:8080/file)
    String requestURL = request.getRequestURL().toString();
    String prePath = requestURL.substring(0, requestURL.indexOf(Variables.ctx));
    while (fileIterator.hasNext()) {
      String fileKey = fileIterator.next();
      logger.debug("文件名为:" + fileKey);
      // 获取对应文件
      MultipartFile multipartFile = fileMap.get(fileKey);
      if (multipartFile.getSize() != 0L) {
        validateImage(multipartFile);
        // 调用saveImage方法保存
        UploadFile file = saveImage(multipartFile);
        file.setPrePath(prePath);
        return file;
      }
    }
    return null;
  }
  private UploadFile saveImage(MultipartFile image) throws IOException {
    String originalFilename = image.getOriginalFilename();
    logger.debug("文件原始名称为:" + originalFilename);
    String contentType = image.getContentType();
    String type = contentType.substring(contentType.indexOf("/") + 1);
    String fileName = DateUtil.getCurrentMillStr() + new Random().nextInt(100) + "." + type;
    // 封装了一个简单的file对象,增加了几个属性
    UploadFile file = new UploadFile(Variables.save_directory, fileName);
    file.setContentType(contentType);
    logger.debug("文件保存路径:" + file.getSaveDirectory());
    // 通过org.apache.commons.io.FileUtils的writeByteArrayToFile对图片进行保存
    FileUtils.writeByteArrayToFile(file.getFile(), image.getBytes());
    return file;
  }
  private void validateImage(MultipartFile image) {
  }
}


#####2.4、UploadFile.java

package com.honzh.common.base;
import java.io.File;
import com.honzh.common.Variables;
public class UploadFile {
  private String saveDirectory;
  private String fileName;
  private String contentType;
  private String prePath;
  private String completeSavePath;
  private String relativeSavePath;
  public UploadFile(String saveDirectory, String filesystemName) {
    this.saveDirectory = saveDirectory;
    this.fileName = filesystemName;
  }
  public String getFileName() {
    return fileName;
  }
  public String getSaveDirectory() {
    return saveDirectory;
  }
  public String getContentType() {
    return contentType;
  }
  public void setContentType(String contentType) {
    this.contentType = contentType;
  }
  public String getPrePath() {
    if (prePath == null) {
      return "";
    }
    return prePath;
  }
  public void setPrePath(String prePath) {
    this.prePath = prePath;
    setCompleteSavePath(prePath + getRelativeSavePath());
  }
  public String getCompleteSavePath() {
    return completeSavePath;
  }
  public void setCompleteSavePath(String completeSavePath) {
    this.completeSavePath = completeSavePath;
  }
  public String getRelativeSavePath() {
    return relativeSavePath;
  }
  public void setRelativeSavePath(String relativeSavePath) {
    this.relativeSavePath = relativeSavePath;
  }
  public void setSaveDirectory(String saveDirectory) {
    this.saveDirectory = saveDirectory;
  }
  public void setFileName(String fileName) {
    this.fileName = fileName;
  }
  public File getFile() {
    if (getSaveDirectory() == null || getFileName() == null) {
      return null;
    } else {
      setRelativeSavePath(Variables.ctx + "/" + Variables.upload + "/" + getFileName());
      return new File(getSaveDirectory() + "/" + getFileName());
    }
  }
}
相关文章
|
搜索推荐 前端开发 数据可视化
【优秀python web毕设案例】基于协同过滤算法的酒店推荐系统,django框架+bootstrap前端+echarts可视化,有后台有爬虫
本文介绍了一个基于Django框架、协同过滤算法、ECharts数据可视化以及Bootstrap前端技术的酒店推荐系统,该系统通过用户行为分析和推荐算法优化,提供个性化的酒店推荐和直观的数据展示,以提升用户体验。
661 1
【优秀python web毕设案例】基于协同过滤算法的酒店推荐系统,django框架+bootstrap前端+echarts可视化,有后台有爬虫
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
369 4
|
移动开发 前端开发 JavaScript
基于 HTML5 和 Canvas 开发的在线图片编辑器
基于 HTML5 和 Canvas 开发的在线图片编辑器
390 0
|
搜索推荐 前端开发 数据可视化
基于Python协同过滤的旅游景点推荐系统,采用Django框架,MySQL数据存储,Bootstrap前端,echarts可视化实现
本文介绍了一个基于Python协同过滤算法的旅游景点推荐系统,该系统采用Django框架、MySQL数据库、Bootstrap前端和echarts数据可视化技术,旨在为用户提供个性化的旅游推荐服务,提升用户体验和旅游市场增长。
1677 9
基于Python协同过滤的旅游景点推荐系统,采用Django框架,MySQL数据存储,Bootstrap前端,echarts可视化实现
|
存储 移动开发 编解码
基于HTML5开发的Markdown在线编辑器
Markdown是一种轻量级标记语言,以其简洁易读的格式而备受程序员和作者们的青睐。随着互联网的发展,越来越多的在线Markdown编辑器应运而生,为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。
238 1
基于HTML5开发的Markdown在线编辑器
|
存储 JavaScript 前端开发
笔.COOL,一个功能完备、使用便捷的在线HTML/CSS/JS以及Vue编辑器和作品分享平台
笔.COOL是一个新兴的在线 HTML/CSS/JS 及 Vue 编辑器,提供实时预览和云端存储功能。用户可以随时随地编写和保存代码,同时分享作品给他人预览和学习。它也是一个实用的 BUG 复现工具,支持嵌入编辑器到博客,促进代码交流。社区活跃,适合开发者展示作品、获取灵感和学习。
569 1
|
Linux C++ iOS开发
HTML 编辑器
HTML 编辑器。
147 2
|
IDE 数据可视化 开发工具
HTML 编辑器
HTML 编辑器
282 0
|
移动开发 C# 设计模式
WinForms C#:html编辑器工程源码,含直接写WebBrowser的文件流、IPersistStreamInit接口的声明和一些相关的小方法
原文:WinForms C#:html编辑器工程源码,含直接写WebBrowser的文件流、IPersistStreamInit接口的声明和一些相关的小方法首先多谢朋友们的捧场; 今天给大家带来一个操作WebBrowser的一些高级方法,我专门写了一个html编辑器的实现代码,有需要的朋友可以自己扩充; 功能实现是直接写流到WebBrowser内不通过临时文件,并且支持对WebBrowser的一些高级控制(其实script可以达到的均可达到,想知道怎么搞的可以阅读代码)。
1151 0

热门文章

最新文章

下一篇
oss云网关配置