文本内容差异对比文本内容差异对比

前言最近客户提了个新需求，想在系统上直观的看到用户本次修改的内容跟上次的区别，例如这两段话：
我是中华人民共和国合法居民，今天写一个测试文本，并没有其他的意思。
我是中国合法居民，今天打算写一个文本内容测试字符，没有别的意思！

经过查找，发现了一个开源库（google-diff-match-patch）正好符合我们的需求，这个库目前支持7个语言，并且使用相同的API，每个版本都包含一套完整的单元测试。
文本记录Java、JavaScript版本的简单使用过程

代码编写本次测试项目是我们的jfinal-demo

首先先引入pom依赖

org.clojars.brenton google-diff-match-patch 0.1

org.webjars google-diff-match-patch 895a9512bb

很简洁，就一个类

文章图片

文章图片

diff_match_patch提供了挺多方法，且所有支持的语言版本的API保持一致，目前diff_main、diff_prettyHtml，这两个方法已经能满足我们的需求

文章图片

首先写一套controller、service层，提供一个一个对比接口、以及一个页面跳转，并新增一个diff页面

文章图片

文章图片

jfinal使用webjar静态资源，需要添加一个处理器，否则访问不到资源

package cn.huanzi.qch.handler; import com.jfinal.handler.Handler; import com.jfinal.log.Log; import org.apache.commons.io.IOUtils; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream; /** * webjar静态资源处理 */ public class WebJarsHandler extends Handler { private final Log log = Log.getLog(this.getClass()); @Override public void handle(String target, HttpServletRequest request, HttpServletResponse response, boolean[] isHandled) { if (target.contains("/webjars/")) { //加前缀，从ClassLoader找到资源 String path = target.replaceFirst("webjars", "META-INF/resources/webjars"); InputStream inputStream = this.getClass().getClassLoader().getResourceAsStream(path); OutputStream outputStream = null; try { if (inputStream != null) { outputStream = response.getOutputStream(); IOUtils.copy(inputStream, response.getOutputStream()); }else{ throw new IOException("inputStream is null"); } } catch (IOException e) { log.error("无法从webjar中找到该静态资源 : " + path, e); } finally { IOUtils.closeQuietly(inputStream); IOUtils.closeQuietly(outputStream); } isHandled[0] = true; } else { this.next.handle(target, request, response, isHandled); } } }

然后在AppConfig中载入该处理器

/** * 配置处理器 */ public void configHandler(Handlers me) { me.add(new WebJarsHandler()); }

效果演示简单main测试

package cn.huanzi.qch.util; import name.fraser.neil.plaintext.diff_match_patch; import name.fraser.neil.plaintext.diff_match_patch.Diff; import java.util.LinkedList; public class DiffUtil {public static void main(String[] args) { diff_match_patch dmp = new diff_match_patch(); //上版本内容 String text1 = "我是中华人民共和国合法居民，今天写一个测试文本，并没有其他的意思。"; //本版本内容 String text2 = "我是中国合法居民，今天打算写一个文本内容测试字符，没有别的意思！"; //原始格式 LinkedList linkedList = dmp.diff_main(text1, text2); System.out.println(linkedList); //转成html格式 System.out.println(dmp.diff_prettyHtml(linkedList)); } }

效果

[Diff(EQUAL,"我是中"), Diff(DELETE,"华人民共和"), Diff(EQUAL,"国合法居民，今天"), Diff(INSERT,"打算"), Diff(EQUAL,"写一个"), Diff(INSERT,"文本内容"), Diff(EQUAL,"测试"), Diff(DELETE,"文本"), Diff(INSERT,"字符"), Diff(EQUAL,"，"), Diff(DELETE,"并"), Diff(EQUAL,"没有"), Diff(DELETE,"其他"), Diff(INSERT,"别"), Diff(EQUAL,"的意思"), Diff(DELETE,"。"), Diff(INSERT,"！")]我是中~~华人民共和~~国合法居民，今天打算写一个文本内容测试文本字符，并没有其他别的意思。！

页面效果测试

文章图片

文本内容对比

上版本内容

本版本内容

内容差异对比

diff.html 效果

文章图片

后记文本内容差异对比暂时先记录到这，后续再进行补充

代码开源
代码已经开源、托管到我的GitHub、码云：
GitHub：https://github.com/huanzi-qch/jfinal-demo
【文本内容差异对比】码云：https://gitee.com/huanzi-qch/jfinal-demo