Manual | EN

TF1810
TwinCAT 3 | PLC HMI Web

2022-07-26 | Version: 1.4

 Table of contents

Table of contents
1 Foreword .................................................................................................................................................... 5
1.1 Notes on the documentation .............................................................................................................  5
1.2 Safety instructions .............................................................................................................................  6
1.3 Notes on information security............................................................................................................  7

2 PLC HMI Web ............................................................................................................................................. 8

TF1810 Version: 1.4 3

Table of contents

4 Version: 1.4 TF1810

 Foreword

1 Foreword

1.1 Notes on the documentation

This description is only intended for the use of trained specialists in control and automation engineering who
are familiar with applicable national standards.
It is essential that the documentation and the following notes and explanations are followed when installing
and commissioning the components.
It is the duty of the technical personnel to use the documentation published at the respective time of each
installation and commissioning.

The responsible staff must ensure that the application or use of the products described satisfy all the
requirements for safety, including all the relevant laws, regulations, guidelines and standards.

Disclaimer

The documentation has been prepared with care. The products described are, however, constantly under
development.
We reserve the right to revise and change the documentation at any time and without prior announcement.
No claims for the modification of products that have already been supplied may be made on the basis of the
data, diagrams and descriptions in this documentation.

Trademarks

Beckhoff®, TwinCAT®, TwinCAT/BSD®, TC/BSD®, EtherCAT®, EtherCAT G®, EtherCAT G10®, EtherCAT P®,
Safety over EtherCAT®, TwinSAFE®, XFC®, XTS® and XPlanar® are registered trademarks of and licensed by
Beckhoff Automation GmbH.
Other designations used in this publication may be trademarks whose use by third parties for their own
purposes could violate the rights of the owners.

Patent Pending

The EtherCAT Technology is covered, including but not limited to the following patent applications and
patents:
EP1590927, EP1789857, EP1456722, EP2137893, DE102015105702
with corresponding applications or registrations in various other countries.

EtherCAT® is a registered trademark and patented technology, licensed by Beckhoff Automation GmbH,
Germany

Copyright

© Beckhoff Automation GmbH & Co. KG, Germany.

The reproduction, distribution and utilization of this document as well as the communication of its contents to
others without express authorization are prohibited.
Offenders will be held liable for the payment of damages. All rights reserved in the event of the grant of a
patent, utility model or design.

TF1810 Version: 1.4 5

Foreword

1.2 Safety instructions

Safety regulations

Please note the following safety instructions and explanations!

Product-specific safety instructions can be found on following pages or in the areas mounting, wiring,
commissioning etc.

Exclusion of liability

All the components are supplied in particular hardware and software configurations appropriate for the
application. Modifications to hardware or software configurations other than those described in the
documentation are not permitted, and nullify the liability of Beckhoff Automation GmbH & Co. KG.

Personnel qualification

This description is only intended for trained specialists in control, automation and drive engineering who are
familiar with the applicable national standards.

Description of symbols

In this documentation the following symbols are used with an accompanying safety instruction or note. The
safety instructions must be read carefully and followed without fail!

DANGER
Serious risk of injury!
Failure to follow the safety instructions associated with this symbol directly endangers the life and health of
persons.

WARNING
Risk of injury!
Failure to follow the safety instructions associated with this symbol endangers the life and health of per-
sons.

CAUTION
Personal injuries!
Failure to follow the safety instructions associated with this symbol can lead to injuries to persons.

NOTE
Damage to the environment or devices
Failure to follow the instructions associated with this symbol can lead to damage to the environment or
equipment.

Tip or pointer
This symbol indicates information that contributes to better understanding.

6 Version: 1.4 TF1810

 Foreword

1.3 Notes on information security

The products of Beckhoff Automation GmbH & Co. KG (Beckhoff), insofar as they can be accessed online,
are equipped with security functions that support the secure operation of plants, systems, machines and
networks. Despite the security functions, the creation, implementation and constant updating of a holistic
security concept for the operation are necessary to protect the respective plant, system, machine and
networks against cyber threats. The products sold by Beckhoff are only part of the overall security concept.
The customer is responsible for preventing unauthorized access by third parties to its equipment, systems,
machines and networks. The latter should be connected to the corporate network or the Internet only if
appropriate protective measures have been set up.

In addition, the recommendations from Beckhoff regarding appropriate protective measures should be
observed. Further information regarding information security and industrial security can be found in our
https://www.beckhoff.com/secguide.

Beckhoff products and solutions undergo continuous further development. This also applies to security
functions. In light of this continuous further development, Beckhoff expressly recommends that the products
are kept up to date at all times and that updates are installed for the products once they have been made
available. Using outdated or unsupported product versions can increase the risk of cyber threats.

To stay informed about information security for Beckhoff products, subscribe to the RSS feed at https://
www.beckhoff.com/secinfo.

TF1810 Version: 1.4 7

PLC HMI Web

2 PLC HMI Web

PLC HMI Web enables the visualization to be displayed in any web browser. It is realized as a Java script,
which queries the display information from the web server. Only changes in the display are transferred
cyclically. When a visualization project is downloaded, all files required for the PLC HMI Web are transferred
to directory C:\TwinCAT\3.1\Boot\Plc\Port_851\Visu. This includes the Java script, the basic HTML page
(HTM file) for the visualization, and all images required in the visualization.

