nesaku / BiblioReads

An Alternative Private Goodreads Front-End.
https://biblioreads.eu.org
GNU Affero General Public License v3.0
170 stars 9 forks source link

Nginx Proxy Manager #13

Closed darkalchemy closed 1 year ago

darkalchemy commented 1 year ago

I started out running a local docker image and I love it. I just moved it to NPM and now every page reloads every 15-20 seconds and none of the images show.

My question is do I need to add anything to the docker-compose.yml file? Or do I need to something special for NPM?

I just thought about this, it's proxied through cloudflare.

Thanks

nesaku commented 1 year ago

Hello darkalchemy,

I was able to create an instance of BiblioReads with Docker and Nginx Proxy Manager, no custom configuration was required and it is working without any issues.

Are you able to access the instance without proxying through Cloudflare and see if the issue still persists.

darkalchemy commented 1 year ago

I have not tried to set up on a public ip without cloudflare. This is the url https://biblioreads.thesources.xyz/ if you want to see what it's doing. I'm hoping someone will have encountered this and know how to resolve it.

I will set it up this weekend without cloudflare.

Thanks

I added an entry to /etc/hosts to bypass cloudflare and the issue remains the same, the images aren't loading.

Since it's working for you, I have to assume it's just me.

Thanks

darkalchemy commented 1 year ago

I grabbed one of the image urls and pasted in the browser and it just returns forbidden. Is the image being proxied?

nesaku commented 1 year ago

Yes, all images are proxied. What is the image url that is returning a forbidden status?

darkalchemy commented 1 year ago

Every image here and all searches.

https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg&maxage=30d

nesaku commented 1 year ago

In the URL above &maxage=30d is not included in the image URL it is a URL parameter for the proxy, which is why it returns a forbidden result when included.

The actually image url is: https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg

darkalchemy commented 1 year ago

Did you look here? All of the images include that in the url and no images are displayed

<picture>
  <source srcset="/img?url=https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg&amp;output=webp&amp;maxage=30d" type="image/webp" class="rounded-lg shadow-sm drop-shadow-sm bg-white dark:bg-slate-800">
  <source srcset="/img?url=https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg&amp;maxage=30d" type="image/jpeg" class="rounded-lg shadow-sm drop-shadow-sm bg-white dark:bg-slate-800">
  <img src="/img?url=https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg&amp;maxage=30d" alt="The Hobbit (The Lord of the Rings, #0) book cover" width="98" height="148" class="rounded-lg border-2 shadow-sm drop-shadow-sm bg-white dark:bg-slate-800" loading="lazy">
</picture>

Thanks for taking the time to look at this.

nesaku commented 1 year ago

&maxage=30d is the cache URL parameter for the proxy and is included in the image src.

The original image URL is between the url= and &amp; part of the image src. When being proxied only the original URL is used, not the full image src.

For example, with https://biblioreads.thesources.xyz/img?url=https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg&output=webp&maxage=30d the original image URL that will be proxied is https://i.gr-assets.com/images/S/compressed.photo.goodreads.com/books/1546071216i/5907.jpg nothing else is included.

The images on the search page return a 204 No Content success status instead of the expected 200 OK success status. The 204 No Content means that the server has successfully fulfilled the request and there's no additional content to send in the response payload, this is why the images are not displayed.

Copying and opening the image link in a new tab returns the expected success status and the image is shown on the search page (tested with Firefox 116.0.2). This may have something to do with Cloudflare, can you try turning off any Cloudflare image/content optimizations or caching like Rocket Loader?

darkalchemy commented 1 year ago

Other than disabling caching of query strings, there isn't anything else to disable. Now a few images are displayed and none when you click into a title. I've completely removed it from cloudflare and from npm.

Other than locally, I can't get it work as expected. I'll just use it as a local resource and maybe someone will post a how to set it up properly with npm and cloudflare. I thank you for your time and your help.