Vorbereitungen zum SIMOTION Webserver Tutorial

SIMOTION Tutorials
Vorbereitungen zum SIMOTION Webserver
Tutorial „Anwenderdefinierte Webseiten“
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
siemens.com/answers
• SIMOTION-Projekt vorbereiten
2
• Webserver aktivieren
3
• Demo-Variablen hinzufügen
4
• Web-Editor einrichten
• Web-Projekt über Kartenleser einrichten
6
10
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
SIMOTION Webserver aktivieren
SIMOTION SCOUT TIA V4.4, TIA Portal V13 SP1
1. Öffnen Sie die
Gerätekonfiguration
der SIMOTION
Steuerung in Ihrem
TIA Portal Projekt
2. Öffnen Sie die Eigenschaften der Steuerung in der Gerätesicht
3. In den „Webserver“-Einstellungen aktivieren Sie den Haken
„Webserver auf diesem Gerät aktivieren“. Es erscheint ein
Security-Hinweis. Bestätigen Sie den Hinweis.
4. Aktivieren Sie die gewünschten Web-Dienste (z. B. HTTP)
5. Laden Sie das geänderte Projekt in die Steuerung
►
SIMOTIONProjekt
vorbereiten
►
Webserver
aktivieren
►
Demo-Variablen
hinzufügen
►
Web-Editor
einrichten
►
Web-Projekt
über Kartenleser
einrichten
Hinweis: Bei Verwendung von SIMOTION SCOUT V4.4 mit SIMATIC STEP 7 ist der
Webserver standardmäßig bereits aktiviert.
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Importieren der ST-Programmquelle mit den benutzerdefinierten Variablen in
Ihr SIMOTION SCOUT TIA-Projekt
1. Klicken Sie doppelt
auf „SIMOTIONKonfiguration“. Es
öffnet sich SIMOTION
SCOUT TIA.
2. Klicken Sie in
SIMOTION SCOUT
TIA mit der rechten
Maustaste auf
„PROGRAMME“
unterhalb Ihrer
SIMOTIONSteuerung.
3. Im Kontext-Menü klicken Sie auf
Exportieren/Importieren Externe Quelle
importieren  ST-Quelle.
4. Es öffnet sich ein Dateiauswahl-Dialog.
Wählen Sie die Datei FillingMachine.st
aus und bestätigen Sie den Dialog mit „OK“.
Sie finden die Datei FillingMachine.st
in der Zip-Datei
CustomWebPagesTUTORIAL.zip.
5. Klicken Sie auf „Projekt speichern und
Änderungen übersetzen“.
6. Laden Sie das geänderte Projekt in die
Steuerung.
►
SIMOTIONProjekt
vorbereiten
►
Webserver
aktivieren
►
Demo-Variablen
hinzufügen
►
Web-Editor
einrichten
►
Web-Projekt
über Kartenleser
einrichten
Hinweis: Bei Verwendung von SIMOTION SCOUT V4.4 mit SIMATIC STEP 7
funktioniert der Import der ST-Quelle identisch.
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
• SIMOTION-Projekt vorbereiten
3
• Web-Editor einrichten
5
• NetBeans IDE Installieren
6
• Demo-Projekt öffnen
7
• Syntax-Hervorhebung einrichten
8
• Web-Projekt über Kartenleser einrichten
10
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Installation der Entwicklungsumgebung „NetBeans IDE“
Grundsätzlich können Sie jeden
Texteditor verwenden, um Ihre
anwenderdefinierten Webseiten für die
SIMOTION Steuerung zu entwickeln.
Es empfiehlt sich Editoren oder
Entwicklungsumgebungen zu
verwenden, welche eine SyntaxHervorhebung für HTML, CSS und
JavaScript unterstützen.
Für die Erstellung dieses Tutorials
wurde NetBeans IDE 8.0.2 von Oracle
verwendet. NetBeans IDE ist eine
integrierte Entwicklungsumgebung mit
HTML5-Unterstützung.
Installation:
1. Öffnen Sie den folgenden Link:
https://netbeans.org/downloads/
Es öffnet sich eine Seite mit einer
Übersicht der verfügbaren
NetBeans IDE Download Bundles.
2. Wählen Sie zum Herunterladen
eine NetBeans IDE Version aus,
welche die Technologie HTML5
unterstützt, z. B. die Variante
„HTML5 & PHP“.
►
SIMOTIONProjekt
vorbereiten
►
Web-Editor
einrichten
►
►
NetBeans IDE
Installieren
►
Demo-Projekt
öffnen
►
SyntaxHervorhebung
einrichten
Web-Projekt
über Kartenleser
einrichten
3. Installieren Sie NetBeans IDE.
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Demo-Projekt öffnen
Entpacken Sie die Datei CustomWebPagesTUTORIAL.zip. Sie enthält das Demo-Projekt
mit den anwenderdefinierten Webseiten sowie zugehörige Konfigurationsdateien.
Öffnen mit NetBeans IDE
►
SIMOTIONProjekt
vorbereiten
►
Web-Editor
einrichten
Öffnen mit anderem Web-Editor
Öffnen Sie das
Demo-Projekt
über das
„File“-Menü:
Die Quellcode-Dateien des DemoProjekts befinden sich im
Unterverzeichnis public_html des
Demo-Projekts.
In der „Projects“Übersicht sehen
Sie nun das neue
HTML5-Projekt:
Kopieren Sie den Inhalt von
public_html in ein Verzeichnis Ihrer
Wahl. Sie können die QuellcodeDateien mit Ihrem bevorzugten Textbzw. Web-Editor öffnen und bearbeiten.
►
►
NetBeans IDE
Installieren
►
Demo-Projekt
öffnen
►
SyntaxHervorhebung
einrichten
Web-Projekt
über Kartenleser
einrichten
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Syntax-Hervorhebung für MWSL-Dateien in NetBeans IDE
Die HTML-Dateien Ihrer anwenderdefinierten Webseiten für SIMOTION müssen die DateiEndung „.mwsl“ haben. Damit Sie im NetBeans-Editor die korrekte farbige HTML-SyntaxHervorhebung angezeigt bekommen, machen Sie bitte die folgenden Einstellungen:
1. Öffnen Sie das Menü „Tools“ und
wählen Sie den Eintrag „Options“
2. Im „Options“-Dialog wählen Sie
„Miscellaneous“ und dann den
Reiter „Files“
3. Klicken Sie auf „New…“ und fügen
Sie die neue „mwsl“-Dateiendung
hinzu.
4. Verknüpfen Sie die neue „mwsl“Dateiendung mit dem Dateityp
„HTML Files (text/html)“ und
bestätigen Sie mit „OK“
►
SIMOTIONProjekt
vorbereiten
►
Web-Editor
einrichten
►
►
NetBeans IDE
Installieren
►
Demo-Projekt
öffnen
►
SyntaxHervorhebung
einrichten
Web-Projekt
über Kartenleser
einrichten
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
• SIMOTION-Projekt vorbereiten
3
• Web-Editor einrichten
6
• Web-Projekt über Kartenleser einrichten
9
• Webserver-Konfiguration
10
• Benutzer-verwaltung
11
• Anwender-definierte Webseiten
12
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Webserver-Konfiguration
1. Ziehen Sie die SIMOTION Speicherkarte aus
der Steuerung und verbinden Sie die Speicherkarte über einen geeigneten CF-Kartenleser
mit Ihrem Computer.
ACHTUNG: Ziehen Sie die Karte nur im
spannungsfreien Zustand aus der Steuerung!
2. Überschreiben Sie die Datei WebCfg.xml im
folgenden Verzeichnis auf der Speicherkarte:
\USER\SIMOTION\HMICFG
►
SIMOTIONProjekt
vorbereiten
►
Web-Editor
einrichten
►
Web-Projekt
über Kartenleser
einrichten
►
WebserverKonfiguration
►
Benutzerverwaltung
►
Anwenderdefinierte
Webseiten
Sie finden die vorbereitete WebCfg.xml in der
Zip-Datei CustomWebPagesTUTORIAL.zip.
In der Datei WebCfg.xml werden alle anwenderrelevanten Einstellungen des
SIMOTION Webservers gespeichert.
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Benutzerverwaltung
1. Überschreiben Sie die Datei UserDataBase.xml
im folgenden Verzeichnis auf der Speicherkarte:
\USER\SIMOTION\HMICFG\UserDataBase
Sie finden die passend vorbereitete Benutzerdatenbank UserDataBase.xml für das Tutorial in
der Zip-Datei CustomWebPagesTUTORIAL.zip.
2. Ergänzen Sie die Benutzerverwaltung bei Bedarf
nach dem gegebenen Vorbild um weitere Benutzer.
Editieren Sie hierzu die XML-Datei.
Das Passwort für alle Benutzer in diesem Beispiel
lautet: simotion
Benutzer
Gruppe
„Administrator“
Gruppe
„Servicegroup“
Newton
 JA
 JA
