更新index接入演示界面UI风格

.gitignore

@@ -17,7 +17,6 @@ target/
 
 ### NetBeans ###
 nbproject/private/
-build/
 nbbuild/
 dist/
 nbdist/
@@ -29,4 +28,3 @@ nbdist/
 
 server/src/main/cache/
 server/src/main/file/
-server/src/main/log

server/pom.xml

@@ -201,6 +201,12 @@
             <scope>system</scope>
             <systemPath>${basedir}/lib/cpdetector-1.04.jar</systemPath>
         </dependency>
+        <!-- url 规范化 -->
+        <dependency>
+            <groupId>io.mola.galimatias</groupId>
+            <artifactId>galimatias</artifactId>
+            <version>0.2.1</version>
+        </dependency>
     </dependencies>
     <build>
         <resources>

server/src/main/java/cn/keking/service/impl/MarkdownFilePreviewImpl.java

@@ -5,7 +5,7 @@ import cn.keking.service.FilePreview;
 import org.springframework.stereotype.Service;
 import org.springframework.ui.Model;
 
-import static com.sun.glass.ui.Clipboard.TEXT_TYPE;
+import static cn.keking.service.impl.SimTextFilePreviewImpl.TEXT_TYPE;
 
 /**
  * @author kl (http://kailing.pub)

server/src/main/java/cn/keking/service/impl/OtherFilePreviewImpl.java

@@ -15,7 +15,7 @@ public class OtherFilePreviewImpl implements FilePreview {
 
     @Override
     public String filePreviewHandle(String url, Model model, FileAttribute fileAttribute) {
-        return this.notSupportedFile(model,fileAttribute,"系统还不支持该格式文件的在线预览");
+        return this.notSupportedFile(model, fileAttribute, "系统还不支持该格式文件的在线预览");
     }
 
     /**
@@ -24,8 +24,28 @@ public class OtherFilePreviewImpl implements FilePreview {
      * @return 页面
      */
     public String notSupportedFile(Model model, FileAttribute fileAttribute, String errMsg) {
-        model.addAttribute("fileType", fileAttribute.getSuffix());
+        return this.notSupportedFile(model, fileAttribute.getSuffix(), errMsg);
+    }
+
+    /**
+     * 通用的预览失败，导向到不支持的文件响应页面
+     *
+     * @return 页面
+     */
+    public String notSupportedFile(Model model, String errMsg) {
+        return this.notSupportedFile(model, "未知", errMsg);
+    }
+
+    /**
+     * 通用的预览失败，导向到不支持的文件响应页面
+     *
+     * @return 页面
+     */
+    public String notSupportedFile(Model model, String fileType, String errMsg) {
+        model.addAttribute("fileType", fileType);
         model.addAttribute("msg", errMsg);
         return NOT_SUPPORTED_FILE_PAGE;
     }
+
+
 }

server/src/main/java/cn/keking/service/impl/PictureFilePreviewImpl.java

@@ -44,11 +44,11 @@ public class PictureFilePreviewImpl implements FilePreview {
                 String file = fileHandlerService.getRelativePath(response.getContent());
                 imgUrls.clear();
                 imgUrls.add(file);
-                model.addAttribute("imgurls", imgUrls);
+                model.addAttribute("imgUrls", imgUrls);
                 model.addAttribute("currentUrl", file);
             }
         } else {
-            model.addAttribute("imgurls", imgUrls);
+            model.addAttribute("imgUrls", imgUrls);
             model.addAttribute("currentUrl", url);
         }
         return PICTURE_FILE_PREVIEW_PAGE;

server/src/main/java/cn/keking/service/impl/SimTextFilePreviewImpl.java