PLC HMI Web can currently only be configured for PLC projects that can be reached via port 851.

The following topics are described below:

• Requirements [} 8]
• Commissioning of the PLC HMI Web [} 8]
• Editor of the WebVisualization object [} 9]

Requirements
• On the server side the web server must be configured accordingly.
• On the client side, as a minimum Microsoft Internet Explorer 10 or the latest version of Mozilla Firefox,
Google Chrome or Safari must be available.

Data security violations

In order to minimize the risk of data security violations, the following organizational and technical
measures are recommended for the system, on which your applications run:
• Exposure of the PLC and the control network to open networks and the Internet should be
avoided, as far as possible.
• Use additional data link layers such as a VPN for remote access and install firewall mechanisms
for protection.
• Restrict access to authorized persons, change any default passwords during first commissioning
and then at regular intervals.

Commissioning the PLC HMI Web

Step 1: Configure Internet Information Services (IIS)

The PLC HMI Web uses the Microsoft IIS as web server. The IIS has to be configured accordingly. The
configuration is handled by theTF1810 | TC3 PLC HMI Web installation, which is available for download from
the Beckhoff website.

Step 2: Enable PLC HMI Web

The "WebVisualization" object ( ) enables the PLC HMI Web. You add it to the "Visualization Manager"
object in the PLC project tree via the context menu command Add > WebVisualization (see also PLC
documentation: Creating a visualization > Visualization object).

With the WebVisualization object a visualization task "VISU_TASK" is created in the Solution and a
reference to this task in the project. The reference is used to call the visualization code. Therefore, you have
to reactivate the configuration after adding the object.

Deleting a WebVisualization object

If you delete a WebVisualization object and have not added an additional TargetVisualization ob-
ject, you have to delete the task "VISU_TASK" under System > Tasks in the TwinCAT project tree.
This task is not required in the integrated visualization. (See also TF1800: Editor of the TargetVisu-
alization object and PLC: Integrated visualization)

Step 3: Call PLC HMI Web

8 Version: 1.4 TF1810

 PLC HMI Web

In order to call the start page of the visualization, enter the following address in the web browser: https://
device_name/Tc3PlcHmiWeb/Port_851/Visu/webvisu.htm

Example: https://localhost/Tc3PlcHmiWeb/Port_851/Visu/webvisu.htm

"webvisu" is the HTML start page of the visualization defined in the PLC HMI Web settings. After the call this
is used to display the start visualization, which is also defined in the manager, in the browser. The
visualization can then be operated in the browser.

Optionally you can give the PLC HMI Web a name on calling it in order to be able to address it specifically in
the application later on. To do this, enter the parameter ClientName=<Name> after the URL.

Example: https://localhost/Tc3PlcHmiWeb/Port_851/Visu/webvisu.htm?Clientname=V_ClientXY

Editor of the WebVisualization object

The "WebVisualization" object ( ), which you can add in the PLC project tree below the
"Visualization Manager" object, enables the PLC HMI Web and contains the settings for the web
visualization. Double-click on the object in order to edit the settings in an editor window.

Start Visualization Name of the visualization to be displayed automatically when the PLC HMI Web is
started. "Visualization" is to be entered here as standard. The input assistant can be
used to select a different visualization.
Name of .htm file Name of the basic HMTL page of the visualization, which must also be entered as
the address in the web browser.
Example:
https://localhost/Tc3PlcHmiWeb/Port_851/Visu/webvisu.htm
Updaterate (ms) Update rate in milliseconds, with which the data in the web browser are updated.
Default Size of the communication buffer in bytes. Specifies the maximum available memory
Communication Buffer for the data transfer between web client and web browser.
Show used Button for opening the standard dialog of the Visualization Manager: Here you can
Visualizations select the visualizations that are to be used for the PLC HMI Web. (See also
PLC documentation: Creating a
visualization > Visualization Manager > Visualizations)

Scaling options

TF1810 Version: 1.4 9

PLC HMI Web

Fixed The size of the visualization is retained, irrespective of the size of the browser
window.
Isotropic The size of the visualization depends on the size of the browser window. The
visualization retains its proportions, however.
Anisotropic The size of the visualization depends on the size of the browser window. The
visualization does not retain its proportions.
Client size The display size of PLC HMI Web is defined through the following settings:
• Client height: height in pixels
• Client width: width in pixels

Presentation options

Antialiased Drawing Activate this option, if antialiasing is to be used when the visualizations are drawn in
the visualization editor window of the programming system. (Offline or online)

Default text input

This setting is only then active if the input type “Standard” is selected in the input configuration of the
visualization element. In this case, the default text entries defined in the Visualization Manager are used.

Touchscreen Select this option if the web clients are operated with a touchscreen by default.
Keyboard Select this option if the web clients are operated with a keyboard by default.

10 Version: 1.4 TF1810

More Information:
www.beckhoff.com/tf1810

Beckhoff Automation GmbH & Co. KG

Hülshorstweg 20
33415 Verl
Germany
Phone: +49 5246 9630
[email protected]
www.beckhoff.com