Manage API Key Menu

Introduction

The Manage API Key UI menu handles API call authentication for APIs created with the API Builder. This menu is bundled with the API Builder plugin and offers various methods for API authentication, including API Key, API Key & Token, and Basic Access Authentication.

  • Manage API Key in a UI
  • Manage API Key - Log view

Get started

Configure API access properties

Fields to configure:

  • API Key: An automatically generated unique identifier to authenticate an API document.
  • Authentication Method: Methods available:
    • API Key
    • API Key & Token
    • Basic access authentication

    Required keys in the request header:

    • 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)
      Example
      For username "admin" & password of "admin": admin:admin  Basic YWRtaW46YWRtaW4=
  • API Secret (API Key & Token method): A secret string commonly used in the token pattern.
  • Token Pattern (API Key & Token method): Token Pattern consists of hash algorithm and variables.

    Format:

    • HASH(PATTERN)

    Supported hash algorithm:

    • MD5
    • SHA-1
    • SHA-256
    • SHA-512

    Supported variables:

    • {api_key}
    • {api_secret}
    • {date_pattern} (current date time)

    Examples:

    • SHA-256({api_key}::{api_secret}::{yyyy-MM-dd HH:mm})
    • MD5({api_secret})
    Token pattern must contain at least one and only one hash algorithm.
    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 daily.
  • Permission Plugin (Basic access authentication method): Select and configure a permission plugin for authentication. For more information, see Permission Control and find available permission plugins.
  • Custom Authenticator Plugin: Select a custom authenticator plugin and configure its properties. This option is shown only if a plugin of that type exists in the system. For more information, see the API Authenticator plugin.
  • Custom Authentication Method: Methods available:
    • Add as additional authentication method.
    • Replace the default authentication method.
    API Key is always required regardless of the method selected here.
  • Domain Whitelist: Domain whitelist to allow API calls.
    Example
    "localhost;www.joget.org;marketplace.joget.org”, or "*" to allow from everywhere.
  • IP Address Whitelist: IP address whitelist to allow API calls.
    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.

Configure UI menu

Manage API key properties

Fields to configure:

  • ID: Menu element unique ID. If the Custom ID is empty, Joget will use this ID in the URL.
  • Custom ID: Item link slug. Optional field.
    Unique field
    Ensure that value defined here is unique to other UI 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 to configure access in runtime.

UI

UI (List)

Fields to configure: 

  • 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.

UI (Add)

Fields to configure:

  • 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.

UI (Edit)

Fields to configure: 

  • 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 shown in original input fields.
  • 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.

Performance & offline

You can configure the performance settings in this UI Menu, which allows you to cache existing content for improved performance and loading speed. Read more at Performance Improvement with UI Caching.

Cache settings

  • Scope
  • Duration (s)

PWA offline settings

  • Enable cache for offline support: Once enabled, this UI element will be accessible in the event of an offline environment.
Created by Julieth Last modified by Aadrian on Nov 26, 2024