Accessing the webui behind a proxy

Hi, I have a server with my basic webapp being served via nginx.

Now I have installed ipfs and want to add a /ipfsui proxy target which would take me to the webui for ipfs, thus I made the following additions to my existing fowardproxy in nginx.conf

        location /ipfsui {
            proxy_pass http://127.0.0.1:5001/webui/;
            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;
        }

        location /ipfs {
            proxy_pass http://127.0.0.1:5001;
            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;
        }    

Now I can go to the ipfs ui by going to http://my_server_ip/ipfsui which properly redirects me to http://my_server_ip/ipfs/hash_here/#/

However, the page has no relevant ipfs info (like my peer id and so on).

Then I went on to inspect the console error messages and found:

Uncaught TypeError: Cannot read property 'split' of undefined     bundle.js:2185
(anonymous function) @ bundle.js:2185
(anonymous function) @ bundle.js:21711
EventEmitter.emit @ bundle.js:6430
Response.handle @ bundle.js:7115
xhr.onreadystatechange @ bundle.js:6878
bundle.js:2225 Object {version: undefined, updateAvailable: false, updating: false, gateway: "http://127.0.0.1:8080"}

After looking up these error lines I came to the conclusion that the code in page.jsx (which has since changed in the main webui git repo, link: https://github.com/ipfs/webui/blob/master/js/views/page.jsx, but not changed so as it would overcome this problem of mine) determines the ipfs api url and port from window.location.host and window.location.port.

This is the snippet of the webapp that that I currently get served (via ipfs of course):

var host = window.location.hostname
var port = window.location.port || 80
var daemonConf = LocalStorage.get('daemon')
if (daemonConf) {
  host = daemonConf.host
  port = daemonConf.port
}
var ipfs = require('ipfs-api')(host, port)
var ipfsHost = window.location.host

var Page = React.createClass({
  displayName: 'Page',
  getInitialState: function () {
    var t = this

    ipfs.config.get('Addresses.Gateway', function (err, res) {
      if (err || !res) return console.error(err)

      var split = res.Value.split('/')
      var port = split[4]

(you can see where the code failed to split and tracedback from this snippet and the error above)

I know that not everyone will be running this behind a proxy and also that I can temp fix via making the ipfs api listen on 0.0.0.0 by setting it via ipfs config ... but want to ask if there is anby other way to get around my current problem before I embark on that path.

[zertrin]

My current workaround without opening to the world the port from the server where ipfs is running is using SSH port forwarding like this:

ssh -L 5001:localhost:5001 myserver.example.org

and then accessing from my computer at http://localhost:5001/webui

It’s working but still looking to avoid having to open a SSH connection and using a reverse proxy.

[wrouesnel]

There’s also problems if you’re trying to put HTTPS in front of the UI via nginx. It loads fine, but then the web-ui immediately tries to access it’s own content via HTTP rather then HTTPS and is blocked.