您的位置:首页 > 其它

如何将Gate One嵌入我们的Web应用中

2015-10-16 01:16 1211 查看
参考文档http://liftoff.github.io/GateOne/Developer/embedding.html

https://github.com/liftoff/GateOne下载的Gate One源代码中,在gateone/tests/hello_embedded中有关于如何将Gate One嵌入我们应用的指导说明。本篇随笔就是根据该指导进行处理,然后写的笔记。

如果还没有安装Gate One,可以先参考我之前的随笔“LinuxMint系统下Gate One的安装指南”进行安装。

1. 基本嵌入方式

首先先使用一个div来存放我们的Gateone,如下所示,

<div id="gateone_container" style="position: relative; width: 60em; height: 30em;">
<div id="gateone"></div>
</div>


然后我们将Gate One源码中的gateone.js拷贝到我们web应用中,然后在我们的html中引入进来。或者直接使用使用Gate One服务上的gateone.js,如下所示,

<script src="https://127.0.0.1/static/gateone.js"></script>


最后调用GateOne.init()将我们Gate One嵌入我们的Web应用。

一个简单的示例代码和效果图如下所示,

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Basic Embedding Gate One</title>
<script src="../static/gateone.js"></script>
<script>
window.onload = function() {
// Initialize Gate One:
GateOne.init({url: 'https://127.0.0.1'});
}
</script>
</head>
<body>
<div>Hello lienhua34</div>
<!-- Decide where you want to put Gate One -->
<div id="gateone_container" style="position: relative; width: 60em; height: 30em;"> <div id="gateone"></div> </div>
</body>
</html>


var newTerminal = function() {
// Introducing the superSandbox()!  Use it to wrap any code that you don't want to load until dependencies are met.
// In this example we won't call newTerminal() until GateOne.Terminal and GateOne.Terminal.Input are loaded.
GateOne.Base.superSandbox("NewExternalTerm", ["GateOne.Terminal", "GateOne.Terminal.Input"], function(window, undefined) {
"use strict";
var existingContainer = GateOne.Utils.getNode('#'+GateOne.prefs.prefix+'container');
var container = GateOne.Utils.createElement('div', {
'id': 'container', 'class': 'terminal', 'style': {'height': '100%', 'width': '100%'}
});
var gateone = GateOne.Utils.getNode('#gateone');
// Don't actually submit the form
if (!existingContainer) {
gateone.appendChild(container);
} else {
container = existingContainer;
}
// Create the new terminal
termNum = GateOne.Terminal.newTerminal(null, null, container);
});
};

// Uses newExternalTerminal as GateOne.init()'s callback.
// The callback will be called after Gate One is initialized.
window.onload = function() {
// Initialize Gate One:
GateOne.init({
url: 'https://127.0.0.1',
embedded: true,
}, newTerminal);
};


callbackInit.js
在创建新Terminal的方法newTerminal中使用到了GateOne.Base.superSandbox()。该方法用于包装任何代码,而该代码会一直等待到其所有依赖被加载完毕才会执行。上面代码创建新Terminal的实际代码会等待GateOne.Terminal和GateOne.Terminal.Input加载完毕才会执行。

(done)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: