Host web applications

In addition to content management and authoring UI features, Content also provides an integrated content delivery network (CDN) powered by Akamai, the market-leading CDN. You can store any web application files in the authoring system and have them automatically published and available from the CDN. You can use this feature to host web applications built with HTML, JavaScript, CSS, images, and any other web resources. These applications can also make JavaScript calls to dynamically access any content. When web application assets are pushed to Content authoring services, they are automatically published to the Content delivery network. This allows website and web application developers to work with their favorite local web development tools and then push the results to Content manually or using an automated build process.

Before you begin

To get started, you need:

• Acoustic Content developer tool "wchtools" to upload web application assets. You can download and install the wchtools from GitHub.
• Samples to try pushing and accessing published web applications that retrieve content and managed assets available at Samples and tools for Acoustic Content.

Pushing assets with wchtools

After installing the tooling as described at GitHub you can then push web application resources stored under the working directory's assets subfolder with the following command:

wchtools push -w dir <working-directory>

or if you are currently in the (the parent of assets/ ) then you may push with just:

wchtools push -w

To see additional information about each file as it is pushed, you may add the -v option to the command line.

By default, auto-publishing is enabled for Content subscriptions, such that each creation or update of an asset should trigger a publish from the authoring system to the content delivery network.

📘

Note:

Web application assets are not displayed in the Content user interface. The assets you work with in the authoring UI are referred to as managed content assets and those are stored in the ../assets/dxdam/ folder when you pull them using wchtools. This is a reserved folder (short for Digital Experience Digital Asset Management) to distinguish those managed assets from other web application assets.

Accessing the published web application from the CDN

After you push the web application assets into Content they are automatically published on the Akamai CDN. They are available with Content subscription-specific URLs like the following:

{Delivery URL}/{file-path}

The {file-path} is the path under the assets folder in the working directory. Think of the assets folder itself as a virtual folder corresponding to the asset service, which also acts as a root for those assets when published. For example, the URL for launching the above sample application would be something like this:
https://content-XX-N.content-cms.com/12345678-9abc-def0-1234-56789abcdef0/sample-article-angular/index.html

The trailing portion of the URL path is the portion of the file path below the working-dir/assets folder, so if your index.html was directly below your assets/ folder, then your URL would be of the form {Delivery URL}/index.html

To find the Delivery URL for your subscription, open the Content user interface, and click Developer > URL information.

Updating web application assets

To make updates or add new web application files, you can just run the wchtools push command again. The modified or new files under your working directory will be pushed to Content.
When you are updating existing files, note that there may be a delay of up to 10 minutes before the change is visible. This is due to caching in the Akamai CDN layer.

Getting started

Try the steps using your Content subscription, with a simple hello world index.html page, then a more advanced page that references a simple js/app.js and css/mystyles.css stylesheet. URLs from the HTML to the related artifacts should be relative (eg. src=js/app/js) so that they continue to work when published relative to the HTML in the subscription URL on the content delivery network.

Once you have the process down, then try pushing and accessing published web applications that retrieve content and managed assets, such as shown in the samples available under Samples and tools for Acoustic Content.

Working with existing applications and local projects

Existing web application projects may not already have the working-dir/assets/ parent folder structure that the wchtools CLI works with, but an existing project may be copied under such a folder structure prior to pushing with the tools either manually, or as the result of a web application build process, which many web projects use to minify and process web application stylesheet(s) prior to publishing.

Expected outcome

As described in the wchtools documentation, wchtools uses a local working directory with a directory structure for the various authoring artifacts. Within the working directory, there is a subfolder for each type of authoring artifact (assets, types, content, etc.). The {working-directory}/assets folder is the root used for web application assets. When you use wchtools to push assets to Content, all the contents of the assets folder will be stored in the Content authoring system and automatically published to the CDN.

In the following example, wch-artifacts is the working directory, and under the assets folder, there is a web application in the sample-article-angular folder.