.. _gateone-embedding1: How To Embed Gate One - Chapter 1 ================================= This part of the tutorial requires that you start your Gate One server using the following settings: .. code-block:: javascript { "*": { "gateone": { // These are what's important for the tutorial: "origins": ["*"], // Disable origin checks (insecure but OK for a tutorial) "port": 8000, // The examples all use this port "url_prefix": "/", "auth": "none" // Note: This can be overridden by 20authentication.conf if you put it in 10server.conf // These settings are just to avoid conflics with a regular Gate One installation: "cache_dir": "/tmp/gateone_tutorial_cache", "user_dir": "/var/lib/gateone/users", "session_dir": "/tmp/gateone_tutorial", "pid_file": "/tmp/gateone_tutorial.pid" } } } For convenience a `99tutorial_chapter1.conf <../../embedding_configs/99tutorial_chapter1.conf>`_ file has already been created with these settings. Just copy it into a temporary :option:`settings_dir` before starting Gate One: .. ansi-block:: :string_escape: # Assuming you downloaded Gate One to /tmp/GateOne... \x1b[1;34muser\x1b[0m@host\x1b[1;34m:/tmp/GateOne $\x1b[0m mkdir /tmp/chapter1 && cp gateone/docs/embedding_configs/99tutorial_chapter1.conf /tmp/chapter1/ \x1b[1;34muser\x1b[0m@host\x1b[1;34m:/tmp/GateOne $\x1b[0m ./run_gateone.py --settings_dir=/tmp/chapter1 Before we continue please test your Gate One server by loading it in your browser. This will also ensure that you've accepted the server's SSL certificate (if necessary). .. warning:: Gate One's SSL certificate must be trusted by clients in order to embed Gate One. In production you can configure Gate One to use the same SSL certificate as the website that has it embedded to avoid that problem. Just note, for that to work Gate One must be running at the same domain as the website that's embedding it. So if your website is https://myapp.company.com/ your Gate One server would need to be running on a different port at myapp.company.com (e.g. https://myapp.company.com:8000/). Placement --------- Gate One needs to be placed inside an element on the page in order to work properly. This element will be where Gate One places `` .. tip:: You can also load the script on-demand via JS (if you know how). It doesn't use the ``window.onload`` event or similar. Call GateOne.init() ------------------- The :js:func:`GateOne.init` function takes some (optional) arguments but for this example all we need is `url`. .. code-block:: javascript GateOne.init({url: "https://your-gateone-server/"}); Put that somewhere in your ``window.onload`` function and Gate One will automatically connect to the server, synchronize-and-load it's JavaScript/CSS, and open the New Workspace Workspace (aka the application selection screen). Complete Example ---------------- Here's an example of everything described above: .. code-block:: html
Try It ^^^^^^ .. raw:: html

Enter the URL for your Gate One server and click 'Go!'