Gateway

Gateway portal customization using custom plug-ins

September 23, 2024

Contributed by:

C H C

NetScaler Gateway RfWebUi framework provides the ability to add the custom plug-ins to customize their gateway portal. These custom plug-ins can be used to add large functionality to the gateway, such as if you want to add an entire new page in the gateway flow. For other use cases the code can be added to the custom script file provided for gateway themes at the location /var/netscaler/logon/themes/<custom_theme>/script.js.

Note:

NetScaler Gateway only supports the creation and usage custom plug-ins for the portal customization. NetScaler Gateway does not create or provide any custom plug-ins based on customer requirements.

To add a custom plug-in, create the JavaScript file at the location /var/netscaler/logon/LogonPoint/plugins/ns-gateway/. For example, you can find the following plug-ins in /var/netscaler/logon/LogonPoint/plugins/ns-gateway/.
- ns-nfactor.js
- nsg-epa.js
- nsg-setclient.js
It is recommended to enter the plug-in name in the format <plugin_name>.js.

All these plug-in files are fetched by the RfWebUI framework required by the functionality.
After creating the plug-in file, use the following code as an example to register the plug-in with the RfWebUI framework.
```
        (function ($) {
                    CTXS.ExtensionAPI.addPlugin( {
                                Name : “plugin name”,
                                initialize: function() {}
                    });
            })(jQuery);

```
where,

name is the name given to the plug-in. It is used as the identifier to the plug-in.

initialize takes the function as the parameter which is used to initialize the plug-in.
Enter the plug-in name and initialization function in the CTXS.ExtensionAPI.addPlugin() function to register the plug-in. The added plug-in name and location must be registered to the plugins.xml file at the location /var/netscaler/logon/themes/<custom_theme>/plugins.xml.

After writing the plug-in code, the newly added plug-in name and location must be registered with the plugins.xml file at the location /var/netscaler/logon/themes/<custom_theme>/plugins.xml. The plug-in must be registered with the plug-in tag.

<plugins>
<plugin name="nsg-epa" src="plugins/ns-gateway/nsg-epa.js"/>
<plugin name="nsg-setclient" src="plugins/ns-gateway/nsg-setclient.js"/>
<plugin name="ns-nfactorn" src="plugins/ns-gateway/ns-nfactor.js"/>
</plugins>
<!--NeedCopy-->

Enter a name and src for the plug-in so that RFWebUI can identify and fetch the plug-in.

Example configuration

The following example configurations can be used to add a custom plug-in to add a footer to the NetScaler Gateway logon page.

Create the JavaScript plug-in file in the location, /var/netscaler/logon/LogonPoint/plugins/ns-gateway/.
Name the plug-in as ns-footer.js /var/netscaler/logon/LogonPoint/plugins/ns-gateway/ns-footer.js

Add the following code to the registered plug-in to the RfWebUI and in the initialization function add the footer to the gateway.

(function ($) {
CTXS.ExtensionAPI.addPlugin({
    name: "ns-footer", // Name of plugin - must match name sent in configuration
    initialize: function () {
        
    // Add the footer for the login page
    $("#customExplicitAuthBottom").append("<div style='text-align:center;color:white;font-size:15px;'><br />Disclaimer<br /><br />"+" Access to this website is restricted to employees of Login Consultants<br/></div>");

    // To Add the footer to the login timeout page
    $("#customAuthBottom").append("<div style='text-align:center;color:white;font-size:15px;'><br >Disclaimer<br /><br />"+" Access to this website is restricted to employees of Login Consultants<br /></div>");
        
    callback();
    }
});
})(jQuery);
<!--NeedCopy-->

Save the file.

Add the name and src in the plugins.xml at the location var/netscaler/logon/themes/<custom_theme>/plugins.xml.

<plugins>
<plugin name="nsg-epa" src="plugins/ns-gateway/nsg-epa.js" />
<plugin name="nsg-setclient" src="plugins/ns-gateway/nsg-setclient.js" />
<plugin name="ns-nfactor" src="plugins/ns-gateway/ns-nfactor.js" />
<plugin name="ns-footer" src="plugins/ns-gateway/ns-footer.js" />
</plugins>
<!--NeedCopy-->

Configure the custom theme for which the plug-in is added.
Flush the cache using the command flush cache contentgroup loginstaticobjects.
Reload the portal screen. The footer is added to the NetScaler Gateway login page.

The official version of this content is in English. Some of the Cloud Software Group documentation content is machine translated for your convenience only. Cloud Software Group has no control over machine-translated content, which may contain errors, inaccuracies or unsuitable language. No warranty of any kind, either expressed or implied, is made as to the accuracy, reliability, suitability, or correctness of any translations made from the English original into any other language, or that your Cloud Software Group product or service conforms to any machine translated content, and any warranty provided under the applicable end user license agreement or terms of service, or any other agreement with Cloud Software Group, that the product or service conforms with any documentation shall not apply to the extent that such documentation has been machine translated. Cloud Software Group will not be held responsible for any damage or issues that may arise from using machine-translated content.

Was this helpful

Gateway portal customization using custom plug-ins

September 23, 2024

Contributed by:

C H C

September 23, 2024

Contributed by:

C H C

Gateway portal customization using custom plug-ins

Example configuration

In this article