Tablet UI auf PHP-Server funktioniert nicht richtig

CoolTux · 10 Januar 2017, 11:16:07

Großer, Du sollst nicht FHEM aktivieren sondern erstmal Deine Apache Virtual Horst Configuration.

http://manpages.ubuntu.com/manpages/zesty/man8/a2ensite.8.html

der-Lolo · 10 Januar 2017, 11:18:12

OT:
Ey Alter - konfigurier mal den virtuellen Horst!

CoolTux · 10 Januar 2017, 11:20:24

Zitat von: der-Lolo am 10 Januar 2017, 11:18:12
OT:
Ey Alter - konfigurier mal den virtuellen Horst!

Das ist Vorlaut und frech

**Jungspund**

redlav · 10 Januar 2017, 12:39:02

Zitat von: CoolTux am 10 Januar 2017, 10:30:05
Nein. Du musst das erst noch aktivieren.
Aber sowas sieht man ja auch ganz gut im Logfile von Apache

Wollte nur anmerken, das es bei mir funktioniert

Auch wenn ich mich nicht errinnern kann etwas aktiviert zu haben.

klausw · 10 Januar 2017, 15:49:00

Seite in Apache2 Aktivieren:

Code Auswählen

sudo a2ensite fhem.conf

das legt dann eine link von sites-available auf sites-enabled
Apache neustarten und es sollte gehen.

Matthias1912 · 11 Januar 2017, 17:50:32

Hi,

so ich habe es jetzt geschaft FHEM über den Apache zu leiten, allerdings kann ich trotzdem keine PHP Files im Tablet UI ausführen (da kommt dann eine Downloadmöglichkeit)
Beispiel für den Aufruf:
1) FHEM -> http://192.168.2.109/fhem
2) Tablet UI -> http://192.168.2.109/fhem/tablet/index.html
3) Tablet UI -> http://192.168.2.109/fhem/tablet/phpinfo.php

1 und 2 funktionieren soweit, da dort kein php verwendet wird
bei 3. gehts es nicht (wie gesagt, dort kommt dann eine Downloadaufforderung)

Mein Ziel ist es, das ich mir das Tablet UI aus einem php file dynamisch erzeuge. Quasi für redundante Teile einfach ne for Schleife verwenden kann ohne den html code dutzende male zu kopieren. (das ist nur 1 Beispiel)

Folgendes habe ich jetzt gemacht:

Code Auswählen


sudo nano /etc/apache2/sites-available/fhem_proxy_80.conf

Inhalt:

Code Auswählen


<VirtualHost *:80>
	ServerAdmin webmaster@example.com
	ServerName fhem
	DocumentRoot /var/www/html

	ErrorLog ${APACHE_LOG_DIR}/fhem-error.log
	CustomLog ${APACHE_LOG_DIR}/fhem-access.log combined
	
	ProxyRequests Off
	ProxyVia Off
	ProxyPreserveHost On
	
	<Location /fhem>
		ProxyPass http://localhost:8083/fhem
		ProxyPassReverse http://localhost:8083/fhem
	</Location>

	<Directory />
		# RedirectPermanent / /fhem
	</Directory>

	<Proxy *>
		AuthType Basic
		AuthName "Password Required"
		AuthUserFile /etc/fhem-htpasswd
		Require valid-user
		Order deny,allow
		Allow from all
	</Proxy>											
</VirtualHost>

Code Auswählen


sudo a2dissite 000-default.conf
sudo a2ensite fhem_proxy_80.conf

So wie ich das jetzt verstanden habe, wird die Anfrage von extern über den Apache an den FHEM Server weiter geleitet, welcher ja kein php kann. Verstehe ich das soweit richtig?
Aber wie bekomme ich es denn jetzt hin, das ich für mein Tablet UI php verwenden kann?

CoolTux · 11 Januar 2017, 18:06:58

Hast du php-mode installiert und geladen?

Matthias1912 · 11 Januar 2017, 19:54:40

Was meinst du damit? php5 ist installiert.

Wenn ich die phpinfo.php ins root Verzeichnis des Apache kopiere /var/www/html und wie folgt ausführe
http://192.168.2.109/phpinfo.php
dann funktioniert es.

CoolTux · 11 Januar 2017, 19:58:48

Ok dann funktioniert php also. Bin gerade am überlegen ob man noch irgendwas anderes einstellen muß.
Ich glaube da muß jemand anderes helfen.

Thorsten Pferdekaemper · 11 Januar 2017, 20:51:53

Zitat von: Matthias1912 am 11 Januar 2017, 17:50:32
So wie ich das jetzt verstanden habe, wird die Anfrage von extern über den Apache an den FHEM Server weiter geleitet, welcher ja kein php kann. Verstehe ich das soweit richtig?

