Skip to main content

Prerequisites

Business systems use JS SDK to interact with Filez documents. There are two initialization methods:

Method 1: Filez Document Embedded by JS SDK​

Automatically embed Filez document as iframe into the specified container through JS SDK's mount method.

Code Example​

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>JS SDK Embedding Example</title>
</head>
<body>
  <div class="container">
    <div id="box"></div>
  </div>
  <script src="sdk.js"></script>
  <script>
    var app;
    window.onload = async () => {
      // The DOM with id "box", Filez document will be embedded as iframe under it
      app = await ZOfficeSDK.mount(
        "https://zofficedemo.filez.com/docs/app/local/a03a611e-03a9-4a2c-8fe4-9f885ce927ce/edit/content",
        "#box",
        true
      );
      await app.ready();
    }
  </script>
</body>
</html>

Method 2: Filez Document Initially Embedded by Business System​

Business system first embeds document through iframe, then uses JS SDK's connect method to connect to the existing iframe.

Code Example​

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Business System Embedding Example</title>
</head>
<body>
  <div class="container">
    <div id="box">
      <iframe 
        src="https://zofficedemo.filez.com/docs/app/local/a03a611e-03a9-4a2c-8fe4-9f885ce927ce/edit/content" 
        frameborder="0">
      </iframe>
    </div>
  </div>
  <script src="sdk.js"></script>
  <script>
    var app;
    window.onload = async () => {
      // The DOM with id "box", Filez document is embedded as iframe under it
      app = await ZOfficeSDK.connect("#box", true);
      await app.ready();
    }
  </script>
</body>
</html>
Selection Suggestion
  • Method 1: Suitable for scenarios where document loading is completely controlled by JS SDK
  • Method 2: Suitable for scenarios where business system needs to customize iframe attributes
Last updated on