empty gui under ubuntu 16.04 about lxd-webgui HOT 39 CLOSED

@saldru the deb is a browser with the lxd-webui web app(electron application). The tar.gz is web app static files which need to serve with Apache or Nginx or other server. I don't provide a server for a webapp. ./lxd-webui is a browser which run on desktop environment.

from lxd-webgui.

Seems LXD-WEBGUI cannot connect to the local lxd server.

Can you try to open https://localhost:9000
Does it return any data?

from lxd-webgui.

Yes it return:
{"type":"sync","status":"Success","status_code":200,"metadata":["/1.0"]}

Sorry, yesterday I forgot an important info - I don't use it local, I have it installed on a server version, and connect it over lan.

lxc config show looks like this:

config:
  core.https_address: 192.168.0.16:9000
  core.https_allowed_headers: Origin, X-Requested-With, Content-Type, Accept
  core.https_allowed_methods: GET, POST, PUT, DELETE, OPTIONS
  core.https_allowed_origin: https://192.168.0.16:8000
  core.trust_password: true
  storage.zfs_pool_name: lxd-store

Is that correct?

I also try a config with localhost, like in your description, but is the same.

from lxd-webgui.

Cool, I never used it via the network atm :-)

I see your LXD server is on "192.168.0.16:9000", and your allowed_origin is "192.168.0.16:8000", both point to the server. But if you connect to a remote server, the allowed_origin has to be your client address (e.g. 192.168.0.1). In other words, the allowed_origin is a whitelist of client IP's which are allowed to connect to the LXD rest interface.

That is because lxd-webgui runs 100% in the browser (only the javascript files are delivered via a web server), so you have to manually allow each client in the "https_allowed_origin".

Try changing:

core.https_allowed_origin: https://ip_where_your_browser_is_running:8000

For debugging, you can show the browser debugging console by pressing F12, and check the console output and/or network tab for errors.

Edit: Maybe what i wrote here is complete bullshit. I'm a bit confused with the same origin policy of the browser. I'll try to reproduce. Anyway, works on my ubuntu 16.04

from lxd-webgui.

Can you tell me more about your setup?

• On which IP is the LXD server running?
• On which IP is the LXD-Webgui webserver running?
• On which IP is the browser running?

Thx :-)

from lxd-webgui.

I try it like you say it, but it have no effect :(. The best would be like this:

core.https_allowed_origin: https://192.168.0.0/24:8000
or:
core.https_allowed_origin: https://0.0.0.0:8000
Because the server runs in a DMZ and I want to connect them from different clients.
(But this is only a "nice to have") - maybe this is possible with a apache proxy?
To your questions:

• LXD Server runs on 192.168.0.16
• LXD-Webgui runs on 192.168.0.16
• My browser runs at the moment on 10.8.0.18

The interesting thing is: When I have the browser console open an load the page, it comes first:
https://192.168.0.16:8000/modules/image/images.html
But right after it comes:
https://localhost:9000/1.0/operations
And this repeats forever.

from lxd-webgui.

The /operations is executed all few seconds, that's normal.

You dont get any error messages in the console?
What is the network answer when the browser tries to request /operations?

from lxd-webgui.

Maybe this: https://localhost:9000/1.0/operations is not right, and it must be: https://192.168.0.16:9000/1.0/operations. But how can I change this?

The answer is: Aborted localhost:9000 0 B

from lxd-webgui.

Ah, what i should have asked first: did you configure the server in the "Settings" tab? If not, it will take localhost as default for your lxd server.

from lxd-webgui.

You mean the settings tab from lxd-webgui? This site i blank, so I'm not able to do there something. The lxd-server and the lxd-webgui runs no the same machine, so in general localhost is not bad, I only connect from a different client.

from lxd-webgui.

True, the settings page is empty when there is no connection to the server. This is wrong.

I fixed the settings page, can you do a git pull, configure the server (and also use your initial allowed_origin)

from lxd-webgui.

Ok, now I see the settings page. With LXD Server localhost:9000 I get the same result. With LXD Server 192.168.0.16:9000 I get:

GET https://192.168.0.16:9000/1.0

Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf https://192.168.0.16:9000/1.0. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt).
GET https://192.168.0.16:9000/1.0/operations

403 Forbidden

"NetworkError: 403 Forbidden - https://192.168.0.16:9000/1.0/operations"
operations
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf https://192.168.0.16:9000/1.0/operations. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt).

This mean something like: reading from same source rule forbidden.

from lxd-webgui.

Yes, i have the same error on my side. Looking into it.

Deutsch ist btw kein Problem ;-)

