Introduction to WebUI

WebUI is a graphical user interface that is available to the connected devices. It acts as an application running on the RDK-B stack and performs the functions of a device management interface similar to TR69 & SNMP. A user can monitor and modify RDK-B feature settings/rules using WebUI. It is a client–server application, client runs in a web browser (as part of devices connected over LAN) and Lighttpd on the RDK-B stack acts as server.

The functions in WebUI are defined in C and are called from PHP using ZEND_API. PHP and the Zend Engine manage [exchange] variables internally over the D-Bus.

As part of TinyRDK initiative, WebUI is developed in Java script using duktape as JavaScript engine with a focus on portability and compact footprint. All php pages will be in Java script. User interface remains the same.

What is duktape and why it is required?

  • Duktape is a lightweight javascript engine (https://duktape.org/).
  • Alone it does not provide a web development engine. Therefore, a template engine(called jst) and web server api is built on top of duktape.
  • Duktape provides an API to bind javascript to C functions.

Focus on migration                    

  • To make migration as easy as possible the template and api signature will match php as closely as possible.  
  • Many php functions and variables will be rewritten in javascript, so that changes to the exits code are minimized.
  • The template engine will provide the same features as php's basic templating where php code, embedded in <?php...?> tags, can be mixed with raw html. 
  • The pages are jst pages and the script tags are <?% ... %>, which is similar to other engines like EJS and JavaServer pages.

How jst changes are handled in code?

  • All the pages in php are converted to jst by compiling and running the script build_php2jst.sh.
  • With latest code , jst is enabled by default in CMF using DISTRO_FEATURES.

File : meta-rdk/conf/distro/include/rdkb.inc
DISTRO_FEATURES_append = " webui_jst"

  • Recipe files in source code
    meta-rdk-broadband/recipes-ccsp/ccsp/ccsp-webui-jst.bb
    meta-rdk-ext/recipes-support/duktape/duktape_2.2.0.bb
    meta-rdk-broadband/recipes-ccsp/ccsp/jst.bb
  • Webui jst source code is available at rdkb/components/opensource/ccsp/webui/source/Styles/xb3/jst
  • Files in GW

jst file path - /usr/www2
css, img, js, syndication partner logo - /usr/www2/cmn/
set actions are handled in /usr/www2/actionHandler
javascript implementation for php api - /usr/www2/includes/php.jst

  • "/etc/webgui.sh" will modify "/etc/lighttpd.conf" on runtime and create "/tmp/lighttpd.conf"



  • No labels

3 Comments

  1. Z-Jason Politakis

    Hi,

    Since it is not mentioned in the webUI readme and I cannot find anything related in the wiki, where can I add my own function using duktape?


    For example, I want to write a function that executes system command in C and I want to use it with the webUI using JST.

    Where do I write my function in duktape? Where do I register it? Is it here somewhere /rdk/components/generic/jst/?


    Do I need to modify jst_post.c for file transfer? Is there any other way to configure file transfer using JST (since there is no php to modify file transfer capabilities)?

  2. Z-Jason Politakis

    Any update on the above querry ?

  3. Raghu Venkataraju

    Hi,

    with JST based webui, able to login with default username and password (admin/password) and change the password.
    But observing error "500 Internal Server Error!" while logging in with new password


    Release used is 2023q1 and above issue not seen with PHP based webui.
    Taken care of mentioned code changes related to JST. Can you please 

    What could be the reason for this. Any package or code changes to be taken care to address this.
    Please suggest your input on this issue

    Thank you.

DISCLAIMER: Please note that the use of the RDK Wiki is subject to its Privacy Policy & Terms of Use. In addition, this Wiki may be accessed by all RDK licensees and their contractors.