DocSpace JS SDK samples
The following examples will show you how to use ONLYOFFICE DocSpace SDK based on JavaScript to integrate ONLYOFFICE DocSpace into your own web application, allowing users to create and submit documents directly from your website.
Basic samples
Add tags to room
This example demonstrates how to add custom tags to a room using a button.
Create file
This example demonstrates how to create a new file inside a DocSpace room using a button.
Create folder
This example demonstrates how to create a folder in a room.
Create password hash
This example demonstrates how to generate a secure hash from a plain-text password using DocSpace SDK methods.
Create room
This example demonstrates how to create a new shared room.
Create tag
This example demonstrates how to create a new custom tag in DocSpace using the JavaScript SDK.
Destroy frame
This example demonstrates how to destroy (remove) the embedded DocSpace iframe using the JavaScript SDK.
Get config
This example demonstrates how to retrieve the configuration object of the embedded frame.
Get files and folders list
This example demonstrates how to retrieve both files and folders from a DocSpace room using the JavaScript SDK.
Get files
This example demonstrates how to retrieve a list of files from a room using the JavaScript SDK method.
Get folder info
This example demonstrates how to retrieve information about the current folder in DocSpace using the JavaScript SDK.
Get folders
This example demonstrates how to retrieve a list of folders from a shared DocSpace room using the JavaScript SDK.
Get hash settings
This example demonstrates how to retrieve hash-based settings from the embedded DocSpace frame using the JavaScript SDK.
Get rooms
This example demonstrates how to retrieve a list of available rooms using the JavaScript SDK embedded in a DocSpace frame.
Get selection
This example demonstrates how to retrieve the current selection in the DocSpace interface using the JavaScript SDK.
Get user info
This example demonstrates how to retrieve user information using the JavaScript SDK embedded in a DocSpace frame.
Initialize editor
This example demonstrates how to open a document in the ONLYOFFICE DocSpace editor using the JavaScript SDK method.
Initialize file selector
This example demonstrates how to initialize the DocSpace file selector using the JavaScript SDK.
Initialize frame
This example demonstrates how to initialize the DocSpace view-only frame using the JavaScript SDK method.
Initialize manager
This example demonstrates how to initialize the DocSpace manager using the JavaScript SDK.
Initialize room selector
This example demonstrates how to embed the room selection interface using the JavaScript SDK method.
Initialize system
This example demonstrates how to initialize the DocSpace system interface using the JavaScript SDK.
Initialize viewer
This example demonstrates how to embed a read-only document viewer using the JavaScript SDK method.
Login
This example demonstrates how to log in to DocSpace using the JavaScript SDK by hashing the password.
Logout
This example demonstrates how to log out a user from the DocSpace session using the JavaScript SDK method.
Mark iframe as loaded
This example demonstrates how to explicitly mark the iframe as loaded using the JavaScript SDK method.
Open modal
This example demonstrates how to open a predefined modal window in DocSpace using the JavaScript SDK.
Remove tags from room
This example demonstrates how to remove one or more tags from a room using the JavaScript SDK method.
Set config
This example demonstrates how to update the configuration of the embedded DocSpace frame using the JavaScript SDK.
Set list view
This example demonstrates how to change the file list display mode in DocSpace using the JavaScript SDK.
Advanced samples
Authorization
This examples logs in to the DocSpace account using the specified email and password hash.
Create basic task
This example demonstrates how to create a task management table using the DocSpace JavaScript SDK. When a task is created, a corresponding room is automatically created in DocSpace.
Create file in selected folder
This example creates a file in the selected folder and opens it in the editors.
Customize editors
This example customizes the editor interface so that it looks like your other products (if there are any), and changes the presence or absence of the additional buttons, links, logos and editor owner details.
File manager with task attachments
This example demonstrates how to integrate the DocSpace file selector into a task management interface. Users can attach files to individual tasks by selecting a row and using a modal-based file selector.
Collaborative project workflow
This example shows how to build a freelance project workspace using DocSpace SDK. When a project is created, a room is generated, a freelancer is assigned via API, task files are managed, and the room is archived on completion.
DocSpace chat commands
This example shows how to integrate DocSpace SDK selectors into a chat interface. Users can enter special slash commands to open file or room selectors. Once an item is selected, the link is automatically added to the chat.
Open file in ONLYOFFICE editors
This example opens a file in ONLYOFFICE editors using the file selector.
Manage project folders
This example shows how to create a simple project tracker that interacts with DocSpace. Each project is represented as a folder inside a shared room. You can add or remove projects, and when a project is deleted, all associated files are locked using the ONLYOFFICE API.
Structured room creation
This example demonstrates how to use the DocSpace JavaScript SDK to create a structured workspace for each new client. When a user adds a client, the system:
Create files in rooms
This example demonstrates how to create tasks linked to rooms in DocSpace, and then create files inside those rooms using the JavaScript SDK.
Room selector
This example shows how to use the DocSpace Room Selector within a custom task creation dialog. Each task is linked to a room selection via the JavaScript SDK.
Two-factor authentication
This example demonstrates a two-step verification process using a phone number and 4-digit code before granting access to DocSpace via the SDK. Once verified, users are redirected to a file management interface embedded in an iframe.