from lxd-webgui.

Ok, the whole thing is a bit strange.

The browser does not allow access to the "/operations", because of the same origin policy. This should be handled by the allow-origin set above (for you, like you correctly did: "core.https_allowed_origin: https://192.168.0.16:8000")

Now for some strange reason, it seems like LXD forgets this settings, which prohibits the browser to access the data.

Anyway, the fix for me was a simple:

service lxd restart
service lxc restart

After restarting both (or one?), LXD correctly provided the HTTP headers.

Can you try this? :-)

Edit: Dont forget to open https://192.168.0.16:9000 once in the browser in a standalone tab.

from lxd-webgui.

Funny, that this helps... lxc I can't restart, because this service I have not install. But restart lxd helps a little bit. Now Test LXD brings: Result: Success . But the auth test still fail:

"NetworkError: 403 Forbidden - https://192.168.0.16:9000/1.0/operations"
operations
GET https://192.168.0.16:9000/1.0/operations

403 Forbidden
GET https://192.168.0.16:9000/1.0/certificates

403 Forbidden
"NetworkError: 403 Forbidden - https://192.168.0.16:9000/1.0/operations"
operations
"NetworkError: 403 Forbidden - https://192.168.0.16:9000/1.0/certificates"

Grüße in die Schweiz ;)

from lxd-webgui.

Already an improvement :-)

A 403 means that the LXD server cannot authenticate you. Authentication is performed with the client certificates. Are you sure you:

1. created a client certificate?
2. added it to the LXD server?
3. added it to the local browser?

When you open https://192.168.0.16:9000/1.0/operations the browser should ask you to select the correct cert.

from lxd-webgui.

