In a real-life scenario, the server can access the key and collect it back (just farming location.hash)
Sure you can, it’s been built-in to the HTTP spec since RFC1738[1]. You just do:
//<user>:<pass>@<url>[:<port>][/<location>]/
It doesn’t work on IE classic, but should still be perfectly valid on Chrome, Safari, Firefox, etc.
This means you must have a secondary channel to communicate to the user about the password, and the server must also know the password.
So depending on your use-case, the basic auth isn't suitable. For example, mega : https://en.wikipedia.org/wiki/Mega_(service) , in which you want to ensure that the decrypted data is _not_ accessible to the server, so the key is not stored nor sent to the server!