Skip to content

Lightstreamer/Lightstreamer-JMS-example-Auth-client-javascript

Repository files navigation

Lightstreamer JMS Extender - Authentication and Authorization Demo - HTML Client

The JMS Extender Authentication and Authorization Demo is a simple example illustrating authentication and authorization mechanisms when an external Web/Application Server is involved in the process.

This project includes a simple web client front-end example for the Lightstreamer JMS Extender - Authentication and Authorization Demo - Java Hook.

Screenshots

screenshot1 screenshot2 screenshot3

Details

This Authentication and Authorization Demo illustrates the typical best practice used for Lightstreamer JMS Extender Web applications, when a Web/Application server is involved in the process. The actual authentication is usually handled by the legacy Web/Application server, irrespective of Lightstreamer.

From src/js/app.js:

[...]

$.ajax({
  url: "js/login.js",
  type: "POST",
  data: {
    user: user,
    password: password,
  },

[...]

Some sort of token is sent back to the Client through cookies, response payload or any other technique. When the JMS JavaScript Client creates the JMS connection, instead of sending again the full credentials (usually involving a password) to the JMS Extender, it sends just the username and the token.

From src/js/app.js:

[...]

// Now we can connect to JMS Extender
jms.ConnectionFactory.createConnection(constants.SERVER, constants.JMS_CONNECTOR, user, token, {
  onConnectionCreated: function (conn) {
    connection = conn;
[...]

The Hook is passed this information and validates the token against the Web/Application Server that generated it (or a database or whatever back-end system).

Here is an overview of the whole sequence:

sequence diagram

In this demo client the Web/Application server is not actually involved and calls to placeholder methods are performed to obtain and extract the token.

Once the user is authenticated on the JMS Extender as explained above, the client interface opens three different panels: a stock-list panel, a portfolio panel and a chat panel. Each panel tries to create consumers and producers for different destination. Each time a creation is requested, the JMS Extender proceeds with the authorization of the request; each one of the username available in the demo is bound to a list of destinations it is authorized to view. Again the server might use an external service to verify if the received request is a valid one or not: more details on this are shown in the Hook project.

Install

Before you can run the demo of this project some dependencies need to be solved:

  • Note that, as prerequisite, the following projects have to be deployed on your local Lightstreamer JMS Extender instance. Please check out the projects and follow the installation instructions provided with them:
  • Install the JMS Extender Hook required by this project.
  • Launch Lightstreamer JMS Extender and the two JMS demo services above.
  • Lightstreamer visual widgets, such as the status widget and dynagrid, are hot-linked in the html page: they are in no way mandatory and you may replace them with widgets from any other library by modifying src/js/portfolio_grid.js, src/js/stocks_grid.js and the onLSClient event in src/js/app.js.
  • jQuery is currently hot-linked in the html page: you may want to replace it with a local version and/or to upgrade its version.
  • As the latest version of the Lightstreamer JMS Extender JavaScript library is always available through unpkg, it is hot-linked in the html page.

Now, you need to configure the src/js/constants.js of this example by specifying the name of the JMS connector you are going to use. By default the demo will look for the ActiveMQ JMS connector, please refer to the related services projects (Stock-List Demo and Portfolio Demo) for more details on the choice of a JMS broker to be used.

To set the JMS connector name look where the constants object is set:

[...]

const constants =  {
  SERVER: protocolToUse + "//localhost:8080",
  JMS_CONNECTOR: "ActiveMQ",

[...]

To access the demo from a web browser, copy it somewhere under your webserver root directory. You can also add it to the JMS Extender internal web server pages under <JMS_EXTENDER_HOME>/pages directory by copying there the src folder with a name such as AuthDemo_JMS. Subsequently you may access it as: http://your_jms_extender_http_address/AuthDemo_JMS/. Depending on the browser in use, and on the security settings, you might also be able to launch the index.html file directly from the file system.

See Also

JMS Extender Hook Needed by This Client

JMS Extender Compatibility Notes

  • Compatible with Lightstreamer JMS Extender SDK for Web Clients since version 2.0.0 or newer.
  • Compatible with Lightstreamer JMS Extender since version 2.0.0 or newer.

About

Lightstreamer JMS Extender - Authentication and Authorization Demo - HTML Client

Resources

License

Stars

Watchers

Forks

Packages

No packages published