No chance :(. I have repeat the steps with the certificate, but I get still the same error.

from lxd-webgui.

Ok damn. Maybe it's necessary to also authenticate via an additional password. I'm not sure, but I also did it once for debugging purposes.

Check chapter "curl over the network (and client authentication)" in https://www.stgraber.org/2016/04/18/lxd-api-direct-interaction/

You can set a secret password with:

lxc config set core.trust_password "some random password"

And set it via cURL as described (which need the client cert. Sadly it cant handle PKCS12 files, I converted my p12 with http://stackoverflow.com/questions/32253909/using-curl-with-a-pkcs12-certificate-bash-script)

The whole debugging with curl will also make sure that the certificate really works (or not).

Additionally, you can also check with "lxc config trust list" if you added the correct certificate to lxd.
And double check that you added it correctly into the browser? (depends a bit on browser, should be on "personal" certificates, not CA certs or similar).

Damned, I thought I was smart to make a JavaScript only application, but it seems it requires quite a bit of setup and debugging to make it work :-(

from lxd-webgui.

Hm something I do wrong. I have now install everything in a vm and there I also get the error. I have now everything on localhost.

Maybe tomorrow I have time to test this with the password.

from lxd-webgui.

I'll also try to reproduce on a VM today.

from lxd-webgui.

Hello,
I have the same problem as @jb-alvarado, Il would like to make a Web GUI for LXD and manage it remotely.
The Web Server and the LXD Server are on the same machine and I would like to manage LXD with my remote computer.

The problem is :

• LXD Listen Address : 192.168.1.13:9000
• LXD Web GUI Address : 192.168.1.13:8000
• The Certificats are correct because, if I go to the web address of the LXD Server, It return me "success 200" in https://192.168.1.13:9000/1.0/operations
• In your Web LXD GUI, if I check the server listening socket, It's return me "success" but the auth server return me "failed".

I have look in the Firefox web console and I saw it : Problem with CORs Address.
How can I solve this error ? Thank you ! :)

(Sorry for my english, I'm french)

from lxd-webgui.

Hi @dobin and @saldru

Can you try https://github.com/aarnaud/lxd-webui on 16.04 because i doesn't have bug just less feature for the moment.

@dobin you can compare the code but it's angular2.

from lxd-webgui.

Hi @aarnaud,

Yes, I saw your project but, I'm not a developer and I'm not familiar to Node.js.
I don't know how your project works and how can I build it. Your Readme isn't easy-to-use for a noob in Node.js like me.

I tried to use your commands like "npm install" and "npm start" but I have a lot of errors.
Do you have a tutorial that explain step by step how can I install it ?

Thank you for your time. :)

PS : I have tried your web demo : http://aarnaud.github.io/lxd-webui/ with my remote server, Your web UI have successfully established a connection to my remote server but it have an error with the authorization.

from lxd-webgui.

@saldru i understand, you can try the online application on http://aarnaud.github.io/lxd-webui/ or the build archive(tar.gz optimized for a prod used) on release section on github project. The npm command is necessary just for development.

Thanks for your feedback.

from lxd-webgui.

@aarnaud I have downloaded the .deb and I have installed it. In the lxd-webui folder, I have tried to start the web server with ./lxd-webui but it did nothing. How can I start your LXD Web UI Server ?

Thanks.

from lxd-webgui.

@aarnaud I'm sorry,
Now, I have installed the web server but I have the same error like your demo website, The LXD Web UI is connected to the LXD Server but the authentication failed. Is like your Web Demo Server.

The Web UI return this :
Object { _body: "{"error":"not authorized","error_connection", status: 403, ok: false, statusText: "Ok", headers: Object, type: 2, url: "https://192.168.1.13:8443/1.0/containers" }

But If I go to this URL, il have this code :
{"type":"sync","status":"Success","status_code":200,"metadata":[]}

For the Web UI :
https://192.168.1.13:8443/1.0 [HTTP/1.1 200 OK 5 ms]
https://192.168.1.13:8443/1.0/containers [HTTP/1.1 403 Forbidden 1 ms]

My LXD Server is configured like this :

config:
  core.https_address: 192.168.1.13:8443
  core.https_allowed_headers: Content-Type
  core.https_allowed_methods: GET, POST, PUT, DELETE, OPTIONS
  core.https_allowed_origin: '*'
  core.trust_password: true

from lxd-webgui.

@saldru you have a probleme with your certificate client for authentification. Have you generate and import the certificate in your browers ? Like this howto https://github.com/aarnaud/lxd-webui#generate-x509-certificate-for-browser-authentification

I thinks you have the same probleme with lxd-webgui.

you can contact me in private message on twitter (https://twitter.com/bluelogon) for resolve this in french.

from lxd-webgui.

@aarnaud Yes it is, I have the same problem, I have added the certificat in my browser with the secret, and I have trusted the certificat in LXD Server, I have added the trust_password too.

from lxd-webgui.

@saldru Did you try the steps in:
the chapter "curl over the network (and client authentication)" in https://www.stgraber.org/2016/04/18/lxd-api-direct-interaction/ ?

To authenticate via the password, by using cURL?

from lxd-webgui.

@dobin, @aarnaud I followed these steps to install the LXD Web UI :

My configuration is :

Ubuntu Xenial 16.04
Kernel : 4.4
LXD 2.0.1

• Step 1 : Install LXD Web UI :

cd /var/www && mkdir lxd && cd lxd
wget https://github.com/aarnaud/lxd-webui/releases/download/0.1.0/lxd-webui-0.1.0.tar.gz
tar xvzf lxd-webui-0.1.0.tar.gz
chmod -R 755 /var/www/lxd
chown -R www-data:www-data /var/www/lxd

• Step 2 : Configure simple V-Host in the Web Server (Nginx) :

server {
        listen   80;
        root /var/www/lxd;
        index index.html;
}

• Step 3 : Init LXD with lxd init :

Name of the storage backend to use (dir or zfs): zfs
Create a new ZFS pool (yes/no)? yes
Name of the new ZFS pool: lxdpool
Would you like to use an existing block device (yes/no)? no
Size in GB of the new loop device (1GB minimum): 16
Would you like LXD to be available over the network (yes/no)? yes
Address to bind LXD to (not including port): 192.168.1.13
Port to bind LXD to (8443 recommended): 8443
Trust password for new clients:
Again:
Do you want to configure the LXD bridge (yes/no)? no
LXD has been successfully configured.

• Step 4 : I followed the commands to generate certificates with OpenSSL :

openssl genrsa -out lxd-webui.key 4096
openssl req -new -key lxd-webui.key -out lxd-webui.csr
openssl x509 -req -days 3650 -in lxd-webui.csr -signkey lxd-webui.key -out lxd-webui.crt
openssl pkcs12 -keypbe PBE-SHA1-3DES -certpbe PBE-SHA1-3DES -export -in lxd-webui.crt -inkey lxd-webui.key -out lxd-webui.pfx -name "LXD WebUI

• Step 5 : Configure LXD Server :

lxc config trust add lxd-webui.crt
lxc config trust_password <export_password>
lxc config set core.https_allowed_origin "*"
lxc config set core.https_allowed_methods "GET, POST, PUT, DELETE, OPTIONS"
lxc config set core.https_allowed_headers "Content-Type"

• Step 6 : Verify the LXD Server configuration :

apicompat: 0
auth: trusted
environment:
  addresses:
  - 192.168.1.13:8443
  architectures:
  - x86_64
  - i686
  certificate: |
    -----BEGIN CERTIFICATE-----
 <the_certificate_print>
    -----END CERTIFICATE-----
  driver: lxc
  driverversion: 2.0.1
  kernel: Linux
  kernelarchitecture: x86_64
  kernelversion: 4.4.0-22-generic
  server: lxd
  serverpid: 19595
  serverversion: 2.0.1
  storage: zfs
  storageversion: "5"
config:
  core.https_address: 192.168.1.13:8443
  core.https_allowed_headers: Content-Type
  core.https_allowed_methods: GET, POST, PUT, DELETE, OPTIONS
  core.https_allowed_origin: '*'
  core.trust_password: true
  storage.zfs_pool_name: lxdpool
public: false

• Step 7 : Configure the Web Browser (Mozilla Firefox) :

Tools --> Options --> Advanced --> Certificates --> View Certificates --> Your Certificates --> Import --> Select lxd-webui.pfx --> Enter export password --> OK

Go the https://192.168.1.13:8443 and confirm the self-signated certificate.
Then, I'm asked to choose a certificate. I choose the certificate named "LXD WebUI".

With my Web Browser, I check every pages of the LXD Server API :
https://192.168.1.13:8443 : {"type":"sync","status":"Success","status_code":200,"metadata":["/1.0"]}

https://192.168.1.13:8443/1.0 : {"type":"sync","status":"Success","status_code":200,"metadata":{"api_extensions":[],"api_status":"stable","api_version":"1.0","auth":"trusted","config":{"core.https_address":"192.168.1.13:8443","core.https_allowed_headers":"Content-Type","core.https_allowed_methods":"GET, POST, PUT, DELETE, OPTIONS","core.https_allowed_origin":"192.168.1.0/24","core.trust_password":true,"storage.zfs_pool_name":"lxdpool"},"environment":{"addresses":["192.168.1.13:8443"],"architectures":["x86_64","i686"],"certificate":"-----BEGIN CERTIFICATE-----\<certificate_print>\-----END CERTIFICATE-----\n","driver":"lxc","driver_version":"2.0.1","kernel":"Linux","kernel_architecture":"x86_64","kernel_version":"4.4.0-22-generic","server":"lxd","server_pid":2149,"server_version":"2.0.1","storage":"zfs","storage_version":"5"},"public":false}}

https://192.168.1.13:8443/1.0/operations : {"type":"sync","status":"Success","status_code":200,"metadata":{}}

https://192.168.1.13:8443/1.0/containers : {"type":"sync","status":"Success","status_code":200,"metadata":[]}

• Step 8 : Use LXD Web UI :

Go to http://192.168.1.13, (_IP address of LXD Web UI_)
Change https://127.0.0.1:8443 to https://192.168.1.13:8443 but it doesn't work. 

LXD Web UI said "Connection Established" but "not authorized".

This is the problem, I think that the problem is the authentication between LXD WebUI and the LXD Server.

from lxd-webgui.

@saldru thanks for you feedback but i think the last comment should be on https://github.com/aarnaud/lxd-webui

the best config nginx for angular with pushState is

location / {
    try_files $uri /index.html;
  }

from lxd-webgui.

@saldru @dobin I reproduce on firefox. I will investigate.

maybe: http://stackoverflow.com/questions/24005354/ssl-client-certificate-not-loaded-on-ajax-call-from-firefox

from lxd-webgui.

Yes I can confirm that this has to do with firefox. Now as you say this, I try google chrome and there it works!

from lxd-webgui.

Interesting. Indeed there seems to be a problem with firefox, it works with chrome.

If I set "setCredentials=true", i get an error with chrome:

XMLHttpRequest cannot load https://localhost:9000/1.0/operations. Credentials flag is 'true', but the 'Access-Control-Allow-Credentials' header is ''. It must be 'true' to allow credentials. Origin 'https://localhost:8000' is therefore not allowed access.

Awesome. There is atm no setting in LXD to configure Access-Control-Allow-Credentials.

Anyway, with FF it cannot authenticate at all with no Allow-Credentials, as mentioned above.
But With allow-credentials=true, LXD just returns EMPTY JSON response body, but with a correct content length :-(

from lxd-webgui.

Access-Control-Allow-Credentials :

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Requests_with_credentials

We need to make a merge request on https://github.com/lxc/lxd to add this.

from lxd-webgui.

Just a small note from the macOS site. Safari has the same problem as FF.

[Error] Failed to load resource: the server responded with a status of 403 (Forbidden) (operations, line 0)

to

https://[...]:8443/1.0/operations

where 8443 is the lxd port.

Chrome works perfectly.

from lxd-webgui.

@MrApe @jb-alvarado @saldru if you're still interested, here's an update.

I've prepared this PR. If it will be accepted and merged, then you will be able to use following LXD server option.

https_allowed_credentials
To use LXD API with all Web Browsers (via SPAs) you must send credentials
(certificate) with each XHR (in order for this to happen, you should set
"withCredentials=true" flag to each XHR Request).

Some browsers like Firefox and Safari can't accept server response without
Access-Control-Allow-Credentials: true header. To ensure that the server will
return a response with that header, set core.https_allowed_credentials=true.

I will prepare a checkbox in GUI that sets withCredentials=true options to each XHR globally soon. Get ready for merging ;)

from lxd-webgui.

Thank you for the info! By time I will take a look on this. But first it needs a update on lxd side, right? For the future it would be nice to, that there is no need for a browser certificate (only a password login), but I guess it is necessary?

from lxd-webgui.

@jb-alvarado yes it needs an update first, but you can checkout my branch (cloned from master few days ago, so all features are present) and build it with make from sources.
I can not say anything specific about the access with login/password, because I think that this method is less secure.

from lxd-webgui.