在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称:thinker-md开源软件地址:https://gitee.com/benhail/thinker-md开源软件介绍:Thinker-md是什么Thinker-md是一个支持markdown的在线文档编辑器,在线演示:http://thinkermd.oschina.mopaas.com/produce.html Thinker-md的特性
Thinker-md的由来在开发 LicenseThe MIT License. Copyright (c) 2016 OSChina.net 我们正在用
1. 开发者指南1.1 安装Grunt插件进入thinker-md根目录,执行如下命令(2016.03.30更新加入了新依赖,请更新后再执行一次): npm install 1.2 编译grunt watch 编译后会生成如下目录 dist ----javascript ----|----user ----|----|----thinker-md-user.js ----|----|----thinker-md-user.min.js ----|----|----thinker-md-user.min.map ----|----vendor ----|----|----jquery-2.1.3.js ----|----|----thinker-md.js ----|----|----thinker-md.min.js ----|----|----thinker-md.min.map ----stylesheets ----|----fonts ----|----|----fontawesome-webfont.eot ----|----|----glyphicons-halflings-regular.eot ----|----|----... ----|----img ----|----user ----|----|----thinker-md.user.min.css ----|----vendor ----|----|----thinker-md.min.css 2. 用户指南
页面引入参照/view/index.html和/view/develop.html
3. 使用3.1 使用案例<!DOCTYPE html><html><head lang="zh"> <meta charset="UTF-8"> <title>Thinker-md</title></head><body> <textarea id="md" data-provide="markdown"></textarea><link href="../dist/stylesheets/user/thinker-md.user.min.css" rel="stylesheet"><link href="../dist/stylesheets/vendor/thinker-md.min.css" rel="stylesheet"><script src="../dist/javascripts/vendor/jquery-2.1.3.js" type="text/javascript"></script><script src="../dist/javascripts/vendor/thinker-md.js" type="text/javascript"></script><script> $("#md").markdown({ language: 'zh', fullscreen: { enable: true }, resize:'vertical', localStorage:'md', imgurl: 'http://192.168.1.142:8080/upload', base64url: 'http://192.168.1.142:8080/base64'});</script></body></html> 3.2 配置参数说明
3.2.1 java版上传代码实现普通/base64图像上传案例(代码要求jdk8, 可自行修改以适应低版本jdk) import org.apache.commons.fileupload.FileItem;import org.apache.commons.fileupload.FileItemFactory;import org.apache.commons.fileupload.disk.DiskFileItemFactory;import org.apache.commons.fileupload.servlet.ServletFileUpload;import javax.servlet.ServletException;import javax.servlet.annotation.WebInitParam;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import java.io.*;import java.util.ArrayList;import java.util.Base64;import java.util.Date;import java.util.List;import java.util.stream.Collectors;/** * Created by 艺 on 16/03/31. */@WebServlet(name = "upload", urlPatterns = "/c/imgUpload", initParams = {@WebInitParam(name = "upload_path", value = "/ImageDir/")})public class UploadServlet extends javax.servlet.http.HttpServlet { @Override protected void doOptions(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { resp.addHeader("Access-Control-Allow-Origin", "*"); resp.addHeader("Access-Control-Allow-Methods", "GET,POST,OPTIONS"); resp.addHeader("Access-Control-Allow-Headers", "Cache-Control,X-Requested-With,Content-Type"); super.doOptions(req,resp); } @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { this.doPost(req, resp); } @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { req.setCharacterEncoding("UTF-8"); resp.addHeader("Access-Control-Allow-Origin", "*"); String imageDir = getServletConfig().getInitParameter("upload_path"); String directory = req.getSession().getServletContext().getRealPath(imageDir); StringBuilder path = new StringBuilder(directory); path.append(File.separator); StringBuffer url = req.getRequestURL(); String urlBase = url.substring(0, url.indexOf(req.getRequestURI())) + imageDir; boolean isMultipart = ServletFileUpload.isMultipartContent(req); if (isMultipart) { FileItemFactory fileItemFactory = new DiskFileItemFactory(); ServletFileUpload servletFileUpload = new ServletFileUpload(fileItemFactory); List<String> imgFileNames = new ArrayList<>(); try { for (FileItem item : servletFileUpload.parseRequest(req)) { if (!item.isFormField()) { // file upload //文件名称 String name = item.getName(); String fileName = new Date().getTime() + name.substring(name.lastIndexOf('\\') + 1, name.length()); //上传文件 File file = new File(path + fileName); File dir = file.getParentFile(); if (!dir.exists() && !dir.isDirectory()) { dir.mkdir(); } item.write(file); imgFileNames.add(fileName); } else if (item.getFieldName().equals("base64Date")) { // base64 upload String fileName = new Date().getTime() + ".png"; StringBuilder base64Data = new StringBuilder(); Reader reader = new InputStreamReader(item.getInputStream(), "UTF-8"); char[] buffer = new char[1024]; int read; while ((read = reader.read(buffer)) != -1) { base64Data.append(buffer, 0, read); } reader.close(); String base64 = base64Data.toString(); if (!"".equals(base64.trim())) { base64 = base64.substring(base64.lastIndexOf(',') + 1); byte[] b = Base64.getDecoder().decode(base64.getBytes()); BufferedOutputStream bos; FileOutputStream fos; File file = new File(path + fileName); fos = new FileOutputStream(file); bos = new BufferedOutputStream(fos); bos.write(b); fos.flush(); fos.close(); bos.flush(); bos.close(); imgFileNames.add(fileName); } } } } catch (Exception e) { e.printStackTrace(); } resp.addHeader("Access-Control-Allow-Origin", "*"); resp.setContentType("text/json; charset=UTF-8"); OutputStream outputStream = resp.getOutputStream(); outputStream.write(imgFileNames.stream() .map(fileName -> (urlBase + fileName)) .collect(Collectors.joining("\n")) .getBytes("UTF-8")); outputStream.flush(); outputStream.close(); return ; } }} |
请发表评论