Class: UrlParamAdapter

Oracle® JavaScript Extension Toolkit (JET)
16.0.0

F83701-01

Since:
  • 8.0.0
Module:
  • ojurlparamadapter

QuickNav

Description

Class to synchronize CoreRouter state with the browser URL using a query parameter.

This URL adapter uses a query parameter to synchronize router state with the URL (using ojr parameter). All other query parameters are unaffected.

Since this adapter doesn't require that the server understand URL rewriting (see the documentation in UrlPathAdapter), it's often used during development time to easily deploy to simple servers. In order to re-use the same route configurations, it's often desirable to use this adapter as a decorator around another, such as with UrlPathParamAdapter.


new CoreRouter(
  [
    { path: 'orders/{id}/{mode}' }
  ],
  {
    urlAdapter: new UrlParamAdapter(
      new UrlPathParamAdapter(baseUrl)
    )
  }
)

This configuration allows UrlPathParamAdapter to use the path parameters defined for the route, but allows UrlParamAdapter to persist the router state using query parameters, removing the need for a server capable of URL rewriting during development time. The resulting URL will contain UrlParamAdapter's query parameter ojr, which holds the value of the original URL that the delegate created.

When wrapping another adapter inside of UrlParamAdapter, the call to UrlAdapter.getRoutesForUrl will be passed a second arg containing the normalized URL for the router state. Normally (when not wrapped), adapters will read directly from the URL to parse router states. However, when wrapped, the contents of the URL aren't known to the delegate, so it must rely on its decorator to pass it the normalized value.

Prior to deploying to production, UrlParamAdapter is removed from the configuration, leaving UrlPathParamAdapter to parse the parameters and persist them to the URL.

Alternatives to UrlParamAdapter are UrlPathAdapter and UrlPathParamAdapter.

Query Parameters

UrlParamAdapter uses only one query parameter - ojr, to maintain the router state. When manipulating query parameters, ensure this is preserved.

function getOjrParam() {
  return document.location.search.split(/[?&]/).find(kv => kv.split(/=/)[0] === 'ojr')
}

router.go({ path: 'orders' })
.then(state => {
  window.history.replaceState(
    null,
    '',
    `${document.location.pathame}?${getOjrParam()}&deptId=123&empId=456`
  );
  return state;
});

The application is free to manipulate any other query parameter.


Usage

Signature:

class UrlParamAdapter<P extends {[key: string]: any} = {[key: string]: any}>

Generic Parameters
ParameterDescription
PParameters object for the router state
Typescript Import Format
//This class is exported directly as module. To import it
import UrlParamAdapter= require("ojs/ojurlparamadapter");

For additional information visit:


Constructor

new UrlParamAdapter(pathAdapter)

Parameters:
Name Type Argument Description
pathAdapter CoreRouter.UrlAdapter <optional>
An optional path adapter to which this adapter will delegate for translating routes to paths (getUrlForRoutes) and vice-versa (getRoutesForUrl). If not defined, UrlPathAdapter is used.

Methods

getRoutesForUrl(routePathParams) : {Array.<CoreRouter.Route.<P>>}

Build all routes for the current router query parameter.
Parameters:
Name Type Argument Description
routePathParams object <optional>
An optional object that may be passed by the route to parse the route path parameters for the active state. See UrlAdapter#getRoutesForUrl for details.
Returns:

An array of route path parameter names. See UrlAdapter#getRoutesForUrl for details.

Type
Array.<CoreRouter.Route.<P>>

getUrlForRoutes(routes) : {string}

Build the URL path for the given routes. See UrlAdapter#getUrlForRoutes for details.
Parameters:
Name Type Description
routes Array.<CoreRouter.Route.<P>> The set of routes from which the URL will be built.
Returns:

The full URL representing of the given routes

Type
string