Tesla
 JA
 Nein
Kepler
 Nein
 JA
►
SIMOTIONProjekt
vorbereiten
►
Web-Editor
einrichten
►
Web-Projekt
über Kartenleser
einrichten
►
WebserverKonfiguration
►
Benutzerverwaltung
►
Anwenderdefinierte
Webseiten
Die Datei UserDataBase.xml ist die Benutzerdatenbank inklusive der
Benutzergruppen für die Loginverwaltung des SIMOTION Webservers.
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Anwenderdefinierte Webseiten
1. Öffnen Sie das Verzeichnis des Demo-Projekts auf
Ihrem Computer mit dem Datei-Explorer. Öffnen Sie
das Unterverzeichnis public_html. Hier befinden
sich die Quell-Dateien des Demo-Projekts.
2. Kopieren Sie die Datei user.mwsl sowie den
Ordner DEMO vollständig auf die SIMOTION
Speicherkarte in folgendes Verzeichnis:
\USER\SIMOTION\HMI\FILES
Dieser Pfad ist vorgesehen für alle Ihre
anwenderspezifischen Dateien und Verzeichnisse.
►
SIMOTIONProjekt
vorbereiten
►
Web-Editor
einrichten
►
Web-Projekt
über Kartenleser
einrichten
►
WebserverKonfiguration
►
Benutzerverwaltung
►
Anwenderdefinierte
Webseiten
3. Stecken Sie die CF-Karte wieder in die Steuerung.
Tipp: Bei eingeschalteter SIMOTION-Steuerung können Sie die Inhalte des FILESVerzeichnisses auch unter Verwendung des FTP-Zugriffs aktualisieren.
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0
Vielen Dank für Ihre Aufmerksamkeit!
siemens.com/answers
Frei verwendbar / © Siemens AG 2015. Alle Rechte vorbehalten.
V1.0