floogulinc / hydrus-web

Web client for Hydrus

Hydrus Web

Hydrus web is a web client for Hydrus

Usage

hydrus.app

hydrus.app is the recommended way to use Hydrus Web. It will always be the latest stable version (latest commit on the master branch) of Hydrus Web. It is automatically deployed with Vercel.

The latest development build (latest commit on the dev branch) can be found at dev.hydrus.app.

Docker

A Docker image is provided for Hydrus Web.

It hosts Hydrus Web on port 80 using nginx. Hydrus Web needs to be hosted with valid HTTPS unless it is only being used on localhost. The Docker image is meant to be used with some proxy that can provide HTTPS (like Caddy or Traefik).

You may also want to run Hydrus on Docker.

Hydrus API HTTPS

Unless you are opening Hydrus Web on the same device the Hydrus client is running on, you will need to make its API available with valid HTTPS. This will likely mean running some form of reverse proxy.

There are some guides on doing this on the wiki.

Hydrus Version Support

The minimum required versions of the Hydrus client for Hydrus Web are:

Hydrus Web	Hydrus Client Version
Stable branch (hydrus.app)	v500
Dev branch (dev.hydrus.app)	v500
1.0.0+	v500
0.3.2	v357 probably

Some features may require a newer Hydrus version than the minimum.

Development

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

hydrus-web's Issues

Error: Http failure response for http://hydrusclient:45869/verify_access_key: 0 Unknown Error

Issue

Trying to setup hydrus-web in docker.

After enabling the client_api, configuring, and adding the access key. I go to configure hydrus-web and get
Error: Http failure response for ... :45869/verify_access_key: 0 Unknown Error

I've tried using http instead of https and get the same error. I can confirm the service is listening on the network and that I can reach it from the hydrus-web container.

I do not see anything useful in the logs from docker-compose.

---

Docker compose file

version: '3.9'
volumes:
  hydrus-client:
    driver: local
services:
  hydrusclient:
    image: ghcr.io/hydrusnetwork/hydrus:latest
    container_name: hydrusclient
    restart: unless-stopped
    environment:
      - UID=1000
      - GID=1000
    volumes:
      - hydrus-client:/opt/hydrus/db
    tmpfs:
      - /tmp
    ports:
      - 5800:5800   #noVNC
      - 5900:5900   #VNC
      - 45869:45869 #API

  hydrus-web:
    image: floogulinc/hydrus-web
    container_name: hydrus-web
    restart: always
    ports:
      - 8080:80

client-api

This is client api,
a client api.

Software version 465
API version 22
It responds to requests from any host.

Checking access from docker container

# Connect to container
docker exec -it $(docker container ls  | grep 'hydrus-web' | awk '{print $1}') /bin/sh

# run /verify_access_key
curl http://hydrusclient:45869/verify_access_key?Hydrus-Client-API-Access-Key=0ad2........af67

# output from curl
{
  "basic_permissions": [0, 1, 2, 3, 4, 5, 6],
  "human_description": "API Permissions (Hydrus web): add tags to files, add urls for processing, import files, manage cookies, manage database, manage pages, search for files: Can search: all tags"
}

option for saucenao api key

having the option to add your saucenao api key for the lookup on the send page would be a nice feature for people with premium account's so they can lookup more images without being rate limited.

Tag exclusion autocomplete

Short gist of it is: It should be possible to start typing - and then have the application autocomplete the tags after that.
Example: Start typing -dou and medium:doujinshi would show up. If that tag is selected, the - will be prepended and the endresult would be -medium:doujinshi

Hydrus supports tag exclusion via the API and it is possible to write out the exclusion in the tag field of hydrus web, but it's still a pain to do on bigger/more tags without auto completion.

fav searches?

Favourite searches. Either saved locally in browser or pulled from the API when that is supported.
Users prob want to return to the content they care most about.

Can't hit enter to add tag in settings tag input on mobile

It just proceeded to the next form field

Default sorting option

Currently it seems "import time: newest first" is hardcoded as the default sorting method when browsing files. I would like it if this could be changed in the settings menu, as "modified time: newest first" is much more useful for me.

Prevent back from exiting whole app

On Android hitting back can exit the whole app. If photoswipe is open it should close it but not close out of the app.

Feature request: Slideshow

Hi there,
is it possible to add a slideshow feature with pause/play buttons to build a slideshow from the searched images?

Default destination page on the send page

The ability to set the default page that hydrus-web send URL's to

Fetch files by ID when tag limited

Per the Hydrus API docs, if the current API user is tag limited, they need to request files, metadata, and thumbnails by file_id, not file hash.

If a tag limited user is trying to use the web app, and perform a valid search, to which they have rights, they get back a bunch of greyed out thumbnails and a bunch of 403's, and can't access the files when they click on them either.

