Picapport wird nicht als PWA erkannt

[4tegs]

Ich betreibe Picapport v10 hinter einem Apache Reverse Proxy, abgesichert mit LetsEncrypt. Soweit funktioniert das hervorragend.

Nun würde ich PicApport gerne auch als PWA auf meinem Rechner installieren. Jedoch egal ob ich Chrome oder Firefox nehme, keiner der Browser erkennt PicApport als PW fähig.

Hat jemand eine Idee was ich falsch mache?

____________________________________________________________________________________

Meine Konfiguration:

picapport.properties Parameter:

client.is.PWA=true

server.port=8084
server.ssl=false

Apache Reverse Proxy:

<VirtualHost *:80>
  Redirect permanent / https://bilder.mydomain.de/
</VirtualHost>

# ----------------------------------
# Reverse Proxy Konfiguration
# ----------------------------------
<IfModule mod_ssl.c>
<VirtualHost *:443>
  ServerAdmin webmaster@localhost
  ServerName bilder.mydomain.de

  ProxyRequests Off
  ProxyPreserveHost On
  ProxyPass / http://localhost:8084/
  ProxyPassReverse / http://localhost:8084/

  ErrorLog ${APACHE_LOG_DIR}/picapport_error.log
  CustomLog ${APACHE_LOG_DIR}/picapport_access.log combined

  SSLEngine on
  Include /etc/letsencrypt/options-ssl-apache.conf
  SSLCertificateFile /etc/letsencrypt/live/bilder.mydomain.de-0002/fullchain.pem
  SSLCertificateKeyFile /etc/letsencrypt/live/bilder.mydomain.de-0002/privkey.pem
</VirtualHost>
</IfModule>

[micke...@gmail.com]

Hi,

ich habe ein sehr ähnliches Setup und es funktioniert damit. Die Browser lehnen PWA ab, wenn bestimmte Dateien nicht von der Seite ausgeliefert werden (das können wir denke ich ausschließen) oder wenn die Verbindung nicht https ist.

Letzteres solltest du evtl. nochmal prüfen. Holt der Browser ALLE Ressourcen über https? Funktioniert deine Umleitung richtig?

Statt "Redirect Permanent" nehme ich "Rewrite" aber ich denke eigentlich nicht, dass das das Problem ist. Trotzdem hier mein Snjppet für die Umleitung bei Port 80:

  RewriteEngine on                                                        

  RewriteCond %{SERVER_NAME} =meine.domain.de                        

  RewriteRule ^ https://meine.domain.de%{REQUEST_URI} [END,NE,R=permanent]

[PicApport]

was genau geht denn nicht?

Was für ein Betriebssystem hat der Rechner (siehe auch https://entwickler.de/javascript/firefox-beendet-pwa-support-fur-den-desktop)

PWA installation auf Android und iOs einfach einen Link auf dem Homescreen ablegen. Fertig.

Ha...@motorradtouren.de schrieb am Donnerstag, 12. August 2021 um 10:05:30 UTC+2:

[Hans Straßgütl]

Betriebssystem: Windows 10 Pro, letzte Updates.

Firefox - gut zu wissen  - Edge installiert quasi jede Webseite. Chrome sollte dennoch gehe, es erscheint nur NIE das "+" in der Adreesleiste um eine PWA als solche zu installieren. 

iOS Installation ist mir bewusst und tut via Safari.

Die Redirect hatte ich ursprünglich ebenfalls als Rewrite bei gleichem Erfolg. Auch ein erneuter Test mit den Vorgeschlagenen Parametern brachte keine Veränderung.

Holt der Browser ALLE Ressourcen über https? Das könnte u.U. das Problem sein. PicApport läuft auf einem Raspberry Pi 4 8 GB. Dort unter /opt/picapport . Der Apache Reverse Proxy routet an den Port 8084 - und damit in jedem Fall außerhalb seiner "documentroot" (var/www/html). Könnte da das Problem liegen? Ich hätte keine Idee wie den Pfad beschreiben...

Ach ja: Danke für die raschen Antworten und Anregungen!

[micke...@gmail.com]

Der DocumentRoot spielt bei ProxyPass keine Rolle mehr. Den kannst du beliebig setzen.

Schau beim Aufruf der Webseite (geleerter Browser Cache) mal in die Entwicklerkonsole (F10) unter dem Tab Netzwerk. Dort lässt es sich recht einfach herausfinden.

Stehen sonst meldungen in der Browserconsole evtl.?

Ich müsste mein Setup mal auf dem Desktop testen. Die PWA benutze ich nur auf den Mobilgeräten. Also evtl. habe ich das gleiche "Problem".

Grüße,

Michael

[Hans Straßgütl]

Hallo Michael,

das mit der Konsole war ein guter Tip. Fehler:

"DevTools failed to load source map: Could not load content for https://meindedomain.de/js/jquery.mobile-1.4.5.min.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE"

Jetzt geht die Suche weiter. Sei so nett und check mal an deinem Desktop so du Muse dazu hast. Wäre gut zu sehen, ob der gleiche Fehler auftritt.

Herzlichen Dank, Hans

[micke...@gmail.com]

Die .map dient nur zur Aufbereitung der .min's und ist optional.

Ich habe es eben unter Chrome, Firefox und Opera getestet (sorry, habe mir die Versionen nicht notiert): Es erfolgt keine Installationsaufforderung / Button etc. Auf der anderen Seite funktioniert es auf dem Handy/Tablett gut.

Die Konsole sagt außerdem, dass PWA installiert wurde und ich sehe auch ServiceWorker und Manifest. Auch ein Ressourcen Cache ist vorhanden. Es stimmt also alles und es werden auch Daten im Browser permanent gespeichert (alles was man von einer PWA erwartet).

Ich würde sagen, es ist eine Sache der Browser Version. Bis auf den "Kiosk Mode" (Fenster ohne Adressleiste) und ein Lesezeichen würde dir die PWA dann auch nicht bringen. 

Wenn du also ein Lesezeichen selber anlegst und festlegst, dass es im Kiosk Mode geöffnet wird, solltest du den selben Effekt erzielen. Permanente Speicherung findet so oder so statt.

[Hans Straßgütl]

Michael,

vielen Dank für deine Mühen und Erklärungen. Damit stelle ich meine Anstrengungen ein.

Gruß, Hans