A New Rclone Web GUI Built for the Latest RC API

Hi, I want to share a new web GUI I have been building for rclone.

Repository:

At the moment, it supports:

  • multiple connection profiles
  • viewing rclone system information and status summaries
  • browsing remotes and importing/exporting rclone config
  • common file operations such as copy, sync, move, and delete
  • viewing running and completed jobs, and stopping active jobs
  • mobile-friendly layout

A few things it intentionally does not try to do:

  • local file upload/download or media streaming
  • generating public/download links by deriving them from RC auth
  • mount/unmount management
  • complex interactive remote configuration or OAuth flows

It can be served as a static web app with --rc-files or be used with --rc-web-fetch-url.

A few screenshots:

2 Likes

Nice, all of this in 1 day? I'm a fan in that regard :smiley:

There's a new GUI command in the works, which is meant to be very light and talk to your local instance. I see some similar decisions, down to wording and some non-trivial arrangement, so I take you may already be familiar with that. It will keep the functionality of using other WebUIs, so you should definitely keep going with it, the more the better!

Some small feedback: I can see the landmarks of Claude here in the Sidebar and button sizes, usually it gets confused by the overall layout and you get stuff like this early cut in the Sidebar. You also end up with differently sized buttons. See my screenshots below. Not sure if this is still happening today with their latest model 4.6


Now that I think of it, including translations (crowdsourced w/ an industry standard solution like Crowdin or Lokalise, or simply just PRs), could be a good idea.

Cheers

1 Like

Thx for your feedback!

Nice, all of this in 1 day?

It actually took up my free time for a whole week.

There's a new GUI command in the works, which is meant to be very light and talk to your local instance. I see some similar decisions, down to wording and some non-trivial arrangement, so I take you may already be familiar with that.

Actually, I don't know this. Is it the recently appeared rclone-web repo? I haven’t been keeping up with the latest developments in the rclone project, and if I’d known, maybe I wouldn’t have started building this on my own.

Some small feedback

I have tried my best to do some fix.


including translations

There’s already a multilingual implementation in src/shared/i18n, and I don’t think the project is at a scale yet where it needs an external localization collaboration platform.

1 Like

This looks like a massive improvement over the standard interface. I’ve been looking for a way to manage my remotes that feels a bit more modern and snappy. The setup seems pretty straightforward, too.

1 Like

v0.3.0 is out. Now file download/upload and media preview is supported. thought there are some limitations.

I recommend using an authentication gateway + reverse proxy + --rc-user-from-header instead of rclone’s basic auth, so that web downloads and media preview can be done securely.

1 Like

@outlook84 This looks really interesting. Thanks for sharing!

One immediate issue I ran into when trying to set this up behind an authentication proxy is that it doesn’t seem to support alternate base url paths and assumes assets are served from the root /.

When using the option --rc-baseurl rclone I get a 404 on the manifest.webmanifest and assets/index js/css files and it fails to load the page.

1 Like

Thx for your feedback. I made some fixes now this works on my environment.

Please try out v0.3.6: Release v0.3.6 · outlook84/yet-another-rclone-dashboard · GitHub

1 Like

Thanks for the quick fix. Yes, that seems to work now. The only minor issue I saw in this new version was that it seems to require a final trailing slash after the base url in the browser. Without that trailing slash it appears to still attempt to load the mainifest and assets without the subdirectory path. (i.e. /sub1/sub2 fails because assets attempt to load from /sub1/assets but /sub1/sub2/ loads fine).

This isn’t a major issue all all but I thought might be a simple fix in the code.

I’m testing this from an Open OnDemand HPC environment, where we can either proxy or reverse proxy the app to be available for users, and it uses the convention of ///

1 Like

I think this happens because both the browser and the reverse proxy are seeking sub2 as a file instead of directory when using /sub1/sub2.

I always configure reverse proxy to redirect /sub1/sub2 to /sub1/sub2/ when using subpath.

1 Like