@@ -39,7 +39,7 @@ public class SimTextFilePreviewImpl implements FilePreview {
         try {
             File originFile = new File(response.getContent());
             String xmlString = FileUtils.readFileToString(originFile, StandardCharsets.UTF_8);
-            model.addAttribute("textData", Base64Utils.encodeToString(xmlString.getBytes()));
+            model.addAttribute("textData", Base64Utils.encodeToString(xmlString.getBytes(StandardCharsets.UTF_8)));
         } catch (IOException e) {
             return otherFilePreview.notSupportedFile(model, fileAttribute, e.getLocalizedMessage());
         }

server/src/main/java/cn/keking/service/impl/XmlFilePreviewImpl.java

@@ -5,7 +5,7 @@ import cn.keking.service.FilePreview;
 import org.springframework.stereotype.Service;
 import org.springframework.ui.Model;
 
-import static com.sun.glass.ui.Clipboard.TEXT_TYPE;
+import static cn.keking.service.impl.SimTextFilePreviewImpl.TEXT_TYPE;
 
 /**
  * @author kl (http://kailing.pub)

server/src/main/java/cn/keking/utils/DownloadUtils.java

@@ -4,6 +4,7 @@ import cn.keking.config.ConfigConstants;
 import cn.keking.model.FileAttribute;
 import cn.keking.model.FileType;
 import cn.keking.model.ReturnResponse;
+import io.mola.galimatias.GalimatiasParseException;
 import org.slf4j.Logger;
 import org.slf4j.LoggerFactory;
 
@@ -81,7 +82,6 @@ public class DownloadUtils {
     public static byte[] getBytesFromUrl(String urlStr) throws IOException {
         InputStream is = getInputStreamFromUrl(urlStr);
         if (is == null) {
-         //   urlStr = URLUtil.normalize(urlStr, true, true);
             is = getInputStreamFromUrl(urlStr);
             if (is == null) {
                 logger.error("文件下载异常：url：{}", urlStr);
@@ -98,13 +98,14 @@ public class DownloadUtils {
 
     private static InputStream getInputStreamFromUrl(String urlStr) {
         try {
-            URL url = new URL(urlStr);
+
+            URL url = io.mola.galimatias.URL.parse(urlStr).toJavaURL();
             URLConnection connection = url.openConnection();
             if (connection instanceof HttpURLConnection) {
                 connection.setRequestProperty("User-Agent", "Mozilla/4.0 (compatible; MSIE 5.0; Windows NT; DigExt)");
             }
             return connection.getInputStream();
-        } catch (IOException e) {
+        } catch (IOException | GalimatiasParseException e) {
             logger.warn("连接url异常：url：{}", urlStr);
             return null;
         }

server/src/main/java/cn/keking/web/controller/OnlinePreviewController.java

@@ -5,6 +5,7 @@ import cn.keking.service.FilePreview;
 import cn.keking.service.FilePreviewFactory;
 
 import cn.keking.service.cache.CacheService;
+import cn.keking.service.impl.OtherFilePreviewImpl;
 import cn.keking.utils.DownloadUtils;
 import cn.keking.service.FileHandlerService;
 import org.slf4j.Logger;
@@ -31,21 +32,30 @@ import static cn.keking.service.FilePreview.PICTURE_FILE_PREVIEW_PAGE;
 @Controller
 public class OnlinePreviewController {
 
+    public static final String BASE64_DECODE_ERROR_MSG = "Base64解码失败，请检查你的 %s 是否采用 Base64 + urlEncode 双重编码了！";
     private final Logger logger = LoggerFactory.getLogger(OnlinePreviewController.class);
 
     private final FilePreviewFactory previewFactory;
     private final CacheService cacheService;
     private final FileHandlerService fileHandlerService;
+    private final OtherFilePreviewImpl otherFilePreview;
 
-    public OnlinePreviewController(FilePreviewFactory filePreviewFactory, FileHandlerService fileHandlerService, CacheService cacheService) {
+    public OnlinePreviewController(FilePreviewFactory filePreviewFactory, FileHandlerService fileHandlerService, CacheService cacheService, OtherFilePreviewImpl otherFilePreview) {
         this.previewFactory = filePreviewFactory;
         this.fileHandlerService = fileHandlerService;
         this.cacheService = cacheService;
+        this.otherFilePreview = otherFilePreview;
     }
 
     @RequestMapping(value = "/onlinePreview")
     public String onlinePreview(String url, Model model, HttpServletRequest req) {
-        String fileUrl = new String(Base64Utils.decodeFromString(url));
+        String fileUrl;
+        try {
+            fileUrl = new String(Base64Utils.decodeFromString(url));
+        } catch (Exception ex) {
+            String errorMsg = String.format(BASE64_DECODE_ERROR_MSG, "url");
+            return otherFilePreview.notSupportedFile(model, errorMsg);
+        }
         FileAttribute fileAttribute = fileHandlerService.getFileAttribute(fileUrl, req);
         FilePreview filePreview = previewFactory.get(fileAttribute);
         logger.info("预览文件url：{}，previewType：{}", fileUrl, fileAttribute.getType());
@@ -54,17 +64,25 @@ public class OnlinePreviewController {
 
     @RequestMapping(value = "/picturesPreview")
     public String picturesPreview(String urls, Model model, HttpServletRequest req) throws UnsupportedEncodingException {
-        String fileUrls = new String(Base64Utils.decodeFromString(urls));
+        String fileUrls;
+        try {
+            fileUrls = new String(Base64Utils.decodeFromString(urls));
+        } catch (Exception ex) {
+            String errorMsg = String.format(BASE64_DECODE_ERROR_MSG, "urls");
+            return otherFilePreview.notSupportedFile(model, errorMsg);
+        }
         logger.info("预览文件url：{}，urls：{}", fileUrls, urls);
         // 抽取文件并返回文件列表
-        String[] imgs = fileUrls.split("\\|");
-        List<String> imgUrls = Arrays.asList(imgs);
+        String[] images = fileUrls.split("\\|");
+        List<String> imgUrls = Arrays.asList(images);
         model.addAttribute("imgUrls", imgUrls);
 
         String currentUrl = req.getParameter("currentUrl");
-        if(StringUtils.hasText(currentUrl)){
+        if (StringUtils.hasText(currentUrl)) {
             String decodedCurrentUrl = new String(Base64Utils.decodeFromString(currentUrl));
             model.addAttribute("currentUrl", decodedCurrentUrl);
+        } else {
+            model.addAttribute("currentUrl", imgUrls.get(0));
         }
         return PICTURE_FILE_PREVIEW_PAGE;
     }

server/src/main/log/README.txt

@@ -0,0 +1,7 @@
+README.txt
+log目录是用来存放kkFileView.log的，预览服务的运行情况最终都会反映到这个日志文件里，
+可以提供给开发、运维排查系统问题。如果通过kkFileView.log还无法定位问题所在，请你在寻求
+kk官方支持时，QQ群一 613025121、QQ群二 484680571。将此日志文件一并携带，并按照这个
+格式重命名日志文件 kkFileView-QQ昵称-时间日期.log。如：kkFileView-kl博主-2020-12-27.log 。
+所有收集的日志文件我们都会存档，供所有的kk用户作为排查案例使用，所以在你提供日志前，请
+先自行处理日志文件里的业务敏感内容。

server/src/main/resources/web/index.ftl

@@ -2,51 +2,49 @@
 
 <html lang="en">
 <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0" />
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1.0"/>
     <title>kkFileView演示首页</title>
-    <link rel="stylesheet" href="css/viewer.min.css" />
-    <link rel="stylesheet" href="css/loading.css" />
-    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
-    <link rel="stylesheet" href="bootstrap-table/bootstrap-table.min.css" />
-    <link rel="stylesheet" href="gitalk/gitalk.css" />
+    <link rel="stylesheet" href="css/viewer.min.css"/>
+    <link rel="stylesheet" href="css/loading.css"/>
+    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
+    <link rel="stylesheet" href="bootstrap-table/bootstrap-table.min.css"/>
+    <link rel="stylesheet" href="gitalk/gitalk.css"/>
     <script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
     <script type="text/javascript" src="js/jquery.form.min.js"></script>
     <script type="text/javascript" src="bootstrap/js/bootstrap.min.js"></script>
     <script type="text/javascript" src="bootstrap-table/bootstrap-table.min.js"></script>
     <script type="text/javascript" src="gitalk/gitalk.min.js"></script>
-    <script type="text/javascript" src="js/base64.min.js" ></script>
+    <script type="text/javascript" src="js/base64.min.js"></script>
 </head>
 
 <body>
-<h1>文件预览项目接入和测试界面</h1>
-<div class="panel-group" id="accordion">
+<div class="panel-group container" id="accordion">
+    <h1>文件预览项目接入和测试界面</h1>
+
     <div class="panel panel-default">
         <div class="panel-heading">
             <h4 class="panel-title">
-                <a data-toggle="collapse" data-parent="#accordion"
-                   href="#collapseOne">
+                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
                     接入说明
                 </a>
             </h4>
         </div>
-        <div id="collapseOne" class="panel-collapse collapse">
-            <div class="panel-body">
-                <div>
-                    如果你的项目需要接入文件预览项目，达到对docx、excel、ppt、jpg等文件的预览效果，那么通过在你的项目中加入下面的代码就可以
-                    成功实现：
-                    <pre style="background-color: #2f332a;color: #cccccc">
-var url = 'http://127.0.0.1:8080/file/test.txt'; //要预览文件的访问地址
-window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(base64Encode(url)));
-                    </pre>
-                </div>
-                <div>
-                    新增多图片同时预览功能，接口如下：
-                    <pre style="background-color: #2f332a;color: #cccccc">
-var fileUrl =url1+"|"+"url2";//多文件使用“|”字符隔开
-window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(base64Encode(fileUrl)));
-                    </pre>
-                </div>
+        <div class="panel-body">
+            <div>
+                如果你的项目需要接入文件预览项目，达到对docx、excel、ppt、jpg等文件的预览效果，那么通过在你的项目中加入下面的代码就可以
+                成功实现：
+                <pre style="background-color: #2f332a;color: #cccccc">
+                    var url = 'http://127.0.0.1:8080/file/test.txt'; //要预览文件的访问地址
+                    window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(base64Encode(url)));
+                </pre>
+            </div>
+            <div>
+                新增多图片同时预览功能，接口如下：
+                <pre style="background-color: #2f332a;color: #cccccc">
+                    var fileUrl =url1+"|"+"url2";//多文件使用“|”字符隔开
+                    window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(base64Encode(fileUrl)));
+                </pre>
             </div>
         </div>
     </div>
@@ -59,104 +57,100 @@ window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(bas
                 </a>
             </h4>
         </div>
-        <div id="collapseTwo" class="panel-collapse collapse">
-            <div class="panel-body">
-                <div style="padding: 10px">
-                    <form enctype="multipart/form-data" id="fileUpload">
-                        <input type="file" name="file" />
-                        <input type="button" id="btnsubmit" value=" 上 传 " />
-                    </form>
-                </div>
-                <div>
-                    <table id="table" data-pagination="true"></table>
-                </div>
+        <div class="panel-body">
+            <div style="padding: 10px">
+                <form enctype="multipart/form-data" id="fileUpload">
+                    <input type="file" name="file"/>
+                    <input type="button" id="btnubmit" value=" 上 传 "/>
+                </form>
+            </div>
+            <div>
+                <table id="table" data-pagination="true"></table>
             </div>
         </div>
     </div>
     <div class="panel panel-default">
         <div class="panel-heading">
             <h4 class="panel-title">
-                <a data-toggle="collapse" data-parent="#accordion"
-                   href="#collapseThree">
-                    更新记录
+                <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
+                    发版记录
                 </a>
             </h4>
         </div>
-        <div id="collapseThree" class="panel-collapse collapse in">
-            <div class="panel-body">
-                <div>
-                     2020年12月27日 ：<br>
-                        2020年年终大版本更新，架构全面设计，代码全面重构，代码质量全面提升，二次开发更便捷，欢迎拉源码品鉴，提issue、pr共同建设
-                        1. 架构模块调整,大量的代码重构，代码质量提升N个等级，欢迎品鉴<br>
-                        2. 增强XML文件预览效果，新增XML文档数结构预览<br>
-                        3. 新增markdown文件预览支持，预览支持md渲染和源文本切换支持<br>
-                        4. 切换底层web server为jetty，解决这个issue：<a href="https://github.com/kekingcn/kkFileView/issues/168">#issues/168</a><br>
-                        5. 引入cpdetector，解决文件编码识别问题<br>
-                        6. url采用base64+urlencode双编码，彻底解决各种奇葩文件名预览问题<br>
-                        7. 新增配置项office.preview.switch.disabled，控制offic文件预览切换开关<br>
-                        8. 优化文本类型文件预览逻辑，采用Base64传输内容，避免预览时再次请求文件内容<br>
-                        9. office预览图片模式禁用图片放大效果，达到图片和pdf预览效果一致的体验<br>
-                        10. 直接代码静态设置pdfbox兼容低版本jdk，在IDEA中运行也不会有警告提示<br>
-                        11. 移除guava、hutool等非必须的工具包，减少代码体积<br>
-                        12. Office组件加载异步化，提速应用启动速度最快到5秒内<br>
-                        13. 合理设置预览消费队列的线程数<br>
-                        14. 修复压缩包里文件再次预览失败的bug<br>
-                        15. 修复图片预览的bug<br><br>
+        <div class="panel-body">
+            <div>
+                2020年12月27日 ：<br>
+                2020年年终大版本更新，架构全面设计，代码全面重构，代码质量全面提升，二次开发更便捷，欢迎拉源码品鉴，提issue、pr共同建设<br>
+                1. 架构模块调整,大量的代码重构，代码质量提升N个等级，欢迎品鉴<br>
+                2. 增强XML文件预览效果，新增XML文档数结构预览<br>
+                3. 新增markdown文件预览支持，预览支持md渲染和源文本切换支持<br>
+                4. 切换底层web server为jetty，解决这个issue：<a href="https://github.com/kekingcn/kkFileView/issues/168">#issues/168</a><br>
+                5. 引入cpdetector，解决文件编码识别问题<br>
+                6. url采用base64+urlencode双编码，彻底解决各种奇葩文件名预览问题<br>
+                7. 新增配置项office.preview.switch.disabled，控制offic文件预览切换开关<br>
+                8. 优化文本类型文件预览逻辑，采用Base64传输内容，避免预览时再次请求文件内容<br>
+                9. office预览图片模式禁用图片放大效果，达到图片和pdf预览效果一致的体验<br>
+                10. 直接代码静态设置pdfbox兼容低版本jdk，在IDEA中运行也不会有警告提示<br>
+                11. 移除guava、hutool等非必须的工具包，减少代码体积<br>
+                12. Office组件加载异步化，提速应用启动速度最快到5秒内<br>
+                13. 合理设置预览消费队列的线程数<br>
+                14. 修复压缩包里文件再次预览失败的bug<br>
+                15. 修复图片预览的bug<br><br>
 
-                    2020年05月20日 ：<br>
-                        1. 新增支持全局水印，并支持通过参数动态改变水印内容<br>
-                        2. 新增支持CAD文件预览<br>
-                        3. 新增base.url配置，支持使用nginx反向代理和使用context-path<br>
-                        4. 支持所有配置项支持从环境变量里读取，方便Docker镜像部署和集群中大规模使用<br>
-                        5. 支持配置限信任站点（只能预览来自信任点的文件源），保护预览服务不被滥用<br>
-                        6. 支持配置自定义缓存清理时间（cron表达式）<br>
-                        7. 全部能识别的纯文本直接预览，不用再转跳下载，如.md .java .py等<br>
-                        8. 支持配置限制转换后的PDF文件下载<br>
-                        9. 优化maven打包配置，解决 .sh 脚本可能出现换行符问题<br>
-                        10. 将前端所有CDN依赖放到本地，方便没有外网连接的用户使用<br>
-                        11. 首页评论服务由搜狐畅言切换到Gitalk<br>
-                        12. 修复url中包含特殊字符可能会引起的预览异常<br>
-                        13. 修复转换文件队列addTask异常<br>
-                        14. 修复其他已经问题<br>
-                        15. 官网建设：<a href="https://kkfileview.keking.cn">https://kkfileview.keking.cn</a><br>
-                        16. 官方Docker镜像仓库建设：<a href="https://hub.docker.com/r/keking/kkfileview">https://hub.docker.com/r/keking/kkfileview</a><br><br>
+                2020年05月20日 ：<br>
+                1. 新增支持全局水印，并支持通过参数动态改变水印内容<br>
+                2. 新增支持CAD文件预览<br>
+                3. 新增base.url配置，支持使用nginx反向代理和使用context-path<br>
+                4. 支持所有配置项支持从环境变量里读取，方便Docker镜像部署和集群中大规模使用<br>
+                5. 支持配置限信任站点（只能预览来自信任点的文件源），保护预览服务不被滥用<br>
+                6. 支持配置自定义缓存清理时间（cron表达式）<br>
+                7. 全部能识别的纯文本直接预览，不用再转跳下载，如.md .java .py等<br>
+                8. 支持配置限制转换后的PDF文件下载<br>
+                9. 优化maven打包配置，解决 .sh 脚本可能出现换行符问题<br>
+                10. 将前端所有CDN依赖放到本地，方便没有外网连接的用户使用<br>
+                11. 首页评论服务由搜狐畅言切换到Gitalk<br>
+                12. 修复url中包含特殊字符可能会引起的预览异常<br>
+                13. 修复转换文件队列addTask异常<br>
+                14. 修复其他已经问题<br>
+                15. 官网建设：<a href="https://kkfileview.keking.cn">https://kkfileview.keking.cn</a><br>
+                16. 官方Docker镜像仓库建设：<a href="https://hub.docker.com/r/keking/kkfileview">https://hub.docker.com/r/keking/kkfileview</a><br><br>
 
-                    2019年06月18日 ：<br>
-                        1. 支持自动清理缓存及预览文件<br>
-                        2. 支持http/https下载流url文件预览<br>
-                        3. 支持FTP url文件预览<br>
-                        4. 加入Docker构建<br><br>
+                2019年06月18日 ：<br>
+                1. 支持自动清理缓存及预览文件<br>
+                2. 支持http/https下载流url文件预览<br>
+                3. 支持FTP url文件预览<br>
+                4. 加入Docker构建<br><br>
 
-                    2019年04月08日 ：<br>
-                        1. 缓存及队列实现抽象，提供JDK和REDIS两种实现(REDIS成为可选依赖)<br>
-                        2. 打包方式提供zip和tar.gz包，并提供一键启动脚本<br><br>
+                2019年04月08日 ：<br>
+                1. 缓存及队列实现抽象，提供JDK和REDIS两种实现(REDIS成为可选依赖)<br>
+                2. 打包方式提供zip和tar.gz包，并提供一键启动脚本<br><br>
 
-                    2018年01月19日 ：<br>
-                        1. 大文件入队提前处理<br>
-                        1. 新增addTask文件转换入队接口<br>
-                        1. 采用redis队列，支持kkFIleView接口和异构系统入队两种方式<br><br>
+                2018年01月19日 ：<br>
+                1. 大文件入队提前处理<br>
+                1. 新增addTask文件转换入队接口<br>
+                1. 采用redis队列，支持kkFIleView接口和异构系统入队两种方式<br><br>
 
-                    2018年01月15日 ：<br>
-                        1.首页新增社会化评论框<br><br>
+                2018年01月15日 ：<br>
+                1.首页新增社会化评论框<br><br>
 
-                    2018年01月12日 ：<br>
-                        1.新增多图片同时预览<br>
-                        2.支持压缩包内图片轮番预览<br><br>
+                2018年01月12日 ：<br>
+                1.新增多图片同时预览<br>
+                2.支持压缩包内图片轮番预览<br><br>
 
-                    2018年01月02日 ：<br>
-                        1.修复txt等文本编码问题导致预览乱码<br>
-                        2.修复项目模块依赖引入不到的问题<br>
-                        3.新增spring boot profile，支持多环境配置<br>
-                        4.引入pdf.js预览doc等文件，支持doc标题生成pdf预览菜单，支持手机端预览<br><br>
+                2018年01月02日 ：<br>
+                1.修复txt等文本编码问题导致预览乱码<br>
+                2.修复项目模块依赖引入不到的问题<br>
+                3.新增spring boot profile，支持多环境配置<br>
+                4.引入pdf.js预览doc等文件，支持doc标题生成pdf预览菜单，支持手机端预览<br><br>
 
-                    2017年12月12日：<br>
-                        1.项目gitee开源:<a href="https://gitee.com/kekingcn/file-online-preview" target="_blank">https://gitee.com/kekingcn/file-online-preview</a><br>
-                        2.项目github开源:<a href="https://github.com/kekingcn/kkFileView" target="_blank">https://github.com/kekingcn/kkFileView</a>
-                </div>
+                2017年12月12日：<br>
+                1.项目gitee开源:<a href="https://gitee.com/kekingcn/file-online-preview" target="_blank">https://gitee.com/kekingcn/file-online-preview</a><br>
+                2.项目github开源:<a href="https://github.com/kekingcn/kkFileView" target="_blank">https://github.com/kekingcn/kkFileView</a>
             </div>
         </div>
+
         <div class="panel-body">
-            <div id = "comments"></div>
+            <div id="comments"></div>
         </div>
 
     </div>
@@ -190,9 +184,9 @@ window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(bas
             url: '${baseUrl}deleteFile?fileName=' + encodeURIComponent(fileName),
             success: function (data) {
                 // 删除完成，刷新table
-                if (1 == data.code) {
+                if (1 === data.code) {
                     alert(data.msg);
-                } else{
+                } else {
                     $('#table').bootstrapTable('refresh', {});
                 }
             },
@@ -201,6 +195,7 @@ window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(bas
             }
         })
     }
+
     $(function () {
         $('#table').bootstrapTable({
             url: 'listFiles',
@@ -211,14 +206,14 @@ window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(bas
                 field: 'action',
                 title: '操作'
             },]
-        }).on('pre-body.bs.table', function (e,data) {
+        }).on('pre-body.bs.table', function (e, data) {
             // 每个data添加一列用来操作
             $(data).each(function (index, item) {
-                item.action = "<a class='btn btn-default' target='_blank' href='${baseUrl}onlinePreview?url="+ encodeURIComponent(Base64.encode('${baseUrl}' + item.fileName)) +"'>预览</a>" +
-                    "<a class='btn btn-default' href='javascript:void(0);' onclick='deleteFile(\""+item.fileName+"\")'>删除</a>";
+                item.action = "<a class='btn btn-default' target='_blank' href='${baseUrl}onlinePreview?url=" + encodeURIComponent(Base64.encode('${baseUrl}' + item.fileName)) + "'>预览</a>" +
+                    "<a class='btn btn-default' href='javascript:void(0);' onclick='deleteFile(\"" + item.fileName + "\")'>删除</a>";
             });
             return data;
-        }).on('post-body.bs.table', function (e,data) {
+        }).on('post-body.bs.table', function (e, data) {
             return data;
         });
 
@@ -228,12 +223,12 @@ window.open('http://127.0.0.1:8012/picturesPreview?urls='+encodeURIComponent(bas
             $(".loading_container").css("height", height).show();
         }
 
-        $("#btnsubmit").click(function () {
+        $("#btnSubmit").click(function () {
             showLoadingDiv();
             $("#fileUpload").ajaxSubmit({
                 success: function (data) {
                     // 上传完成，刷新table
-                    if (1 == data.code) {
+                    if (1 === data.code) {
                         alert(data.msg);
                     } else {
                         $('#table').bootstrapTable('refresh', {});