Execute as CODESYS Web Visualization

Attention

:strong:Recommendations for Data Security

In order to minimize the risk of data security violations, we recommend the following organizational and technical actions for the system where your applications are running:

As far as possible, avoid exposing the PLC and control networks to open networks and the Internet. For protection, use additional data link layers such as a VPN for remote access and install firewall mechanisms. Limit access to authorized persons, change existing standard passwords during the initial commissioning and continue to change them regularly.

If, despite everything, you wish to publish your web visualization, it is urgently recommended that you provide it at least with simple password protection in order to prevent someone accessing your controller functionality over the internet (see the example in the project SimpleWebvisuLogin.project, which is provided with the standard installation of the development system).

Use the latest versions of the gateway server and web server. A security hole was detected for the gateway server and the web server until V3.4 SP4 Patch 2 (US ICS CERT: ICS-ALERT-12-097-02). This was removed in V3.5 and later.

You can execute a visualization as CODESYS Web Visualization.

The requirement for this is that the runtime system receives a web server with WebVisu support. This allows for the communication between the target system and the web browser. The web server on the target device is started as soon as an application is started with WebVisu configuration and runs until all applications with WebVisu are ended. Then, the device can display visualizations in connected HTML5-capable web browsers.

The web-based display variant of the CODESYS Visualization allows for remote access, remote monitoring, as well as service and diagnostics of a plant over the Internet. A web browser communicates via JavaScript (or SSL encryption) with the web server in the controller and displays the visualization by means of HTML5. This technology is supported by almost all browsers and is therefore available on iOS and Android end devices.

Configuring and starting display variants

  1. Select the Visualization manager object and click Add object.

  2. Select the WebVisu object and specify the name WebVisu_A.

    ⇒

    A new object is in the device tree below the Visualization manager object. The respective editor opens.

    The VISU_TASK visualization task is added automatically below the task configuration.

  3. Select the visMain visualization in the Start visualization.

  4. Specify the name webvisuA in Name of HTML file.

  5. Click Display used visualizations and check that the selected visualization is activated for a download to the associated device.

    ⇒

    The visualization is configured. The settings in Scaling options determine the window size and the scaling.

  6. Start a suitable runtime system with web server and WebVisu support.

    Configure the communication settings for your system.

    ⇒

    The runtime system is running.

  7. Compile, download, and start the application.

    ⇒

    The application and the web server is running.

  8. Start a web browser with the following address: http://localhost:8080/webvisuA.htm

    ⇒

    The page is displayed and you can see the data of the application and the application is running.

Call page in web server

  1. Start a modern browser with JavaScript and support of HTML5 canvas, for example Firefox, Chrome, IE >= 9.

  2. Specify the following address in the web browser:

    http://localhost:8080/webvisu.htm

    Formal: http://<IP address of web server>:<port of web server>/<name of HTM file>

    <name of HTM file> is the HTML start page of the visualization defined in the WebVisu object.

    ⇒

    The page is displayed and you can see the data of the application and the application is running.

Determining and calling the default page in the web server

  1. Double-click the WebVisu_main object.

    ⇒

    The WebVisu editor opens.

  2. Activate the option Use as default page.

    ⇒

    The start page that is specified in the property Name of HTML file is preset as the default.

  3. Start a current web browser (on any computer).

  4. Specify only the IP address and the port of the controller in the web browser without the name of the HTML page:

    http://localhost:8080

    Formally: http://<IP address of web server>:<port of web server>

    ⇒

    The default page webvisu_main.htm opens. You can see the data of the application and the application is running.

  5. In the web browser, specify the following address on another device (for example a smartphone):

    http://localhost:8080/webvisu_for_an_expert.htm

    ⇒

    The given visualization webvisu_for_an_expert.htm opens.

See also

Identifying WebVisu

To be able to identify a WebVisu by means of the library block VisuFbClientTagDataHelper, the WebVisu requires a name. To be able to address it directly in the application, you extend the URL call with the parameter ClientName=<Name>.

Example:http://localhost:8080/webvisu.htm?ClientName=VisClientxy.

Attention

BeagleBone Black

If you use a BeagleBone Black as a visualization device, then you must note that a BeagleBone Black uses port 9090 for its web server. A valid IP address is as follows: http://192.168.7.2:9090/webvisu.htm

See also