DocEditor

DocsAPI.DocEditor is the main class of ONLYOFFICE Docs API. It is the entry point for creating, configuring, and managing a document editor embedded in a web page.

DocsAPI

DocsAPI is the global namespace provided by the ONLYOFFICE Docs API script:

<script type="text/javascript" src="https://documentserver/web-apps/apps/api/documents/api.js"></script>

Where documentserver is the name of the server with ONLYOFFICE Docs installed.

Once the script is loaded, the DocsAPI object becomes available on the window and exposes the DocEditor constructor.

tip

You can preload static resources (HTML, CSS, JS, fonts) into the browser cache before opening a document to speed up the first-time loading.

Constructor

To create an editor instance, call the DocEditor constructor with two arguments — the id attribute of an existing HTML element where the editor will be rendered, and a configuration object:

const docEditor = new DocsAPI.DocEditor("placeholder", config);

Parameter	Type	Description
placeholder	string	The id attribute of an existing HTML element where the editor will be rendered (e.g. "placeholder" for <div id="placeholder">).
config	object	The configuration object containing the document, editor, and event parameters.

Instance methods

The constructor returns a docEditor object. Use it to call methods that control the editor at runtime — download files, manage version history, update sharing settings, and more:

const docEditor = new DocsAPI.DocEditor("placeholder", config);

// later, when handling events or user actions:
docEditor.downloadAs("pdf");
docEditor.destroyEditor();

See Methods for the full list.

Events

Events are functions passed in the config.events section. They allow the integrator to respond to editor actions — for example, when the document is ready, when the user requests to save, or when collaborative changes arrive:

const config = {
  events: {
    onAppReady() {
      console.log("Editor is ready");
    },
    onDocumentStateChange(event) {
      console.log("Document modified:", event.data);
    },
  },
};

const docEditor = new DocsAPI.DocEditor("placeholder", config);

See Events for the full list of available events.

Minimal example

const config = {
  document: {
    fileType: "docx",
    key: "Khirz6zTPdfd7",
    title: "Example Document Title.docx",
    url: "https://example.com/url-to-example-document.docx",
  },
  documentType: "word",
  editorConfig: {
    callbackUrl: "https://example.com/url-to-callback.ashx",
  },
};

const docEditor = new DocsAPI.DocEditor("placeholder", config);

Replace example.com with the host of your document storage service. The callbackUrl is the endpoint on your server where ONLYOFFICE Docs sends document status updates and saved files. See the How it works section to find out more on ONLYOFFICE Docs service client-server interactions.

For the complete configuration structure with all available sections and parameters, see Configuration overview.

caution

When JWT validation is enabled on your document server (the default configuration), the config must include a matching token. Sign the config with your document server's JWT secret.