Ja, das denke ich.

Zitat
Aber wie bekomme ich es denn jetzt hin, das ich für mein Tablet UI php verwenden kann?

Wie Du das hinbekommst ist Deine Sache, aber ich habe es so gemacht:
TabletUI ist ganz normal installiert, also im /opt/fhem/www/tablet-Verzeichnis.
Meine PHP-Dateien liegen in /var/www/html. Dort liegt auch eine index.php.
Per PHP sorge ich dafür, dass das hier in jeder Datei unter <head> steht:

Code Auswählen


    <meta http-equiv="Pragma" content="no-cache"> 
    <meta http-equiv="Expires" content="-1"> 
    <meta http-equiv="cache-control" content="no-store"> 
	
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
	<meta name="gridster_disable" content="1">
	<meta name="widget_base_width" content="142">
	<meta name="widget_base_height" content="108">
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="longpoll" content="1"> 
	<meta name="debug" content="0"> 
	
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-wdtimer.css" />
	<link rel="stylesheet" href="/fhem/tablet/style.css">
	
	<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
    <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
    <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
	
	<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>

D.h. Die Tablet-UI-Libs sind ganz normal in FHEM, aber die Einbindung des TabletUI wird vom PHP erzeugt. Natürlich würden die Pfade oben nicht ohne Weiteres funktionieren. D.h. so funktionieren die ganzen PHPs, aber halt nicht das TabletUI.
Dafür sorgt dann die folgende virtual Host Config für Apache:

Code Auswählen


<VirtualHost *:80>

	DocumentRoot /var/www/html

	<Location /fhem>
		ProxyPass http://localhost:9046/fhem
		ProxyPassReverse http://localhost:9046/fhem
	</Location>

	# Chrome is difficult to convince not to cache
	<LocationMatch  "index.html">
		Header always append cache-control no-store
    </LocationMatch>

</VirtualHost>

Ach ja, man braucht natürlich noch eine FHEMWEB-Instanz mit Port 9046. Die kann man dann ggf. noch "sicher" konfigurieren, aber das ist ein anderes Thema.

Dein UI solltest Du dann einfach mit http://192.168.2.109/ erreichen.

Gruß,
Thorsten

klausw · 12 Januar 2017, 15:18:46

Zitat von: Matthias1912 am 11 Januar 2017, 17:50:32
so ich habe es jetzt geschaft FHEM über den Apache zu leiten, allerdings kann ich trotzdem keine PHP Files im Tablet UI ausführen (da kommt dann eine Downloadmöglichkeit)
Beispiel für den Aufruf:
1) FHEM -> http://192.168.2.109/fhem
2) Tablet UI -> http://192.168.2.109/fhem/tablet/index.html
3) Tablet UI -> http://192.168.2.109/fhem/tablet/phpinfo.php

So wie ich das jetzt verstanden habe, wird die Anfrage von extern über den Apache an den FHEM Server weiter geleitet, welcher ja kein php kann. Verstehe ich das soweit richtig?
Aber wie bekomme ich es denn jetzt hin, das ich für mein Tablet UI php verwenden kann?

Die Weiterleitung und php sind zwei verschiedene Dinge.

Das mit dem ReverseProxy hast du ja hinbekommen.
Das bedeutet aber auch, das alles unter
http://192.168.2.109/fhem
direkt an dein FHEM geleitet wird.
Daher wird php dort nicht funktionieren.

Die Daten aus /opt/fhem/www/tablet und die ...pgm2/jquery.min.js müssen über dein Apache root Verzeichnis (vermutlich /var/www/html ) erreichbar sein.
Also entweder dorthin kopieren oder einen link erstellen.
z.B. unter /var/www/html/tablet
Deine Tablet UI Oberfläche wäre dann über http://192.168.2.109/tablet erreichbar (links in den html/php Dateien musst du natürlich anpassen)

[Eine weitere Alternative wäre es, einen virtual Host anzulegen und /opt/fhem/www/tablet direkt als Verzeichnis dafür anzugeben.]

Thorsten Pferdekaemper · 12 Januar 2017, 18:10:52

Zitat von: klausw am 12 Januar 2017, 15:18:46Die Daten aus /opt/fhem/www/tablet und die ...pgm2/jquery.min.js müssen über dein Apache root Verzeichnis (vermutlich /var/www/html ) erreichbar sein.
Also entweder dorthin kopieren oder einen link erstellen.
z.B. unter /var/www/html/tablet
Deine Tablet UI Oberfläche wäre dann über http://192.168.2.109/tablet erreichbar (links in den html/php Dateien musst du natürlich anpassen)

[Eine weitere Alternative wäre es, einen virtual Host anzulegen und /opt/fhem/www/tablet direkt als Verzeichnis dafür anzugeben.]