I see there's an old issue changing from file_id to hash because of caching, but currently tag limited users can't view images at all.

Archive/Delete or Dupe Filter?

Archive/Delete or Dupe Filter on the site?

[Feature request] favourite (like/dislike ratting service)

The ability to filter/search for favourite items.

I'm unsure if the current API allows for that but if it does it would be a grate feature.

504 Gateway Timeout when SSL used

I'm trying to use Hydrus Web and it works locally with non-SSL but it doesn't work on another device on the same network. I read it has to be SSL to connect from another client on the network, but SSL gives the error:
Error searching: Http failure response for https://127.0.0.1:45869/get_files/search_files?tags=%5B%5D&file_sort_type=2&file_sort_asc=false&return_file_ids=true&return_hashes=false: 504 Gateway Timeout
What can I do to make this work? Do I need to make a self-signed certificate… but can I do that for an IP or do I need to assign one to my computer?

MacBook Studio
MacOS 13.4.1 (22F82)
Hydrus v540

I do have a QNAP NAS and could put Docker in a container but I think that would be rather inconvenient.

My end goal is to use Hydrus Web outside the network to edit tags and such remotely.

Video Playback without the need of another tab.

Video Playback without the need of another tab.

Want video playback on the main tab itself, in the carusel.
Know this might be an issue, but still want it.

A site wide volume slider might be needed. Or the option to mute everything by default.

Also having looping as a default would be nice.

http failure during parsing

Hi, I'm trying to access my Hydrus files on my Android device so I can manage files more conveniently. I tried following the steps in the wiki but keep getting "verift access key" error. What am I doing wrong?

Let me know what logs to share to help identify the issue.

When I go to my Duck DNS domain, I'm able access the Hydrus API. I'm using the Tailscape IP and have connected both my PC and Android device to it.

[solved] Can not get working, I've tried ALL methods | I think I'm losing my mind

I have followed the wiki Accessing-the-Hydrus-API-with-Caddy,-Duck-DNS,-and-Tailscale to a T multiple times and can not get it to work.
I am losing my mind trying to figure out why or what's wrong and can't understand it.

• the Hydrus API is up and running with the settings needed
• the API key setting has full rights
• I have Tailscale Running and ready
• I have Duck DNS working
• I have downloaded and configured caddy EXACTLY how you asked
• in the caddy file added my subdomain email duck DNS API token all of it

And for some reason when I try the subdomain in my browser (on the local PC) it says

This site can’t provide a secure connection
my domain.duckdns.org sent an invalid response.

Try running Windows Network Diagnostics.
ERR_SSL_PROTOCOL_ERROR

So it knows the site is there. but I'm STILL not getting a valid cert!
I've tried on hydrus.app and got a 504 error with my credentials and the duck DNS URL.

My suspicions are with caddy, however, I don't know anything about networking certs.
Hell, I went through caddy's documents to see if I could figure it out for myself and nope, tried a lot of arguments in the caddyfile and nothing worked.

I have also tried the method provided by Chad90b on RfE: add a root-certificate to the hydrus api https process w/ user input fields for IP and DNS names #675 and nothing changed.

this has been going on for days and every time I try again I start to cry.

pleas help...
-kieren

Latest Client and API update breaks

The latest version of Hydrus' client is 565 and the API is 62. I recently did a upgrade to this version (jumped multiple versions so I don't know which version of the client or API broke this functionality) and now whenever the site tries to complete any query, an Unknown Error occurs which appears to be acting as if no access key was passed through the API. If I visit the site in the error manually, it loads the results with no problems.
What currently happens according to the site.

{
  "headers": {
    "normalizedNames": {},
    "lazyUpdate": null,
    "headers": {}
  },
  "status": 0,
  "statusText": "Unknown Error",
  "url": "http://localhost:45869/get_files/search_files",
  "ok": false,
  "name": "HttpErrorResponse",
  "message": "Http failure response for http://localhost:45869/get_files/search_files: 0 Unknown Error",
  "error": {
    "isTrusted": true
  }
}

What returns when I go to http://localhost:45869/get_files/search_files?Hydrus-Client-API-Access-Key={Access-Key}
{"file_ids": [], "version": 62, "hydrus_version": 565}

System predicate regex gets converted to lowercase

Add platform.SAFARI to about page

Sort order, file limit and password protection.

Hi!

Thanks so much for making this app, it works amazingly!

After using it for a while I found a few things that could be improved to make it even more amazing:
It would be great if we could sort the files
https://hydrusnetwork.github.io/hydrus/developer_api.html#get_files_search_files
file_sort_type
For example, sort by random so that we get different images each time.

Also, if we could customize the number of files got each time that would also be cool. (Now it gets just 96 files per scroll request)

Another feature that would be great is a simple PIN or password authentication before accessing the website when run locally (e.g., Docker)
For now, I can just add a simple auth to nginx but it would be nice if it were built in.

