Describe the bug A clear and concise deion of what the bug

i clone and test about 2 hours ago, and git clone <a href="https://github.com/photovie

<a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/us

The serviceworker.js file cannot be found. <p dir="auto

PWA seems break ? about photoview HOT 18 OPEN

OnlyFor commented on June 18, 2024

PWA seems break ?

from photoview.

Comments (18)

jordy2254 commented on June 18, 2024 2

I believe this is the way that we serve files through go where it doesn't add the correct type onto the file when serving it thus the browser blocks it. It should be a straight forward fix, and the association for the serve handling in the go code can be found here; https://github.com/photoview/photoview/blob/master/api/server.go#L98
@OnlyFor Shouldn't be too complicated of a fix if you have the knowhow to controbute that would be great! If not thanks for raising the contribution and just raising bugs and helping identify replication steps is a great help!

from photoview.

OnlyFor commented on June 18, 2024 1

i clone and test about 2 hours ago, and git clone https://github.com/photoview/photoview.git should be master of course

from photoview.

poisonnuke commented on June 18, 2024 1

I have the same issue with the latest docker installation. Fresh Debian server with nginx as reverse-proxy and standard-configuration.

The serviceworker.js file cannot be found.

looks like the solution is here:
https://stackoverflow.com/questions/49566059/service-worker-registration-error-unsupported-mime-type-text-html

from photoview.

h4de5 commented on June 18, 2024 1

can you post the first few lines of content of that service-worker.js file from the Browsers dev tools?

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="/photoview-logo.svg" type="image/svg+xml" />
    <link rel="apple-touch-icon" href="/logo192.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />

    <link rel="manifest" href="/manifest.json" />

    <meta name="apple-mobile-web-app-title" content="Photoview" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="white" />

    <script type="module" crossorigin src="/assets/index.9b57b0a0.js"></script>
    <link rel="stylesheet" href="/assets/index.0ac106ed.css">
  </head>
  <body>
    <noscript>You need to enable JavaScript to run Photoview.</noscript>
    <div id="root"></div>
    
  </body>
</html>

you see? this is not the service worker which should be a javascript file, but instead is just the file-not page that comes with status code 200.

the service worker seems not to bundled correctly and is therefore not in the production build and the deployment (at least not under that url).

from photoview.

kkovaletp commented on June 18, 2024

@OnlyFor, I checked the image viktorstrate/photoview:master and don't see this error. The demo site is running the latest released image, which is pretty old. Can you please test the PWA installation from your side using the master tag for the image?

from photoview.

OnlyFor commented on June 18, 2024

docker is too heavy for my hosting, so i install manually according here:

https://photoview.github.io/en/docs/installation-manual/

it looks like this docs is out of date ?
for example, it said "cp -r ui/build/ app/ui/", but what i actually found is "cp -r ui/dist/ app/ui"

and after npm run build, this is no "service-worker.js" under ui/dist, which is used in serviceWorkerRegistration.ts,

I'm not good at front-end, so I don't know what's going on,

and I did a little test, if i delete "serviceWorkerRegistration.register()" in "src/index.tsc", i could install pwa in chrome desktop but without icon ? and it seems can't be installed in android chrome lastest still ?

I checked some other projects and said that upgrading dependencies solved this problem?

from photoview.

kkovaletp commented on June 18, 2024

Assuming that you used the source code from master (hope that pulled not too long time ago), it should work.

@jordy2254, can you please take a look, as I never built the project locally?

from photoview.

h4de5 commented on June 18, 2024

I do not think this is about file associations. the service-worker file is not there and its just the 404 error page that has the wrong mime-type.

from photoview.

kkovaletp commented on June 18, 2024

The serviceworker.js file cannot be found.

its strange, but I cannot reproduce the issue. I've tried using the latest master image from the server in Chrome and Firefox, then from a remote host in the same browsers: in all cases I see in the Network tab of Dev Tools that the service-worker.js is loaded with 200 OK status.

I found the next line in the code:
const swUrl = '${import.meta.env.BASE_URL}service-worker.js'

If you have this issue in your setup, please make sure that the PHOTOVIEW_LISTEN_IP variable is set to the hostname of the photoview service in your docker-compose file. In my case it is the PHOTOVIEW_LISTEN_IP: "photoview"

from photoview.

h4de5 commented on June 18, 2024

can you post the first few lines of content of that service-worker.js file from the Browsers dev tools?

from photoview.

kkovaletp commented on June 18, 2024

can you post the first few lines of content of that service-worker.js file from the Browsers dev tools?

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="/photoview-logo.svg" type="image/svg+xml" />
    <link rel="apple-touch-icon" href="/logo192.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />

    <link rel="manifest" href="/manifest.json" />

    <meta name="apple-mobile-web-app-title" content="Photoview" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="white" />

    <script type="module" crossorigin src="/assets/index.9b57b0a0.js"></script>
    <link rel="stylesheet" href="/assets/index.0ac106ed.css">
  </head>
  <body>
    <noscript>You need to enable JavaScript to run Photoview.</noscript>
    <div id="root"></div>
    
  </body>
</html>

from photoview.

poisonnuke commented on June 18, 2024

In my case the service-worker.js returns a 404 page. So I cannot share any code.

The LISTEN_IP is still unchanged and set to "photoview".
Ive tried different settings (just the subdomain of my host, or the entire domain (sub.domain.tld), but that didnt change anything. What is that value supposed to be?

from photoview.

kkovaletp commented on June 18, 2024

The LISTEN_IP is still unchanged and set to "photoview".

it depends on your deployment type:

if you use docker, then it should be set to the Photoview service's hostname in the docker-compose file. In most cases that is "photoview"
if you install Photoview on the host directly, then this should be the environment variable, set to the host IP or hostname. Try local network IP or name and test from the local network: if the issue is gone, then this is the cause and you need to find a way to configure it to work for all use cases

from photoview.

poisonnuke commented on June 18, 2024

it runs with docker compose. Therefore it was already correct with "photoview".
but if this is used to determine the URL for the service-worker shouldnt it be set to the actual domain thats being used even if everything runs inside Docker?

from photoview.

kkovaletp commented on June 18, 2024

shouldn't it be set to the actual domain

in my case it works fine with the "photoview" value in the compose file, but feel free to try)

then, I don't have any other thoughts as to why it doesn't work for you((

from photoview.

PWA seems break ? about photoview HOT 18 OPEN

Comments (18)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent