翻譯|使用教程|編輯:李顯亮|2020-07-29 11:05:22.963|閱讀 282 次
概述:本文將介紹如何快速實現您的服務器與應用程序對接,助您輕松高效使用 Spire.Cloud 在線編輯云端 Office。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
你在尋找一款既能在線編輯office文件,又能實現與web應用程序對接的軟件嗎?好巧,冰藍公司最新推出Spire.Cloud,搭載了基于云端的Office在線編輯器和WEB API開發接口,既能安全穩定地實現WEB網頁端在線查看、編輯Office文檔;又能在服務器端通過代碼調用接口簡單高效地實現讀寫Office文檔內容。
Spire.Cloud提供了四種語言的SDK(包括.NET、Java、python、PHP),你可以點擊下載Spire.Cloud Web SDK。
Spire.Cloud 私有化部署完成后,可以在本地服務器上使用 Spire.Cloud 在線編輯服務在線創建、編輯、保存和打印 Office (Word/Excel/PowerPoint) 文檔;或使用 WEB API,在應用程序中操作 Office (Word/Excel/PowerPoint) 及 PDF 文檔,然后使用在線編輯查看結果文檔。
本文將介紹如何快速實現您的服務器與應用程序對接,助您輕松高效使用 Spire.Cloud 在線編輯云端 Office。
接口調用配置關鍵參數說明:
"appid" 和 "appkey" 設置為空,以服務器 192.168.0.110 為例:
注:文件夾 cloud 由 storage web api 創建,test.docx 文檔是使用 word web api 創建的新文檔
在 SDK 調用前需要進行配置,完整示例如下:
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><link rel="icon" href="/favicon.ico" type="image/x-icon" /><title> Spire.Office </title> <style> 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; } </style> <script language="javascript" type="text/javascript" src="http://192.168.0.110:8000/web/editors/api/documenteditor.js"></script> <script type="text/javascript" language="javascript"> var docEditor; var fileName = ""; var lang = "zh"; var fileType = ""; var token = null; var appid = null; var appkey = null; var innerAlert = function (message) { if (console && console.log) console.log(message); }; var onReady = function () { innerAlert("Document editor ready"); }; var onDocumentStateChange = function (event) { var title = document.title.replace(/\*$/g, ""); document.title = title + (event.data ? "*" : ""); }; var onRequestEditRights = function () { location.href = location.href.replace(RegExp("action=view\&?", "i"), ""); }; var onError = function (event) { if (event) innerAlert(event.data); }; var onOutdatedVersion = function (event) { location.reload(true); }; function ajax(options) { options = options || {}; var method = (options.type || "GET").toUpperCase(), url = options.url, queryString = null; if (!url) return; if (options.data) { queryString = []; for (var attr in options.data) { queryString.push(attr + "=" + options.data[attr]); } queryString = queryString.join("&"); } if (method === "GET" && queryString) { url += "?" + queryString; queryString = ""; } var xhr = new XMLHttpRequest(); xhr.open(method, url, true); if (method === "POST") xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); xhr.send(queryString); xhr.onreadystatechange = function () { if (xhr.readyState === 4) { if (xhr.status === 200) { var data = xhr.responseText; if (options.dataType === "json") data = JSON.parse(data); options.success && options.success(data); } else { options.error && options.error(xhr.status); } } } } var callbackfn = function (result) { if (result && result.data) { var data = result.data, fileName = data[0], url = data[1]; if (fileName.indexOf('=') > -1) fileName = fileName.split('=')[1]; var host1 = location.hostname; var host ='//192.168.0.110:8000'; ajax({ url: '//' + host + '/webeditor.ashx?type=save', type: 'post', data: { 'filename': fileName, 'fileuri': url }, dataType: 'json', async: false, success: function (json) { if (json.code == 200 || json.code == '200') { alert('保存成功'); } else { this.error(json, '保存失敗'); } }, error: function (json, msg) { alert(msg); } }); } }; var connectEditor = function () { var type = 'desktop'; if (type == "desktop") { var app = navigator.appVersion; if (app.toLowerCase().indexOf('window') != -1) { type = "desktop"; } else { type = "mobile"; } }; var urlString ="http://192.168.0.110:3000/files/192.168.0.112/default/cloud/test.docx"; var arrfn = urlString.split("."); var strp= arrfn[arrfn.length - 1]; var documentTypeValue=null; switch(strp){ case "xls": case "xlsx": case "xlsm": case "xlt": case "xltx": case "xltm": case "ods": case "fods": case "ots": case "csv": documentTypeValue="spreadsheet"; break; case "pps": case "ppsx": case "ppsm": case "ppt": case "pptx": case "pptm": case "pot": case "potx": case "potm": case "odp": case "fodp": case "otp": documentTypeValue="presentation"; break; default: documentTypeValue="document"; break; } docEditor = new OfficeAPI.DocumentEditor("iframeEditor", { width: "100%", height: "100%", editorType: type, isReadOnly: 'False', documentType: documentTypeValue, document: { key: "", title: fileName, url: urlString, fileType: fileType, info: { author: "Me", created: "2019/11/22" } }, editorConfig: { mode: 'True', lang: lang, callbackUrl: "", user: { id: "", name: "e-iceblue", token: token, appid: appid, appkey: appkey }, customization: { goback: { url: "" } } }, events: { 'onReady': onReady, 'onDocumentStateChange': onDocumentStateChange, 'onRequestEditRights': onRequestEditRights, 'onError': onError, 'onOutdatedVersion': onOutdatedVersion, 'onSave': callbackfn } } ); }; if (window.addEventListener) { window.addEventListener("load", connectEditor); } else if (window.attachEvent) { window.attachEvent("load", connectEditor); } </script> </head> <body> <form name="form1" method="post" action="./docEditor.aspx?fileID=demo+(2).docx&lang=zh" id="form1"> <div> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTkyMjc5MTU4M2RkBQQQBsVcOHQbzTlwYapiES2Trc9Z/U4CC+r9rluZubc=" /> </div> <div> <input type="hidden" name="__VIEWSTATEGENERATOR" id="__VIEWSTATEGENERATOR" value="C2EAC0DE" /> </div> <div id="iframeEditor"> </div> </form> </body>
本站文章除注明轉載外,均為本站原創或翻譯。歡迎任何形式的轉載,但請務必注明出處、不得修改原文相關鏈接,如果存在內容上的異議請郵件反饋至chenjj@fc6vip.cn