Thanks!

Remove shared URL from history after routing after sending a URL to Hydrus

[feature request] support gif preview

Document Hydrus API service settings

Especially enabling CORS

Image Test

feature request: display URLs for images

I'd like for the urls added to images in hydrus (like the danbooru url, pixiv url, etc) to be visible (perhaps in the file info popup)

Title filter for comics

Have a text input in the all comics page to filter by title.

feature request for a paste from clipboard button

feature request for an paste-from-clipboard button and/or an all-in-one paste+send button
ref.: ios users dont have send-to built in for pinned webapps

[Comics] Separate by creator as well as title

This alpha feature is pretty nice for viewing art variation sets. Unfortunately, it only does 'collect by title', so sets by different artists using the same title get mixed together.

Comics feature would be much more useful if it also distinguishes creators. Maybe also by series (one useful hydrus sort is series-creator-title-volume-chapter-page.

The ability to edit tags/urls

(From hydrus #general; @floogulinc wants to make this a feature)

The ability to add, edit, or remove tags and URLs from the web interface. This'd basically make it a lightweight hydrus interface to start tagging with.

Casual password protection.

This feature would be a simple PIN or password authentication preventing casual access to the website when run locally (e.g., Docker)

Better tag namespace display and customization

It would be awesome if tags could be sorted by namespaces instead of subtag so that unnamed spaced tags to on the bottom.

I would also love the ability to add different namespaces to also have separate colors. I could do this by editing the code for my instance, but having it in the gui would be great.

Or automatically assign a random color to all namespaces.

Thanks for epic app!

Fix thumbnail links

They currently don't automatically change depending on the existence of a trailing slash in the hydrus URL.

buttons move when url infobox appears on the send page

as mentioned on the discord - buttons move when url infobox appears on the send page

Feature Request: Allow restricting searched to archive/inbox only

I'd like to be able to search only archived posts when searching tags - currently this isn't possible.

Selfsigned Certificates don't work

Enabling https in hydrus cause it to create a self signed certificate. This does not work with Firefox for https://hydrus.app/.

The error returned:

GET https://127.0.0.1:45869/verify_access_key net::ERR_CERT_AUTHORITY_INVALID

Update to Angular 10

See https://blog.angular.io/version-10-of-angular-now-available-78960babd41

Error when downloading large fiels

Downloading large files (mp4 files >100 MB) encounters Error downloading file: Http failure response for https://....duckdns.org/get-files/file?hash=... 0 Unknown Error on latest dev version (1.1.0).

[Feature Request] file_sort_type and file_sort_asc support for browsing files.

Reading through the hydrus client API, it seems to support extra arguments being passed to the search for file_sort_type and file_sort_asc, which changes the method the results are sorted. I'm wondering if support for changing the sorting method and direction could be added to the web client, as it would make it easier to manage larger sets of images, or find specific things.

Could probably add a specific sort button near the filter button, or even include this in the same filter button.
Or even just add a custom tag for specifying order:

If not adding all of them, at the very least, it would be quite useful to have access to ordering by filesize, date imported (default), duration, random, has audio, number of frames.

Get thumbs and full images by hash

Because Hydrus will reuse IDs and the images are set to cache for a year, they should be requested by hash instead of ID.

Send to Hydrus

A page in the app where you can input a url and send it to Hydrus. It should use the API to check the URL first and display the type and status.

It should also be exposed with the web share Target API.

Comics not working

On latest hydrus version comics no longer load.

Feature request: Hotkey support

A way of quickly putting stuff out of inbox or to quickly assign item as favourite without the need to open the information menu with the press of a key would be a nice addition.

Bug: cannot use Z key in any fields when viewing a file

When viewing a file it's impossible to add a tag that has "z" in it, impossible to enter letter "z" when adding notes either. Only lowercase z is affected (i.e. shift-z works), seemingly the only keycode is affected, so pressing z with say, cyrillic layout would type "я" but it's not typed either. This seemingly only affects fields within image viewer, but not ones in the rest of the UI, i.e. you can still search tags that contain "z" just fine. Affects both Chromium and Firefox, doesn't seem to be related to any browser extensions. Nothing interesting in console when i press z. Could be a PhotoSwipe bug.

File metadata not showing

When clicking on the ⓘ button, the file metadata (known urls, tags, dimensions, etc) does not load. The site dims to attempt show it, but it doesn't load.

I suspect this may be due to the update in the client API with the way how the metadata is presented. I'm currently updating my tagging up to work with it too.

feature request: preset hydrus api url and api key

It'd be good to be able to have the api url and api key fields pre-populated when i'm hosting it so I can link it to people without having to instruct them to put in the url and key by hand. I managed to hack it together by editing the javascript by hand but a configuration file for it would be good.

Pages not loading after trying to goto settings

Using the docker container, on browsers that have not connected to hydrus web before when trying to goto settings nothing loads.
I get this error in the console:
main.bb19ece846da4239.js:1 ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of null (reading 'endsWith') TypeError: Cannot read properties of null (reading 'endsWith') at t.getAPIUrl (main.bb19ece846da4239.js:1:472658) at t.apiGet (main.bb19ece846da4239.js:1:472835) at t.getServices (main.bb19ece846da4239.js:1:475065) at new t (main.bb19ece846da4239.js:1:501467) at t.ɵfac [as factory] (main.bb19ece846da4239.js:1:501917) at O0.hydrate (main.bb19ece846da4239.js:1:44693) at O0.get (main.bb19ece846da4239.js:1:43258) at F3.get (main.bb19ece846da4239.js:1:68031) at qD (main.bb19ece846da4239.js:1:27425) at YD (main.bb19ece846da4239.js:1:27899) at G (polyfills.a029620566059ce9.js:1:16420) at G (polyfills.a029620566059ce9.js:1:15956) at polyfills.a029620566059ce9.js:1:17266 at y.invokeTask (polyfills.a029620566059ce9.js:1:7689) at Object.onInvokeTask (main.bb19ece846da4239.js:1:104526) at y.invokeTask (polyfills.a029620566059ce9.js:1:7610) at I.runTask (polyfills.a029620566059ce9.js:1:3084) at L (polyfills.a029620566059ce9.js:1:9689) at m.invokeTask [as invoke] (polyfills.a029620566059ce9.js:1:8770) at D (polyfills.a029620566059ce9.js:1:20639)
The only way to get things to load is to manually add the keys
hydrus-web-1_hydrusApiKey and hydrus-web-1_hydrusApiKey to local storage with a value set to them

Support for OR tag searching

The Hydrus client api now supports OR tag searching, as seen here and the formatting style can be found here.

Also, OR predicates are now supported! Just nest within the tag list, and it'll be treated like an OR. For instance:

[ "skirt", [ "samus aran", "lara croft" ], "system:height > 1000" ]
Makes:
skirt
samus aran OR lara croft
system:height > 1000

Not sure what your preference on stringing tags together to create an OR query, maybe these might inspire you:

• User long-presses to select tags to be added into an OR query
• User drags tags to the left of the tag search field into a + icon to build an OR query, then taps on the + icon to add the OR query to the search results.
• Just enter OR in capitals to count the tags next to the OR as an OR query. eg. samus aran OR lara croft OR chun-li

Hard code the API so it loads for everyone on the network?

I have Hydrus Web hosted in a container on my private network and would like my roommates and myself to be able to load Hydrus Web from any device with the API credentials prefilled. Is there a way to do this? Would be nice if there's a config file where I can just put the API settings in. I think at the moment it's just stored in a cookie :<

Unable to connect to API server using DuckDNS

I followed the guide in the wiki, but I still can't reach the API server of my Hydrus Network. So far I've:

• Enabled client API (changed port to 7869, I can access it with localhost:7869)
• Set up a Tailscale account & started it (I can ping it)
• Set up a Duck DNS account & created a new subdomain
• Updated the IPv4 of the subdomain with the Tailscale IP (100.x.y.z) of my PC
• Downloaded caddy.exe with Duck DNS support and WinSW-x64. (renamed to caddy-service.exe)
• Created caddy-service.xml, filled it with the following:

<service>
  <id>caddy</id>
  <!-- Display name of the service -->
  <name>Caddy Web Server (powered by WinSW)</name>
  <!-- Service description -->
  <description>Caddy Web Server (https://caddyserver.com/)</description>
  <executable>%BASE%\caddy.exe</executable>
  <arguments>run</arguments>
  <log mode="roll-by-time">
    <pattern>yyyy-MM-dd</pattern>
  </log>
</service>

• Created Caddyfile, filled it with the following:

https://DOMAIN.duckdns.org {
	reverse_proxy localhost:7869
	tls MAIL {
		dns duckdns KEY
	}
	encode zstd gzip
}

• Started the Caddy service using Services and executed caddy.exe -reload in the caddy directory

After all these steps, visiting my Duck DNS subdomain has led to various results. Sometimes it is unresponsive, sometimes it brings me to the default nginx page (I don't know why, I don't have it running), but currently it is showing me the Hydrus client API site after I used caddy.exe -reload despite not having changed Caddyfile or caddy-service.xml. And though the correct page is shown,, I still can't connect hydrus.app with my API URL and key:

Error: Http failure response for htps://horihydrus.duckdns.org/verify_access_key: 0 Unknown Error

Looking at the Debugger, it seems I am being redirected from port 80 to 443 - shouldn't it be 7869? I also could successfully verify my access key by sending a REST request directly.
What exactly takes care of updating the IP of my domain on Duck DNS in this process?