MS Office

This guide explains how to reference and initialize the @glue42/office library in your web app so it can interoperate with any of the MS Office products supported by io.Connect Desktop.

After completing the steps in this guide, you can read the respective development guides to learn how your app can interact with specific MS Office products.

Programming Experience with JavaScript

We assume you are a front-end JavaScript developer, or a full-stack developer with sufficient JavaScript knowledge. This guide uses ECMAScript 6 (ES6) in the examples, but ES6 knowledge isn't required to use the API.

All APIs return Promises. If you aren't comfortable using Promises and prefer Node.js-style callbacks, you can use nodeify to convert Promises to Node.js-style callbacks.

io.Connect Desktop Installation

You can download the io.Connect Desktop trial version from here.

The @glue42/office library is available both as an NPM module and as a standalone transpiled JavaScript file in %LocalAppData%\interop.io\io.Connect Desktop\SDK\Glue4OfficeJS\js\web-bundle.

You can reference the library in a <script> tag:

<script type="text/javascript" src="office.min.js"></script>

The browserified JavaScript file is also a CommonJS module, which you can require/import.

CommonJS:

const Glue4Office = require("@glue42/office");

ES6:

import Glue4Office from "@glue42/office";

When you reference the standalone JavaScript file, it will expose a global factory function called Glue4Office.

If you have imported or required the library, the function will be available with the name you specified in the import or require statement.

Assuming you stick to the default Glue4Office name, to initialize the library, you need to call the function Glue4Office and specify which MS Office apps you want to interoperate with. The function returns a Promise, which will resolve with an initialized instance of the library.

Example:

const officeConfig = {
    application: "MS Office Interop",
    excel: true,        // enable Excel interop
    word: true,         // enable Word interop
    outlook: false      // disable Outlook interop
}
Glue4Office(officeConfig)
    .then(office => {
        // office is a reference to the @glue42/office API
        window.office = office;    // expose office as a global variable
        // use office
    })
    .catch(console.error)

If your app is already loading io.Connect, you can initialize @glue42/office by passing an initialized io.Connect library instance in the configuration object:

IODesktop()
    .then(io => {
        window.io = io;          // expose io as a global variable
        const officeConfig = {
            io,
            excel: true,            // enable Excel interop
            word: true,             // enable Word interop
            outlook: false          // disable Outlook interop
        }
        return Glue4Office(officeConfig)
    })
    .then(office => {
        // office is a reference to the @glue42/office API
        window.office = office;    // expose office as a global variable
        // use office
    })
    .catch(console.error)

Once you have obtained an initialized reference, you can start interacting with the MS Office Adapters:

office.excel.openSheet(...);

office.word.openDocument(...);

office.outlook.newEmail(...);

The best place to render your app is when the Promise is resolved (in the then clause above). You would typically expose a global reference to the library and then render your app.

Glue4Office(officeConfig)
    .then(office => {
        window.office = office;        // expose office as a global var
        ReactDOM.render(
            appElement,
            document.getElementById("root"));
    });

Glue4Office(officeConfig)
    .then(office => {
        window.office = office;        // expose office as a global var
        platformBrowserDynamic().bootstrapModule(AppModule);
        // or
        platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);
    });