提交 c78e3eb3 作者: ZhangJingKun

在线编辑 zhangjingkun

上级 24fe94ce
......@@ -178,6 +178,12 @@
<version>1.14.3</version>
</dependency>
<!-- thymeleaf依赖 用于渲染onlyoffice页面-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
</dependencies>
<build>
......
package com.zzsn.knowbase.config;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ViewResolverRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
import org.thymeleaf.spring5.view.ThymeleafViewResolver;
import javax.annotation.Resource;
import java.util.HashMap;
import java.util.Map;
@Configuration
public class MvcConfiguration implements WebMvcConfigurer {
@Resource(name="thymeleafViewResolver")
private ThymeleafViewResolver thymeleafViewResolver;
@Value("${files.docservice.url.site}")
private String documentServerHost;
@Value("${files.docservice.url.api}")
private String documentServerApiJs;
@Override
public void configureViewResolvers(ViewResolverRegistry registry) {
if (thymeleafViewResolver != null) {
Map<String, Object> vars = new HashMap<>(8);
vars.put("documentServerApiJs", documentServerHost+documentServerApiJs);
// System.out.println( String.format(documentServerApiJs, documentServerHost));
// System.out.println( String.format(documentServerApiJs, documentServerHost));
// 静态参数,只取一次值
thymeleafViewResolver.setStaticVariables(vars);
}
}
}
......@@ -2,6 +2,7 @@ package com.zzsn.knowbase.controller;
import com.zzsn.knowbase.service.ILocalFileService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
......@@ -17,8 +18,9 @@ import java.io.IOException;
* @Date: 2024/1/10 10:18
* @Content:
*/
@RestController
@RequestMapping("/api/file")
//@RestController
@Controller
//@RequestMapping("/api/file")
public class KbFileController {
@Autowired
......@@ -35,6 +37,9 @@ public class KbFileController {
@GetMapping("/download")
public void download(String fileName, String filePath, HttpServletResponse response) {
// fileName = "abc.docx";
// filePath = "20240111/24011100000006.docx";
localFileService.download(fileName, filePath, response);
}
......
......@@ -142,7 +142,7 @@ public class LocalFileServiceImpl implements ILocalFileService {
//edit
@Override
public String editDocFile(String fileName, String filePath, String userName, Model model) {
String path = filePath;
String path = filesStorage + filePath;
Document document = documentService.getDocument(documentService.buildDocument(path, fileName));
model.addAttribute("document", document);
// 如果该格式不支持编辑,则返回预览页面
......
......@@ -35,6 +35,9 @@ spring:
port: 6379
password: clbzzsn
thymeleaf:
prefix: classpath:/templates
mybatis-plus:
mapper-locations: classpath*:com/zzsn/knowbase/mapper/xml/*Mapper.xml
configuration:
......@@ -52,12 +55,12 @@ know:
document:
server:
host: http://gq55rd.natappfree.cc
host: http://192.168.1.75:9088
files:
storage: D:/know/
docservice:
url:
site: http://114.116.116.241:80/
site: http://192.168.1.216:80/
converter: ConvertService.ashx
command: coauthoring/CommandService.ashx
api: web-apps/apps/api/documents/api.js
......
This source diff could not be displayed because it is too large. You can view the blob instead.
html {
height: 100%;
width: 100%;
}
body {
background: #fff;
color: #333;
font-family: Arial, Tahoma, sans-serif;
font-size: 12px;
font-weight: normal;
height: 100%;
margin: 0;
overflow-y: hidden;
padding: 0;
text-decoration: none;
}
.form {
height: 100%;
}
div {
margin: 0;
padding: 0;
}
\ No newline at end of file
var codeHandler = (function(){
var base64Chars = [
'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H',
'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P',
'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X',
'Y', 'Z', 'a', 'b', 'c', 'd', 'e', 'f',
'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n',
'o', 'p', 'q', 'r', 's', 't', 'u', 'v',
'w', 'x', 'y', 'z', '0', '1', '2', '3',
'4', '5', '6', '7', '8', '9', '+', '/'
],
encode = {
'base64':codeBase64
},
decode = {
'base64':decodeBase64
}
handleFormat = {
'utf-8':toUTF8Binary
};
function stringToBinary(str , size , encodeType ){
// str-字符串 , size - 转换后的二进制位数 ,encodeType - 采用什么格式去保存二进制编码
var i,
len,
binary = '';
for ( i = 0 , len = str.length ; i < len ; i++ ){
binary = binary + handleFormat[encodeType.toLowerCase()](str.charCodeAt(i));
}
//console.log(binary);
return binary;
}
// 转换为以UTF-8格式的二进制数据
function toUTF8Binary(unicode){
var len,
binary = '',
star = 0,
bitStream = unicode.toString(2), // 转换为二进制比特流
bitLen = bitStream.length,
i;
if( unicode >= 0x000000 && unicode <= 0x00007F ){
binary = bitStream;
for( i = 0 , len = 8 ; i < len-bitLen ; i ++ ){
binary = 0 +binary; // 不足8位补0
}
}else if( unicode >=0x000080 && unicode <=0x0007FF ){
binary = bitStream;
for( i = 0 , len = 11 ; i < len-bitLen ; i ++ ){
binary = 0 +binary; // 不足11位补0
}
binary = '110'+binary.substr(0,5) + '10' + binary.substr(5,6);
}
else if( unicode >=0x000800 && unicode <=0x00FFFF ){
binary = bitStream;
for( i = 0 , len = 16 ; i < len-bitLen ; i ++ ){
binary = 0 +binary; // 不足16位补0
};
binary = '1110' +
binary.substr(0,4) +
'10' +
binary.substr(4,6) +
'10' +
binary.substr(10,6);
}
else if( unicode >=0x010000 && unicode <=0x10FFFF ){
binary = bitStream;
for( i = 0 , len = 21 ; i < len-bitLen ; i ++ ){
binary = 0 +binary; // 不足21位补0
}
binary = '11110' +
binary.substr(0,3) +
'10' +
binary.substr(3,6) +
'10' +
binary.substr(9,6) +
'10' +
binary.substr(15,6);
}
return binary;
}
// 编码成base64格式
function base64Parse(binary24,flag){
var i,
len,
result = '',
decode;
if(flag == 1){
for( i = 0 ; i < 4 ; i++){
decode = parseInt(binary24.substr(i*6,6),2);
result = result + base64Chars[decode];
}
}
else{
for ( i=0 , len = Math.floor(flag/6) ;i<len+1; i++){
decode = parseInt(binary24.substr(i*6,6),2);
result = result + base64Chars[decode];
}
for( i = 0; i < 3-len ;i ++){
result = result + '=';
}
}
return result;
}
// 解析为base64格式的二进制数据
function codeBase64(str){
var i,
len,
rem,
mer,
result = '',
strBinaryAry = [],
binary = stringToBinary(str , 8 , 'utf-8'); // base64是基于utf-8格式保存的二进制数据转换的
len = binary.length;
mer = Math.floor(len / 24);
rem = len % 24;
for( i = 0 ; i < mer ; i++){
result = result + base64Parse(binary.substr(i*24,24),1);
}
remCode = binary.substr(len-rem,rem);
if( rem > 0 ){
for( i =0 ; i < 24-rem ; i++){
remCode = remCode + 0;
}
result = result + base64Parse(remCode,rem)
}
return result;
}
// 解码base64格式的数据
function decodeBase64(str){
var i,
j,
k,
len,
t = 0,
curbinary,
start = 0 ,
flag = [
{
str:'0',
len:8
},
{
str:'110',
len:11
},
{
str:'1110',
len:16
},
{
str:'11110',
len:21
}],
binary= '',
newStr = '';
for( i = 0 , len = str.length ; i < len ; i++){
var curbinary = base64Chars.indexOf(str.charAt(i)).toString(2);
if( curbinary != '-1'){
for( j = 0 ; curbinary.length <6 ; j++){
curbinary = 0 + curbinary;
}
binary = binary + curbinary;
}
if( i >= len-2 && str.charAt(i) == '='){
++t;
}
}
if( t == 0 ){
len = binary.length;
}
else{
len = binary.length - (6-2*t)
}
for( ; start < len ;){
for( j = 0 ; j < 4 ; j++){
if(binary.indexOf( flag[j].str ,start) == start){
if(flag[j].len == 8){
newStr = newStr +
String.fromCharCode(parseInt(binary.substr(start,8),2));
}
else if(flag[j].len == 11){
newStr = newStr +
String.fromCharCode(parsetInt(binary.substr(start+3,5) +
binary.substr(start+10,6),2));
}
else if(flag[j].len == 16){
newStr = newStr +
String.fromCharCode(parsetInt(binary.substr(start+4,4) +
binary.substr(start+10,6) +
binary.substr(start+18,6),2));
}
else if(flag[j].len == 21){
newStr = newStr +
String.fromCharCode(parseInt(binary.substr(start+5,3) +
binary.substr(start+10,6) + binary.substr(start+18,6) +
binary.substr(start+26,6),2));
}
start = start + flag[j].len;
break;
}
}
}
binary = null;
return newStr;
}
return {
encode:function(str ,type){
return encode[type](str);
},
decode:function(str, type){
return decode[type](str);
}
};
})();
\ No newline at end of file
$(function () {
var docEditor;
var innerAlert = function (message) {
if (console && console.log)
console.log(message);
};
var onAppReady = function () {
innerAlert("文档已就绪~");
};
var onDocumentStateChange = function (event) {
var title = document.title.replace(/\*$/g, "");
document.title = title + (event.data ? "*" : "");
};
var onRequestEditRights = function () {
location.href = location.href.replace(RegExp("mode=view\&?", "i"), "");
};
var onError = function (event) {
if (event)
innerAlert(event.data);
};
var onOutdatedVersion = function (event) {
location.reload(true);
};
var getUrlParam = function (name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr(1).match(reg);
//返回参数值
if (r != null) {
return decodeURI(r[2]);
}
return null;
};
var getDocument = function () {
// 文件名(此处先从连接参数中获取,方便调试)
var fileName = getUrlParam('file');
//console.log(fileName);
!fileName && (fileName = "doc.doc");
//console.log(fileName);
// 文件类型(扩展名)
var ext = fileName.substr(fileName.lastIndexOf(".") + 1);
return {
"document": {
"fileType": ext,
"key": "sherlocky_oss_office_" + new Date().getMilliseconds() + "_" + fileName, // 不同文件key必须唯一
"title": "测试文档" + fileName,
"url": "http://192.168.0.58:20053//download"
}
};
};
var сonnectEditor = function () {
var config = getDocument();
config.width = "100%";
config.height = "100%";
config.events = {
"onAppReady": onAppReady,
"onDocumentStateChange": onDocumentStateChange,
//'onRequestEditRights': onRequestEditRights,
"onError": onError,
"onOutdatedVersion": onOutdatedVersion
};
config.editorConfig = {
//"actionLink": ACTION_DATA,
// edit时必须的字段
"callbackUrl": "http://10.4.89.60:8080/api/callback",
//"createUrl": "https://example.com/url-to-create-document/",
"lang": "zh-CN",//"en-US",
"mode": "view",//"edit",
"recent": [
/**
{
"folder": "Example Files",
"title": "exampledocument1.docx",
"url": "https://example.com/exampledocument1.docx"
}
*/
],
// maybe可定制各个学校的用户
"user": {
"id": "123456",
"name": "Sherlock"
}
,
// 可自定义一些配置
"customization": {
"chat": false, // 禁用聊天菜单按钮
"commentAuthorOnly": true, // 仅能编辑和删除其注释
"comments": false, // 隐藏文档注释菜单按钮
"compactHeader": false, // 隐藏附加操作按钮
"compactToolbar": false, // 完整工具栏(true代表紧凑工具栏)
"feedback": {
"visible": false // 隐藏反馈按钮
},
"forcesave": false, // true 表示强制文件保存请求添加到回调处理程序
"goback": false,/*{
"blank": true, // 转到文档时,在新窗口打开网站(false表示当前窗口打开)
"text": "转到文档位置(可以考虑放文档打开源页面)",
// 文档打开失败时的跳转也是该地址
"url": "http://www.lezhixing.com.cn"
},*/
"help": false, // 隐藏帮助按钮
"hideRightMenu": false, // 首次加载时隐藏右侧菜单(true 为显示)
"showReviewChanges": false, // 加载编辑器时自动显示/隐藏审阅更改面板(true显示 false隐藏)
"toolbarNoTabs": false, // 清楚地显示顶部工具栏选项卡(true 代表仅突出显示以查看选择了哪一个)
"zoom": 100 // 定义文档显示缩放百分比值
}
};
//config.editorConfig.customization = {};
docEditor = new DocsAPI.DocEditor("iframeEditor", config);
};
сonnectEditor();
});
var Editor = function () {
var docEditor;
var innerAlert = function (message) {
if (console && console.log)
console.log(message);
};
var onAppReady = function () {
innerAlert("文档编辑已就绪~");
};
var onDocumentStateChange = function (event) {
var title = document.title.replace(/\*$/g, "");
document.title = title + (event.data ? "*" : "");
};
var onError = function (event) {
if (event) {
innerAlert(event.data);
}
};
var onOutdatedVersion = function (event) {
//TODO
location.reload(true);
};
var onAppReady = function() {
console.log("ONLYOFFICE Document Editor is ready");
};
var onCollaborativeChanges = function () {
console.log("The document changed by collaborative user");
};
var onDocumentReady = function() {
console.log("Document is loaded");
};
var onDocumentStateChange = function (event) {
if (event.data) {
console.log("The document changed");
// docEditor.downloadAs();
} else {
console.log("Changes are collected on document editing service");
//
}
};
var onDownloadAs = function (event) {
console.log("ONLYOFFICE Document Editor create file: " + event.data);
window.top.postMessage(event.data);
createAndDownloadFile("test.docx",event.data)
};
window.addEventListener('message',function(e){
console.log(e.data)
if (e.data=="downloadAs") {
docEditor.downloadAs();
}
},false)
$("#insertImage").click(function(event) {
console.log("ONLYOFFICE Document Editor insertImage: "+ event.data);
docEditor.insertImage({
"fileType": "png",
"url": "http://192.168.0.58:20056/attachment/20190728测试上传文件名修改/2020January/1580363537940306800_small.png"
});
})
var onRequestInsertImage = function(event) {
console.log("ONLYOFFICE Document Editor insertImage" + event.data);
docEditor.insertImage({
"fileType": "png",
"url": "http://192.168.0.58:20056/attachment/20190728测试上传文件名修改/2020January/1580363537940306800_small.png"
});
};
var onError = function (event) {
console.log("ONLYOFFICE Document Editor reports an error: code " + event.data.errorCode + ", description " + event.data.errorDescription);
};
var onOutdatedVersion = function () {
location.reload(true);
};
var onRequestEditRights = function () {
console.log("ONLYOFFICE Document Editor requests editing rights");
// document.location.reload();
var he=location.href.replace("view","edit");
location.href=he;
};
//历史版本保留1个月。比如Unix时间戳(Unix timestamp)expires=1524547423
var onRequestHistory = function() {
};
var onRequestHistoryClose = function() {
document.location.reload();
};
var getUrlParam = function (name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr(1).match(reg);
//返回参数值
if (r != null) {
return decodeURI(r[2]);
}
return null;
};
var getDocumentConfig = function (document) {
if (document) {
return {
"document": document
};
}
innerAlert("文档未指定!");
return null;
};
var onRequestHistoryData = function() {}
var сonnectEditor = function (document, documentEditParam) {
var config = getDocumentConfig(document);
console.log(document)
console.log(documentEditParam)
config.width = "100%";
config.height = "100%";
config.events = {
"onAppReady": onAppReady,
"onDocumentStateChange": onDocumentStateChange,
"onError": onError,
"onOutdatedVersion": onOutdatedVersion
};
//config.documentType = ""+document.fileType
config.editorConfig = {
"lang": "zh-CN",
"mode": "edit",
"recent": [],
// 自定义一些配置
"customization": {
"chat": true, // 禁用聊天菜单按钮
"commentAuthorOnly": false, // 仅能编辑和删除其注释
"comments": false, // 隐藏文档注释菜单按钮
"compactHeader": false, // 隐藏附加操作按钮
"compactToolbar": false, // 完整工具栏(true代表紧凑工具栏)
"feedback": {
"visible": true // 隐藏反馈按钮
},
"forcesave": false, // true 表示强制文件保存请求添加到回调处理程序
"goback": false,/*{
"blank": true, // 转到文档时,在新窗口打开网站(false表示当前窗口打开)
"text": "转到文档位置(可以考虑放文档打开源页面)",
// 文档打开失败时的跳转也是该地址
"url": "http://www.lezhixing.com.cn"
},*/
"help": false, // 隐藏帮助按钮
"hideRightMenu": false, // 首次加载时隐藏右侧菜单(true 为显示)
"showReviewChanges": false, // 加载编辑器时自动显示/隐藏审阅更改面板(true显示 false隐藏)
"toolbarNoTabs": false, // 清楚地显示顶部工具栏选项卡(true 代表仅突出显示以查看选择了哪一个)
"zoom": 100 // 定义文档显示缩放百分比值
},
};
$.extend(config.editorConfig, documentEditParam);
console.log(config)
docEditor = new DocsAPI.DocEditor("iframeEditor",config);
};
return {
init: function (document, documentEditParam) {
сonnectEditor(document, documentEditParam);
}
}
}();
This source diff could not be displayed because it is too large. You can view the blob instead.
var Viewer = function() {
var docEditor;
var innerAlert = function (message) {
if (console && console.log)
console.log(message);
};
var onAppReady = function () {
innerAlert("文档查看已就绪~");
};
var onDocumentStateChange = function (event) {
var title = document.title.replace(/\*$/g, "");
document.title = title + (event.data ? "*" : "");
};
var onError = function (event) {
if (event) {
innerAlert(event.data);
}
};
var onOutdatedVersion = function (event) {
location.reload(true);
};
var getUrlParam = function (name) {
//构造一个含有目标参数的正则表达式对象
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
//匹配目标参数
var r = window.location.search.substr(1).match(reg);
//返回参数值
if (r != null) {
return decodeURI(r[2]);
}
return null;
};
var getDocumentConfig = function (document) {
if (document) {
return {
"document": document
};
}
innerAlert("文档未指定!");
return null;
};
var сonnectEditor = function (document) {
var config = getDocumentConfig(document);
config.width = "100%";
config.height = "100%";
config.events = {
"onAppReady": onAppReady,
"onDocumentStateChange": onDocumentStateChange,
"onError": onError,
"onOutdatedVersion": onOutdatedVersion
};
config.editorConfig = {
"lang": "zh-CN",
"mode": "view",
"recent": [],
// 自定义一些配置
"customization": {
"chat": false, // 禁用聊天菜单按钮
"commentAuthorOnly": true, // 仅能编辑和删除其注释
"comments": false, // 隐藏文档注释菜单按钮
"compactHeader": false, // 隐藏附加操作按钮
"compactToolbar": false, // 完整工具栏(true代表紧凑工具栏)
"feedback": {
"visible": false // 隐藏反馈按钮
},
"forcesave": false, // true 表示强制文件保存请求添加到回调处理程序
"goback": false,/*{
"blank": true, // 转到文档时,在新窗口打开网站(false表示当前窗口打开)
"text": "转到文档位置(可以考虑放文档打开源页面)",
// 文档打开失败时的跳转也是该地址
"url": "http://www.lezhixing.com.cn"
},*/
"help": false, // 隐藏帮助按钮
"hideRightMenu": false, // 首次加载时隐藏右侧菜单(true 为显示)
"showReviewChanges": false, // 加载编辑器时自动显示/隐藏审阅更改面板(true显示 false隐藏)
"toolbarNoTabs": false, // 清楚地显示顶部工具栏选项卡(true 代表仅突出显示以查看选择了哪一个)
"zoom": 100 // 定义文档显示缩放百分比值
}
};
docEditor = new DocsAPI.DocEditor("iframeEditor", config);
};
return {
init : function(document) {
сonnectEditor(document);
}
}
}();
\ No newline at end of file
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="zh-CN">
<head>
<title th:text="${document.title}"></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" th:href="@{/css/viewer.css}">
</head>
<body>
<div class="form">
<div id="iframeEditor"></div>
</div>
<script type="text/javascript" th:src="@{/js/jquery-1.8.2.js}"></script>
<script type="text/javascript" th:src="@{${documentServerApiJs}}"></script>
<script type="text/javascript" th:src="@{/js/editor.js}"></script>
<!-- 先通过 th:inline=“javascript” 添加到标签,这样js代码即可访问model中的属性 -->
<script th:inline="javascript">
// js 中可以通过“[[${xxx}]]” 格式获得实际的值
Editor.init([[${document}]], [[${documentEditParam}]]);
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
This is a page
</body>
</html>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论