SimonBiggs / scriptedforms

Quickly create live-update GUIs for Python packages using Markdown and simple HTML elements.
Apache License 2.0
508 stars 34 forks source link

Pleases provide guidance on how to embed scriptedforms in iframe #300

Open MrPeterLee opened 5 years ago

MrPeterLee commented 5 years ago

Hi Team,

Many thanks for the work and I found scriptedforms particular useful in presenting outputs. I'd greatly appreciate any advices on how to embed the local instance of scriptedforms in a webpage so it could be presented to my colleagues.

I have been running into "Content Security Violation" error, although using the same setup I have no problems embedding a local Jupyter Notebook instance. The following is my configuration (so far NOT working), once again, grateful to any comments.

Flask app to embed the output of scriptedforms via iframe

Modified scriptedforms.py

    def start(self):
    ┆   load_jupyter_server_extension(self)
    ┆   # Add remote access
    ┆   # self.config_file = u"/home/d594400/.jupyter/jupyter_notebook_config.py"  # Doesn't work
    ┆   # self.port = 9999  # CANNOT change port
    ┆   # self.ip = u"10.0.2.15"  # IP must be localhost, CANNOT change IP
    ┆   self.allow_remote_access = True
    ┆   self.token = ""
    ┆   self.password = ""
    ┆   self.tornado_settings = {
    ┆   ┆   "headers": {
    ┆   ┆   ┆   "Content-Security-Policy": "frame-ancestors self http://localhost:8888 http://localhost:60010 http://127.0.0.1:8888 http://127.0.0.1:60010; report-uri /api/security/csp-report"
    ┆   } }
    ┆   super(ScriptedForms, self).start()

flask app

from flask import Flask
app = Flask(__name__)

@app.route('/')
def homepage():
    return """
    <h1>Hello world!</h1>
    <iframe id="nb-iframe" src="http://localhost:8888/scriptedforms/use/scripted.md" style="width:800px;height:600px;"></iframe> 
    <iframe id="nb-iframe" src="http://localhost:8888" style="width:800px;height:600px;"></iframe> 
    """
if __name__ == '__main__':
    app.run(host="0.0.0.0", port=60010, debug=True, use_reloader=True)

Then ran into error while visiting the local flask page:

[W 10:32:02.140 ScriptedForms] Content security violation:
{"csp-report":{"document-uri":"http://localhost:8888/scriptedforms/use/scripted.md?","referrer":","violated-directive":"frame-ancestors","effective-directive":"frame-ancestors","original-policy":"frame-ancestors
'self'; report-uri /api/security/csp-report","disposition":"enforce","blocked-uri":"http://localhost:8888/scriptedforms/use/scripted.md?","status-code":0,"script-sample":""}}

Thanks and regards,

Peter

SimonBiggs commented 5 years ago

Hi Peter,

Thanks for reaching out, and thanks for the interest in ScriptedForms.

ScriptedForms installs itself as a jupyter notebook server extension. This means that if you start a standard notebook server and travel to http://IPADDRESS/scriptedforms/use/scripted.md it will resolve to the form.

So if you want to use custom server configuration, just use the notebook server :).

Do be aware that anyone who can access that page can remotely execute any python code, command line code, as well as code from any other kernel you have installed.

I don't make the option to change off of local host on the default ScriptedForms server so that users have to have an understanding of the security implications before serving it.

In the future I would like to create a ScriptedForms + JupyterHub docker image which supports this sort of thing along with user login.

Cheers, Simon