How to integrate online editors into your own web site on Node.js

Introduction

To integrate ONLYOFFICE online editors into your own website on Node.js you need to download and install ONLYOFFICE editors on your local server and use the Node.js Example for their integration. We will show you how to run the Node.js example on Windows OS and Linux OS.

The integration examples are used to demonstrate document editors functions and the ways to connect Document Server to your own application. DO NOT USE these examples on your own server without PROPER CODE MODIFICATIONS!

This guide will show you the sequence of actions to integrate the editors successfully.

First, download the ONLYOFFICE Editors (the ONLYOFFICE Document Server).

See the detailed guide to learn how to install Document Server for Windows.

Download the Node.js Example from our site.

You need to connnect the editors to your web site. For that specify the path to the editors installation in the config/default.js file:

"siteUrl": "http://documentserver/"

where the documentserver is the name of the server with the ONLYOFFICE Document Server installed.

If you want to experiment with the editor configuration, modify the parameters it the \views\editor.ejs file.

Download and install the node.js enviroment which is going to be used to run the Node.js project. Please follow the link at the oficial website: https://nodejs.org/en/download/, choosing the correct version for your Windows OS (32-bit or 64-bit).

We will run the code in Node.js runtime environment and will interact with it using the command line interface (cmd).

  1. Launch the Command Prompt and switch to the folder with the Node.js project code, for example:
    cd /d C:\OnlineEditorsExampleNodeJS
  2. Node.js comes with a package manager, node package manager (npm), which is automatically installed along with Node.js. To run the Node.js code install the project modules using the following npm command:
    npm install

    A new node_modules folder will be created in the project folder.

  3. Run the project using the Command Prompt:
    node bin/www
  4. See the result in your browser using the address:
    http://localhost:3000

In case the example and Document Server are installed on different computers, make sure that your server with the example installed has access to the Document Server with the address which you specify instead of documentserver in the configuration files. And you must also make sure that the Document Server in its turn has access to the server with the example installed with the address which you specify instead of example.com in the configuration files.

First, download the ONLYOFFICE Editors (the ONLYOFFICE Document Server).

See the detailed guide to learn how to install Document Server for Linux.

Step 2. Install the prerequisites and run the web site with the editors

  1. Install Node.js:
    curl -sL https://deb.nodesource.com/setup_4.x | sudo bash -
    apt-get install nodejs
  2. Download the archive with the Node.js Example and unpack the archive:
    wget http://api.onlyoffice.com/app_data/editor/Node.js%20Example.zip
    unzip Node.js\ Example.zip
  3. Change the current directory for the project directory:
    cd ~/OnlineEditorsExampleNodeJS/
  4. Install the dependencies:
    npm install
  5. Edit the config/default.js configuration file. Specify the name of your local server with the ONLYOFFICE Document Server installed.
    nano config/default.js

    Edit the following lines:

    "siteUrl": "http://documentserver/"
    

    Where the documentserver is the name of the server with the ONLYOFFICE Document Server installed.

  6. Run the project with Node.js:
    nodejs bin/www
  7. See the result in your browser using the address:
    http://localhost

In case the example and Document Server are installed on different computers, make sure that your server with the example installed has access to the Document Server with the address which you specify instead of documentserver in the configuration files. And you must also make sure that the Document Server in its turn has access to the server with the example installed with the address which you specify instead of example.com in the configuration files.

If you integrated the editors successfully the result should look like the demo preview on our site.