Das ist meiner Meinung nach beides verwirrender als meine Vorgehensweise.
Gruß,
Thorsten

Matthias1912 · 13 Januar 2017, 00:09:07

Super Thorsten, danke. jetzt läufts wie ichs will.
An die Includes im html/php file hatte ich nicht gedacht. Wollte alles umlenken, aber es reicht ja wenn nur die includes umgelenkt werden und das php im apache ausgeführt wird.

Muss jetzt nur noch die https Verbindung für den apache und für den VirtualHost zum laufen bekommen. Das werde ich gleich mal am Wochenende in Angriff nehmen.

Thorsten Pferdekaemper · 13 Januar 2017, 18:24:24

Zitat von: Matthias1912 am 13 Januar 2017, 00:09:07
Super Thorsten, danke. jetzt läufts wie ichs will.
An die Includes im html/php file hatte ich nicht gedacht. Wollte alles umlenken, aber es reicht ja wenn nur die includes umgelenkt werden und das php im apache ausgeführt wird.

Keine Ahnung, was Du mit Includes meinst...

Zitat
Muss jetzt nur noch die https Verbindung für den apache und für den VirtualHost zum laufen bekommen. Das werde ich gleich mal am Wochenende in Angriff nehmen.

Schau mal, ob Du mit der virtual Host Definition im Anhang klarkommst. Da ist auch noch Basic Auth. mit dabei.
Gruß,
Thorsten

Matthias1912 · 14 Januar 2017, 15:41:13

Hi

Zitat
Keine Ahnung, was Du mit Includes meinst...

Sowas aus dem Header

Code Auswählen


alt:
<link rel="stylesheet" href="css/fhem-tablet-ui.css" />
neu:
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />

So das https funktioniert schonmal, allerdings habe ich noch ein Problem beim ProxyPassReverse.
Ich habe im Fhem alles per https laufen und wenn ich für ProxyPassReverse https://localhost:8084/fhem verwende funktioniert es nicht.
Wenn ich allerdings für WEBphone (Port 8084) das HTTPS Attribute entferne und für ProxyPassReverse http://localhost:8084/fhem verwende, dann gehts.

Ich möchte aber alles auf https laufen lassen (auch die ProxyPass und ProxyPassReverse). Was muss ich in der VirtualHost noch eintragen?

Meine VirtualHost Config:

Code Auswählen


<VirtualHost *:443>
	ServerAdmin webmaster@example.com
	ServerName ControlPi
	DocumentRoot /var/www/html
	
	ErrorLog ${APACHE_LOG_DIR}/myPort_443_error.log
	CustomLog ${APACHE_LOG_DIR}/myPort_443_error_access.log combined
	
	ProxyRequests Off
	ProxyVia Off
	ProxyPreserveHost On
	
	SSLEngine on	
	SSLCertificateFile	/etc/apache2/ssl/server.crt
	SSLCertificateKeyFile /etc/apache2/ssl/server.key
	
	<FilesMatch "\.(cgi|shtml|phtml|php)$">
		SSLOptions +StdEnvVars
	</FilesMatch>
	
	BrowserMatch "MSIE [2-6]" nokeepalive ssl-unclean-shutdown downgrade-1.0 force-response-1.0
	BrowserMatch "MSIE [17-9]" ssl-unclean-shutdown
	
	<Location /fhem>
		ProxyPass https://localhost:8084/fhem
		ProxyPassReverse https://localhost:8084/fhem
		AuthType Basic
		AuthName "Password Required"
		AuthUserFile /etc/apache2/htpasswd				
		# Diese Benutzer haben Zugriff
		# Syntax: Require valid-user (alle in der htpasswd)
		# Syntax: Require user user1 user2 ... (nur diese User aus der htpasswd)
		Require user fhem
		Order deny,allow
		Allow from all
	</Location>	
	
	<Location />		
		AuthType Basic
		AuthName "Password Required"
		AuthUserFile /etc/apache2/htpasswd
		# Diese Benutzer haben Zugriff
		# Syntax: Require valid-user (alle in der htpasswd)
		# Syntax: Require user user1 user2 ... (nur diese User aus der htpasswd)
		Require valid-user	
		Order deny,allow
		Allow from all			
	</Location>
</VirtualHost>

Ich hatte an das hier gedacht, aber das funktioniert auch nicht.

Code Auswählen


<Proxy /fhem>	
	AuthType Basic
	AuthName "Password Required"
	AuthUserFile /etc/apache2/htpasswd				
	# Diese Benutzer haben Zugriff
	# Syntax: Require valid-user (alle in der htpasswd)
	# Syntax: Require user user1 user2 ... (nur diese User aus der htpasswd)
	Require user fhem
	Order deny,allow
	Allow from all	
</Proxy>