onlyoffice使用，前端+java

最新推荐文章于 2024-07-18 14:13:30 发布

学习要趁早z

最新推荐文章于 2024-07-18 14:13:30 发布

阅读量6.7k

点赞数 3

分类专栏： office相关文章标签：前端 java 开发语言

本文链接：https://blog.csdn.net/qq_42677452/article/details/116197517

版权

office相关专栏收录该内容

6 篇文章 2 订阅

订阅专栏

该博客介绍了如何在前端页面中集成ONLYOFFICE文档编辑器，通过JavaScript API设置文档参数，并在后台处理文件流，实现文件的加载与编辑。回调URL用于文件状态更新，尤其是文件保存时的处理。注意文件类型、权限配置以及文件流的正确处理。

摘要由CSDN通过智能技术生成

一、前端

onlyoffice使用

页面引用

<head>
	<script type="text/javascript" src="http://192.168.58.138:9001/web-apps/apps/api/documents/api.js"></script>
</head>
<body>
	<div id="placeholder"></div>
</body>

加载文档

var docEditor = new DocsAPI.DocEditor("placeholder", {//placeholder为要放入的位置
				"document" : {
					"fileType": "docx",//文件类型
					"key": "EF12KFF",//docserver会通过key读取缓存，如果文档进行修改要修改key值
					"title": "测试文档",//显示文档标题
					"url": "http://192.168.0.1:8080/test/onlyoffice/onlyofficeLoad"//可以为静态地址，也可为方法地址
				},
				"documentType": "text",//onlyoffice可打开word、excel、ppt==
				"editorConfig": {
					"callbackUrl": "",//回调地址，一定要保证docserver可以请求到，否则开不开文件
					"lang": "zh-CN",
					"mode": "view",//只读view,编辑edit
				"permissions":{
					"comment": false,//是否可以评论
					"download": false,//是否可以下载
					"edit": true,//是否可以编辑
					"fillForms": true,//
					"print": false,//是否可以打印
					"review": true//
				}
			});

后台方法

url：获取文件的请求，使用以下方法返回要打开的文件流

@RequestMapping(value = "/onlyofficeLoad")
@ResponseBody
public void onlyofficeLoad(HttpServletRequest request, HttpServletResponse response){
	response.reset();
   	fileName = URLEncoder.encode(fileName, "UTF-8");
    fileName = fileName.replaceAll("\\+", "%20");

    response.setHeader("Content-Disposition", "attachment; filename=\"" + fileName + "\"; " + "filename*=UTF-8''" + fileName);
    response.setCharacterEncoding("UTF-8");
    response.setContentType("application/octet-stream");//注意类型一定要是octet-stream
    response.setContentLength(inputStream.available());
    OutputStream sos = response.getOutputStream();
    byte[] bytes = new byte[1024 * 512];
    int i = -1;
    while ((i = inputStream.read(bytes)) != -1){
    	sos.write(bytes, 0, i);
    }
    sos.flush();
    StreamUtils.closeStream(inputStream);
}

callbackUrl：当文件打开或关闭都会调用改方法（文件关闭会在10秒后发送请求）

@RequestMapping(value = "/generateReport", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
@ResponseBody
public void generateReport(HttpServletRequest request, HttpServletResponse response){
PrintWriter writer = null;
	try{
        String body = "";
        try{
            writer = response.getWriter();
            Scanner scanner = new Scanner(request.getInputStream());
            scanner.useDelimiter("\\A");
            body = scanner.hasNext() ? scanner.next() : "";
            scanner.close();
        } catch (Exception ex) {
            writer.write("get request.getInputStream error:" + ex.getMessage());
            return;
        }
		if (body.isEmpty()) {
            writer.write("empty request.getInputStream");
            return;
        }

        JSONParser parser = new JSONParser();
        JSONObject jsonObj = (JSONObject) parser.parse(body);
        int status = Integer.parseInt(jsonObj.get("status").toString());
        int saved = 0;
        //statusAPI见下表
        if (status == 2 || status == 3 || status == 6) {
            String downloadUri = (String) jsonObj.get("url");
            try {
                URL url = new URL(downloadUri);
                java.net.HttpURLConnection connection = (java.net.HttpURLConnection) url.openConnection();
                InputStream stream = connection.getInputStream();
                if (stream == null){
                    throw new Exception("Stream is null");
                }

                filePath = "";
                File fileDir = new File(filePath);
                if (!fileDir.isDirectory()){
                    fileDir.mkdirs();
                }
                File savedFile = new File(upload_file_path + filePath + fileName);
                if (savedFile.exists()) {
                    savedFile.delete();
                }
                try (FileOutputStream out = new FileOutputStream(savedFile)) {
                    int read;
                    final byte[] bytes = new byte[1024];
                    while ((read = stream.read(bytes)) != -1){
                        out.write(bytes, 0, read);
                    }
                    out.flush();
                }
                connection.disconnect();
            } catch (Exception ex){
                saved = 1;
                ex.printStackTrace();
            }
        }
        writer.write("{\"error\":" + saved + "}");
        System.out.println("保存成功");
    } catch (ParseException e) {
        System.out.println("保存异常");
        writer.write("{\"error\":\"-1\"}");
        e.printStackTrace();
    }
}

注：上述代码逻辑不可改变，docserver会根据writer.write()对文件进行操作。

回调的status共有6种，仅当状态为2,3,6时会去保存文件

status
1	正在编辑文件，
2	文件已准备好保存，
3	发生文件保存错误，
4	文件已关闭且未做任何更改，
6	正在编辑文档，但保存了当前文档状态，
7	强制保存文档时发生错误。

————————————————
版权声明：本文为CSDN博主「学习要趁早z」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_42677452/article/details/116197517

学习要趁早z

关注

3
点赞
踩
38

收藏

觉得还不错? 一键收藏
打赏
10
评论
onlyoffice使用，前端+java

一、前端onlyoffice使用页面引用<head> <script type="text/javascript" src="http://192.168.58.138:9001/web-apps/apps/api/documents/api.js"></script></head><body> <div id="placeholder"></div></body>加载文档var docEd
复制链接

扫一扫