# Install Webclient

Installation guide of the Psono Webclient

# Preamble

The webclient is a stateless website, allowing users to access their passwords without the need to install anything (besides a browser). It can be served by any web server, we prefer Nginx, but any other webserver (Apache, IIS) is fine too. The web client is optional. As an alternative users can use the official Psono browser extensions.

# Installation with Docker

The latest build of our Web Client as a docker image can be found here: hub.docker.com/r/psono/psono-client/ Follow belows instructions to bring it online.

Create a config.json with the following content in e.g. /opt/docker/psono-client/:

{
  "backend_servers": [{
    "title": "Psono.pw",
    "url": "https://www.psono.pw/server"
  }],
  "base_url": "https://www.psono.pw/",
  "allow_custom_server": true,
  "allow_registration": true,
  "allow_lost_password": true,
  "disable_download_bar": false,
  "authentication_methods": ["AUTHKEY", "LDAP"],
  "saml_provider": []
}

Adjust the title and URLs according to your setup. The backend_server url should be the url where you see the line below when you append /info/ to it:

{"info":"{"version": "....}

(optional) Change domain for login

You don't see it yet, but later on the login mask your username will be a composition of something that the user defines, and a domain, forming the full username that looks similar to an email address (e.g. [email protected]).

The client will parse the base_url parameter from the config.json. Sometimes you would want to specify a different domain. You can do that by adjusting the config.json as shown below:
```
{
  "backend_servers": [{
    ...
    "domain": "other.com",
    ...
  }],
  ...
}
```

(optional) SAML provider

If you want to use SAML, you have to add "SAML" to the authentication_methods, and add the saml providers to the list The provider id needs to match the provider id from the settings.yaml:

{
  ...
  "authentication_methods": ["SAML"],
  "saml_provider": [{
    "title": "Some text before the button. e.g. Company Login",
    "provider_id": 1,
    "button_name": "SAML SSO Login"
  }]
  ...
}

(optional) Create privacy policy

Create an own privacy policy as html in e.g. /opt/docker/psono-client/privacy-policy-content.html

If you are looking for inspiration you can check out our privacy-policy-content.html
Run the docker image and expose the port
```
docker run --name psono-client \
    -v /opt/docker/psono-client/config.json:/usr/share/nginx/html/config.json \
    -v /opt/docker/psono-client/privacy-policy-content.html:/usr/share/nginx/html/privacy-policy-content.html \
    -d --restart=unless-stopped -p 10101:80 psono/psono-client:latest
```
This will now start the psono client on port 10101 with your config.json

If you open now http://your-ip:10101 you should see a beautiful login screen. If not, please make sure you have no firewall on the server blocking you.

TIP

Leave out the line with the privacy policy if you have no own

Setup nginx (or apache) relay

A good webserver config is essential for your security. If you have chosen nginx as your webserver, then a suitable config can be found here:

server {
    ...
    location ~* \.(?:ico|css|js|gif|jpe?g|png|eot|woff|woff2|ttf|svg|otf)$ {
        expires                 30d;
        add_header              Pragma public;
        add_header              Cache-Control "public";
        proxy_set_header        Host $host;
        proxy_set_header        X-Real-IP $remote_addr;
        proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header        X-Forwarded-Proto $scheme;

        proxy_pass              http://localhost:10101;
        proxy_redirect          http://localhost:10101 https://example.com;
    }

    location / {
        proxy_set_header        Host $host;
        proxy_set_header        X-Real-IP $remote_addr;
        proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header        X-Forwarded-Proto $scheme;

        proxy_read_timeout      90;

        proxy_pass              http://localhost:10101;
        proxy_redirect          http://localhost:10101 https://example.com;
    }
}

This config assumes that the webclient is running on localhost port 10101.

Setup Reverse Proxy

To run the Psono password manager in production, a reverse proxy is needed, to handle the ssl offloading and glue the psono server and webclient together. Follow the guide to setup reverse proxy as a next step.

# Installation without Docker

The webclient is a pure html / js website, that can be hosted with any webserver and has zero dependencies.

Download the webclient artifact

Visit the following url and download the webclient:

psono.jfrog.io/psono/psono/client/latest/webclient.zip
Install webclient

Unpack the webclient into the htdocs folder of your webserver.

Update config.json with the following content:

{
  "backend_servers": [{
    "title": "Psono.pw",
    "url": "https://www.psono.pw/server"
  }],
  "base_url": "https://www.psono.pw/",
  "allow_custom_server": true,
  "allow_registration": true,
  "allow_lost_password": true,
  "disable_download_bar": false,
  "authentication_methods": ["AUTHKEY", "LDAP"],
  "saml_provider": []
}

Adjust the title and URLs according to your setup. The backend_server url should be the url where you see the line below when you append /info/ to it:

{"info":"{\"version\": \"....}

(optional) Change domain for login

You don't see it yet, but later on the login mask your username will be a composition of something that the user defines, and a domain, forming the full username that looks similar to an email address (e.g. [email protected]).

The client will parse the base_url parameter from the config.json. Sometimes you would want to specify a different domain. You can do that by adjusting the config.json as shown below:
```
{
  "backend_servers": [{
    ...
    "domain": "other.com",
    ...
  }],
  ...
}
```
(optional) SAML provider

If you want to use SAML, you have to add "SAML" to the authentication_methods. You can remove LDAP and authkey, if you only want to support SAML. Afterwards add the saml providers to the list. The provider id needs to match the provider id from the settings.yaml:
```
{
  ...
  "authentication_methods": ["SAML"],
  "saml_provider": [{
    "title": "Some text before the button. e.g. Company Login",
    "provider_id": 1,
    "button_name": "SAML SSO Login"
  }]
  ...
}
```
(optional) Update privacy policy

Update your privacy policy in privacy-policy-content.html
Setup Reverse Proxy

To run the Psono password manager in production, a reverse proxy is needed, to handle the ssl offloading and glue the psono server and webclient together. Follow the guide to setup reverse proxy as a next step.

← 2b. Install Server EE 4. Install Admin Webclient (optional) →