Skip to main content

逐步建立

想要一次把所有事物建立成功是不太可能的，我們將透過一步一步小型的、容易測試的步驟，來完成建置。

{"BaseFileName": "test.txt", "Size": 11}
  1. 在專用伺服器或虛擬機器中安裝 OxOffice Online，並確定瀏覽器可以正確連接到 OxOffice Online。 
    https://<WOPI 客戶端 URL(OxOffice Online)>:<port>/hosting/discovery

  2. 在您的應用程式增加 WOPI REST API 的接口。目前只須在 GET 請求時，回應「Hello World」即可，您可以透過瀏覽器進行測試。必要的話，需要用伺服器 rewrite 功能，將 REST API 導向您設計的接口。此時，測試該接口，應該會得到 Hello World 的回應：

    https://<WOPI 主機 URL>/<...>/wopi/files/<file id>/contents

  3. 實作 CheckFileInfo 接口。確保以下位址：

    https://<WOPI 主機 URL>/<...>/wopi/files/<file id>

    回應 JSON 內容，類似：

    {"BaseFileName": "test.txt", "Size": 11}11}

     

  4. At this moment, you will be able to see a constructed document in Collabora Online: Create a URL by concatenating URL from the discovery XML (see the point 1), and add WOPISrc=https://<WOPI host URL>/<...>/wopi/files/<file id> at the end, resulting in URL like

    https://<WOPI client URL>:<port>/browser/<hash>/cool.html?WOPISrc=https://<WOPI host URL>/<...>/wopi/files/<id>

    Create a small test.html file containing:

    1<html><body>
2        <form action="...URL you constructed..." enctype="multipart/form-data" method="post">
3        <input name="access_token" value="test" type="hidden"/>
4        <input type="submit" value="Load CollaboraOxOffice Online"/>
5        </form>
6</body></html>

    When you load it in the browser and click the Load Collabora Online button, it will open a text document that shows “Hello World” provided by the WOPI endpoints. If your WOPI host is on a different machine than Collabora’s, make sure to add that host along with the port in the configuration file coolwsd.xml under <storage> → <wopi> tag.

  5. From this point, you have the basics working, and you have to extend the JavaScript pieces: Create an iframe that will contain the Collabora Online, and provide that with a real access token. From the Collabora Online point of view, the access token can be any random text or number that contains just numbers, characters, and underlines.

  6. Update your REST endpoints so that they provide real data instead of a synthesized “Hello World” and hard-coded document length.

  7. Implement the PutFile end point, so that the results of editing can appear in your file storage too. To do this, implement the POST request to

    https://<WOPI host URL>/<...>/wopi/files/<id>/contents

  8. Either implement the PutRelativeFile endpoint, so that the option to Save As appears in the UI, or change CheckFileInfo to return UserCanNotWriteRelative with value true if you don’t want to do that yet.


Back to top