How can I load NodeBB in an iframe?

delc82

I'm building an application and inside the dashboard I need to load NodeBB in an iframe, how can I do that? Shows an empty iframe when I try.

psychobunny

Will be fixed here: https://github.com/NodeBB/NodeBB/issues/1616

In the meantime you can just delete this line

delc82

I needed to add "ALLOW-FROM uri" to the code instead of deleting the line mentioned but thank so much! Awesome software by the way!

psychobunny

Thanks ! Maybe we should update that issue to be able to set the "ALLOW-FROM" uri instead

delc82

Yes! that sounds logical!! Cool!

mwilliams77

I'm still having a problem getting this to load in an iframe. I have an app running on localhost:80 that I need to embed my NodeBB into.

psychobunny

In the meantime you can just delete this line

I'm assuming you tried the new setting in the ACP, but have you tried the original solution, did it work?

fewersource

@mwilliams77 said in How can I load NodeBB in an iframe?:

I'm still having a problem getting this to load in an iframe. I have an app running on localhost:80 that I need to embed my NodeBB into.

Yes! The iframe still doesn't load properly for me. I need to include my NodeBB into an application that is already running on localhost:80.

phenomlab

@fewersource said in How can I load NodeBB in an iframe?:

Yes! The iframe still doesn't load properly for me. I need to include my NodeBB into an application that is already running on localhost:80.

If you are hosting NodeBB on port 80, then this will probably work. However, if you are using https on port 443, which in today's climate, you should be, then it won't as you can't embed https inside http using an iFrame. In addition, using iFrames will subject the site to clickjacking vulnerabilities and is not recommended.

GamerGirlandCo

if you're trying to embed nodebb on another site (i.e., the nodebb instance domain ISN'T your website's domain), you'll have to contend with CSP headers. just a heads up.

if you have full control of the server on which your nodebb instance is hosted, you could set up a simple reverse proxy with nginx, point it to whatever port nodebb is listening on, and set the headers to something lax that way. config below.

server {
	listen localhost:4000 ssl;
	server_name localhost;
	ssl_certificate /etc/nginx/ssl/localhost.crt;
        ssl_certificate_key /etc/nginx/ssl/localhost.key;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;


    ssl_ciphers 'AES128+EECDH:AES128+EDH';

    ssl_prefer_server_ciphers on;

    location /forum {
        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_set_header Host $http_host;
        proxy_set_header X-NginX-Proxy true;
	client_max_body_size 100M;
        proxy_pass http://127.0.0.1:4567;
        proxy_redirect off;
        proxy_intercept_errors on;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_hide_header content-security-policy;
        proxy_hide_header x-frame-options;
        add_header content-security-policy "default-src * 'unsafe-eval' 'unsafe-inline' 'self' 'inline' 'http://*.*'";
	}
}

you can append whatever domains you'd like to the 3rd to last line (the one that starts with add_header ...), though you shouldn't need to, since the * should whitelist all origins.

you might ask, “what legitimate use would there be for this?!?”
in my particular case, it's nice for local development — where your nodebb instance is already running elsewhere but you want to embed it in the site you're developing on your PC.