Page History

title

Panel

borderColor	green
borderWidth	1
titleBGColor	#ddffcc
borderStyle	solid
title	Definition

borderColor

purple

borderWidth

1

titleBGColor

#ddccff

borderStyle

solid

Manage API Key userview

element allows you to control access to API documents

menu handles API call authentication for APIs created with the API Builder.

Panel

New Feature

This is a new feature in Joget DX.

...

userview menu is already bundled in the API Builder plugin.

Table of Contents

Configure API Access

...

Image Removed

Figure 1: Manage API Key in a userview

Image Removed

Figure 2: Manage API Key in a userview - Log view

Image Removed

Figure 3: Manage API Key in a userview - New/Edit access

Name	Description
API Key

A

An automatically generated unique identifier used to authenticate to an API document.

Authentication Method

Methods available:

API Key
API Key & Token
Basic access authentication

Required keys in the request header:

Method

Required Key(s)

API Key

api_id (API Document ID obtained from API Properties)
api_key (The automatically generated API Key)

API Key & Token

api_id
api_key
token (Value derived from configured token pattern)

Basic access authentication

api_id
api_key
Authorization (Base64 encoded value of username:password)

Tip

title	Example

For username "admin" & password of "admin":

admin:admin → Basic YWRtaW46YWRtaW4=

API Secret

(API Key & Token method)

A secret string

used for authentication

commonly used in the token pattern.

Token

Pattern

(API Key & Token method)

Token Pattern consists of hash algorithm and variables.

Format:

HASH(

MD5,

PATTERN)

Supported hash algorithm:

MD5
SHA-1

,

SHA-256

and

SHA-512

) and variables (

Supported variables:

{api_key}

,

{api_secret}

,

{date_pattern} (current date time)

.

Example

Examples:

SHA-256({api_key}::{api_secret}::{yyyy-MM-dd HH:mm})
MD5({api_secret})

Note
Token pattern must contain at least one and only one hash algorithm.

Info

icon	false

The {date_pattern} also determines how long the token is cached client-side. i.e the pattern "yyyy-MM-dd" will have the token cache to expire and regenerate every day

Permission Plugin

(Basic access authentication method)

Select a permission plugin and configure its properties.

Find list of available permission plugins here.

Custom Authenticator Plugin

Select a custom authenticator plugin and configure its properties.

This option is shown only if a plugin of that type exist in the system.

Learn more about API Authenticator plugin here.

Custom Authentication Method

Methods available:

Add as additional authentication method
Replace the default authentication method

Note:

Note
API Key is always required regardless of method selected

above

here.

Domain Whitelist

Domain whitelist to allow API calls.

Info

title	Example

"localhost;www.joget.org;dev.joget.org”, or "*" to allow from everywhere.

IP Address Whitelist

IP address whitelist to allow API calls.

Info

title	Example

"127.0.0.1;192.168.0.1”, or "*" to allow from everywhere.

Remark

Any remark or description for the created API access.

...

Save Log?

Display Log View in a popup form.

Image Added

Figure 1: Manage API Key in a userview

Image Added

Figure 2: Manage API Key - Log view

Image Added

Figure 3: Manage API Key - New/Edit access

Configure Userview Menu

...

Image Removed

...

Manage API Key properties

previously in further

Name

Description

ID

Menu element unique ID. Joget will use this ID in the URL if the Custom ID is empty.

Custom ID

Item link slug. Optional field.

Info

title	Unique field

Value Ensure that value defined here must be unique to the rest of the Userview Menus as the first matching name will be called uponis unique to other userview menus in the app, since the first matching/conflicting ID will take precedence in page loading.

Label

Menu label. Mandatory field.

API Document Name

Select an API Document that you have created

with the API Builder, for

configuration of access in runtime.

Image RemovedImage Added

Figure 54: Manage API Key properties -

UI

...

List

...

Name Description
Button Position
Top Left
Top Right
Bottom Left
Bottom Right
Top Left & Bottom Left
Top Right & Bottom Right
Selection Type
Multiple
Single
Selector Position
Left
Right
Both left & right
No
New Record Button Label
New record button label to show in listing.
Edit Link Label
Edit button label to show in listing.
Delete Button Label
Delete button label to show in listing.
Custom Header
Custom HTML to show above the listing.
Custom Footer Custom HTML to show below the listing.

Image RemovedImage Added
Figure 65: Manage API Key properties - UI (List)

Add

...

Name Description
Cancel Button Label Cancel button label to show in add new record form.
Save Button Label Save button label to show in add new record form.
Message to show after Form saved Message to show in a browser popup, after new record is saved.
Custom Header Custom HTML to show in header of add new record form.
Custom Footer Custom HTML to show in footer of add new record form.

Image RemovedImage Added
Figure 76: Manage API Key properties - UI (Add)

Edit

...

Name Description
Readonly If checked, the form will be rendered as read-only and not editable anymore.
Display Fields as Labels when in Readonly?
When the form is in read-only mode, determines if values should be displayed as is (label form) instead of being bounded shown in original input formfields.
Back Button Label
Back button label.
Default value: Back
Save Button Label
Save button label.
Default value: Save
Message to show after Form saved Message to show in a browser popup, after a record is successfully edited.
Custom Header Custom HTML to show in header of edit record form.
Custom Footer Custom HTML to show in footer of edit record form.
Image Added
Figure 7: UI (Edit)

Performance & Offline

Image Modified

Figure 8: Manage API Key properties - Performance & Offline

Cache Settings

Panel

borderColor	purple
borderWidth	1
titleBGColor	#ddccff
borderStyle	solid
title	Performance

You can configure the Performance settings in this Userview Element Menu which allows one to cache existing content for improved performance and loading speed.

PWA Offline Settings

Name	Description
Enable cache for offline support	Once enabled, this userview element will be accessible in the event of an offline environment.

...

Space shortcuts

Page tree

Versions Compared

Old Version 14

New Version Current

Key

Configure API Access

Configure Userview Menu

Manage API Key properties

UI

List

Add

Edit

Performance & Offline

Name	Description
Button Position	Top Left Top Right Bottom Left Bottom Right Top Left & Bottom Left Top Right & Bottom Right
Selection Type	Multiple Single
Selector Position	Left Right Both left & right No
New Record Button Label	New record button label to show in listing.
Edit Link Label	Edit button label to show in listing.
Delete Button Label	Delete button label to show in listing.
Custom Header	Custom HTML to show above the listing.
Custom Footer	Custom HTML to show below the listing.

Name	Description
Cancel Button Label	Cancel button label to show in add new record form.
Save Button Label	Save button label to show in add new record form.
Message to show after Form saved	Message to show in a browser popup, after new record is saved.
Custom Header	Custom HTML to show in header of add new record form.
Custom Footer	Custom HTML to show in footer of add new record form.

Name	Description
Readonly	If checked, the form will be rendered as read-only and not editable anymore.
Display Fields as Labels when in Readonly?	When the form is in read-only mode, determines if values should be displayed as is (label form) instead of being bounded shown in original input formfields.
Back Button Label	Back button label. Default value: Back
Save Button Label	Save button label. Default value: Save
Message to show after Form saved	Message to show in a browser popup, after a record is successfully edited.
Custom Header	Custom HTML to show in header of edit record form.
Custom Footer	Custom HTML to show in footer of edit record form.