Cross-browser sync : a self-hosted approach

Ever wonder how to share and sync your passwords and bookmarks across your web browsers ? Yes, just use Firefox Sync or Google Chrome Sync, you may answer.

While you are totally right, how about getting rid of these services and doing it the self-hosted way ? It does require a bit of work, but getting a cross-platform and privacy-oriented synchronisation solution sounds appealing, right ?

This guide will show you one way to achieve this, using Bitwarden as your password manager, and Floccus to sync your bookmarks. Please keep in mind this is just one solution among many others.

Here are the requirements :

  • DNS records for a domain name pointing to your home/network
  • A working Docker instance
  • A working Nextcloud Instance

Bitwarden as your password manager

Bitwarden is a secured cross-platform open-source password storage solution. We’re going to use it to store and sync a very important aspect of your privacy : your valuable account passwords.

What you should do first is registering a new DNS record for your domain, say for instance bitwarden.yourdomain.com or bw.yourdomain.net . This will be used as your server address to securely connect your clients in the next steps. So you need to open ports 80 and 443 on your router and forward them to the machine hosting the service.

Bitwarden offers an automated script to install it on your instance, using a trusted SSL certificate for your domain provided by Let’sEncrypt and Certbot. If you want to go this way, feel free to do it, but in my case I use the Nginx Proxy Manager application to manage my exposed services, as it will take care of securing the Bitwarden service for me.

So the plan is to deploy Bitwarden with Docker, and letting Nginx Proxy Manager doing the job (“bring your own SSL certificate/tool” method as stated in Bitwarden’s documentation).

Assuming you’ve got a working Docker instance (and docker-compose installed) and you’d like to go with the same setup as I did, the deployment is fairly easy thanks to Docker-compose. Here is a sample docker-compose.yml :

version: '3'

services:
  bitwarden:
    image: bitwardenrs/server
    restart: always
    volumes:
      - ./bw-data:/data
    ports:
      - 8080:80
    environment:
      WEBSOCKET_ENABLED: 'false' # Required to use websockets
      SIGNUPS_ALLOWED: 'true'   # set to false to disable signups

Customize the port according to your needs; note the SIGNUPS_ALLOWED setting. Depending on your plans, you might want to set it to ‘false’ once your account will be set up.

One docker-compose up -d later, and your instance is up and running at your Docker server’s ip:port.

Now remember to set up your SSL reverse proxy. In my case Nginx Proxy Manager is doing the job, because Bitwarden requires a valid signed certificate to work. Your Bitwarden instance is now reachable at the domain URL you set up earlier.

You should also register your Bitwarden instance and request your private Installation Id and Installation Key. As stated in the documentation, The Installation Id and Key are applied in your Bitwarden instance here: ./bwdata/env/global.override.env . The docker-compose method above did not create this file, so you should do it manually with your editor of choice, add these lines to the file and fill them with the keys you just got :

globalSettings__installation__id=
globalSettings__installation__key=

And you’re pretty much done at this point. You can now import your passwords from a .csv or .json file to Bitwarden (guide to export from Firefox here for instance), and setup Bitwarden through its web UI. A comprehensive documentation is available.

Bitwarden web UI is clean and easy to use

You can now install the companion extension for your browser of choice. In my case, I use Firefox and Chromium on my computers, and Firefox mobile and Kiwi browser on my phone.

Connect using your credentials, setup your master password, disable the password management tool included in your browser, and voilà, you now have a secured cross-platform tool for all your passwords and account protection needs.

Every time you need to auth to a web service, you just have to click this little blue shield to select the respective user/password combo you saved earlier. Auto fill is also offered as an experimental feature, and it works quite well, as long as you don’t have multiple account on the same service / domain.

Bitwarden is available for a large choice of OS and web browsers

I haven’t tried the desktop apps yet as I don’t really need them for now, but I’ve read good reviews about it. Give it a try if you wish.

Now let’s get to the bookmarks sync part.

Using Floccus to sync your bookmarks

Bookmarks syncing is more about comfort than privacy : these are ‘just’ hyperlinks, right ? But you may have your own reasons to hide them from the proprietary syncing tools and storage included in your favorite browser though.

Anyway, you prefer using Chromium on your laptop coding machine, while you’re more a Firefox guy when browsing Internet on your desktop gaming rig ? No problem, Floccus has you covered.

Floccus appeared to me as a convenient solution, because I already run Nextcloud as my self-hosted ‘drive’ platform. So yes, please refer first to the hundreds of tutorials on how to install it, I won’t cover this here since it would deserve an entire topic depending on your infrastructure and goals. Anyway, If you haven’t already considered using such a tool, I strongly recommend you to do so and to have a look at the various usages available with Nextcloud.

Floccus can also works with a standard WebDAV share server and will sync through a XBEL file on this server, or even with a local file. Have a look there.

Floccus is able to use various methods to sync your bookmarks

Floccus works with the Nextcloud bookmarks application, so the first step is to install it on your instance, and then import your bookmarks through a .csv file for example. Keep this file while your setup isn’t complete, in case you break something or delete the wrong folder, you will always be able to restore your bookmarks.

Wait for a bit while the application parses and imports your bookmarks. Once it’s done, go grab the extension for your browser :

floccus on Mozilla addons
floccus on Chrome Webstore
floccus Microsoft Edge Addons

Once installed in your system, set up your account and specify which local folder will be synced with your bookmarks on Nextcloud. In my case, I selected the ‘whole’ Bookmarks Bar :

‘Barre de favoris’ = Bookmarks bar

Now disable the built-in sync engine of your browser (in Chrome, and in Firefox for example), and delete all your current local bookmarks, to start from a ‘fresh’ setup.

First sync takes a short while, and you should see your bookmarks appearing on the folder you chose before (ex : the bookmarks bar). Some of them might not respect your folder / single link organisation, and I had to restart my browser and sync process at least once to fix this.

Synchronisation works well across Chromium (Linux computer) and Firefox (Windows computer) in my case, it’s been a flawless experience so far.

Conclusion

Regarding bookmarks, Floccus is really great, but it might not be a good choice for you if you don’t run Nextcloud, at least some kind of a WebDAV server. In this case, you could have a look at solutions like xBrowserSync for instance. Also, there is a valuable list of self-hosted services, available on Github, called awesome-selfhosted, and you’ll find a section related to bookmarks sync there.

With both your passwords and bookmarks back under your control, your privacy should be quite improved, while i really like the cross-browser convenient aspect of this. Sure, dealing with your navigation tracking is another matter, but it does involve a lot more than just self-hosting a few services.

Leave A Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.