Lesson 2: Configure the App

As you log in when creating the application, most of the App Builder credentials get collected in your .env file. However, using the Developer tool requires additional credentials.

The Developer tool used to test custom applications with the actual Asset Compute service requires a cloud storage container for hosting test files and for receiving and displaying renditions generated by applications.

Note: This is separate from the cloud storage of Adobe Experience Manager as a Cloud Service. It applies only to development and testing using the Asset Compute Developer tool.

You can use either S3 or Azure storage for this purpose by adding credentials of (only) one storage solution.

# S3 credentials
S3_BUCKET=
AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=
AWS_REGION=

# Azure Storage credentials
AZURE_STORAGE_ACCOUNT=
AZURE_STORAGE_KEY=
AZURE_STORAGE_CONTAINER_NAME=

Then add the absolute path to the private key file created while adding services to your App Builder Project:

ASSET_COMPUTE_PRIVATE_KEY_FILE_PATH=

Finally, download the file from the Adobe Developer Console. Go to the root of the workspace you are using and click on “Download All” in the upper-right corner. The file is downloaded with <namespace>-<workspace>.json as the filename. Rename it to console.json and move it in the root folder of your project.

Once all the credentials are properly configured, you can execute the application with the Asset Compute Developer Tool by the command aio app run. This deploys the action to Adobe I/O Runtime and starts the development tool, available at http://localhost:9000, on your local machine. You can then upload a test image, specify the rendition request, and then run the test to see the rendition result. Here is an example rendition request:

"renditions": [
    {
        "worker": "https://1234-projectA-workspaceB.adobeioruntime.net/api/v1/web/example-custom-worker-0.0.1/worker",
        "name": "custom_rendition.png"
    }
]

Looking at the action code in actions/<worker-name>/index.js, you can see it simply copies the source file to generate a new rendition.

const { worker, SourceCorruptError } = require('@adobe/asset-compute-sdk');
const fs = require('fs').promises;

exports.main = worker(async (source, rendition) => {
    await fs.copyFile(source.path, rendition.path);
});