app.js Script

This script is the key component of an App Extension and is the only file that is evaluated when processing an extension. If this file is not present the extension will not be loaded. This JS script has three key callback functions: dependecies, ignoreExtension and server. The table below provides a breakdown of each of the callback methods:

Callback Method	Description
`app.dependencies`	Defines whether the app extension is dependent on one or more app extensions. Thereby, this affects the order in which the actions are applied. Add an array of app extensions to define multiple app extension dependencies. ES gives the most dependent app extension the highest precedence over the other dependent app extensions, and executes it the last.
`app.ignoreExtension`	Indicates whether the extension should be processed or not. Thereby, this callback method is used to disable all the customizations to all the asset types, which are defined in the app extension (`app.js`).
`app.server`	Allows pages and API endpoints to be specified. For more information, see app.server.
`app.pageHandlers`	Defines callback functions that are invoked when a page is requested. For more information, see app.pageHandlers.
`app.apiHandlers`	Defines callback functions that are invoked when an API is requested. For more information, see app.apiHandlers.

app.dependencies

You can use the app.dependencies callback method in an app extension to override pages corresponding to one or more extensions.

Example - Overriding a page in one or more extensions

The wso2_greg extension can override the top-assets page in ES, by defining a dependency for an extension as shown in the screenshot below:

app.pageHandlers

You can hook into page events (i.e., onPageLoad event) using the pageHandlers callback method. The following table lists the supported callback method:

Property	Description
`onPageLoad`	Called before the page controller is invoked.

Example - Securing pages

This callback is used to secure pages as shown in the screenshot below:

app.apiHandlers

The apiHandlers callback method is invoked at key events of an API call. The following table lists the supported callback method:

Property	Description
`onApiLoad`	Called before the API controller is invoked.

Example - Checking if the API can be accessed without authentication

The screenshot below shows its usage when used to check if an endpoint can be accessed anonymously:

app.server

The app.server callback method allows you to define new pages and APIs. In addition, it allows you to override existing endpoints in other extensions, by utilizing the app.dependencies property. The following table lists the supported properties in the app.server callback method:

Property	Description
`asset.server.endpoints.apis`	An array of API endpoints.
`asset.server.endpoints.pages`	An array of page endpoints.

The screenshot below shows the implementation of the top assets and my items pages of the ES Store.

The following table lists the supported properties:

Property	Description
`title`	The name that is used as the title of the page.
`url`	The URL pattern against which requests should be matched.
`path`	The path to the controller that services requests. If the the endpoint is a page, the path to the `pages` directory is prefixed.
`secured`	Whether an authentication process takes place before a user is allowed to access a page or API. If this property is not specified, then ES assumes that the endpoint is publicly accessible. This is an optional property.