NoCortY / WebSSH

纯Java实现的WebSSH
899 stars 387 forks source link

host,prot,user,pwd在js里写死的,怎么和后端交互 #25

Open IhaveaFerrari opened 2 years ago

IhaveaFerrari commented 2 years ago

前端点了按钮,访问websshpage接口,直接跳转到webssh页面,但是这些参数怎么传到js里?

TheBlindM commented 1 year ago

websocket

luoyh commented 12 months ago

前端点了按钮,访问websshpage接口,直接跳转到webssh页面,但是这些参数怎么传到js里?

修改webssh.html


<!doctype html>
<html>
<head>
    <title>WebSSH</title>
    <link rel="stylesheet" href="../css/xterm.css" />
</head>
<body>
<div id="terminal" style="width: 100%;height: 100%"></div>

<script src="../js/jquery-3.4.1.min.js"></script>
<script src="../js/xterm.js" charset="utf-8"></script>
<script src="../js/webssh.js" charset="utf-8"></script>
<div id="man">

<input id="host"  />
<input id="port"  />
<input id="user"  />
<input id="pass" type="password"  />
<input id="connected" type="button" value="CONNECTED"  />
</div>
<script>
    $(() => {
        $('#connected').click(() => {
            let ops = {
            operate:'connect',
            host: $('#host').val(),//IP
            port: $('#port').val(),//端口号
            username: $('#user').val(),//用户名
            password: $('#pass').val()//密码*/
            };
            $('#man').remove();
            console.log(ops);
            openTerminal( ops);

        });
    });
        function openTerminal(options){
            var client = new WSSHClient();
            var term = new Terminal({
                cols: 97,
                rows: 37,
                cursorBlink: true, // 光标闪烁
                cursorStyle: "block", // 光标样式  null | 'block' | 'underline' | 'bar'
                scrollback: 800, //回滚
                tabStopWidth: 8, //制表宽度
                screenKeys: true
            });

            term.on('data', function (data) {
                //键盘输入时的回调函数
                client.sendClientData(data);
            });
            term.open(document.getElementById('terminal'));
            //在页面上显示连接中...
            term.write('Connecting...');
            //执行连接操作
            client.connect({
                onError: function (error) {
                    //连接失败回调
                    term.write('Error: ' + error + '\r\n');
                },
                onConnect: function () {
                    //连接成功回调
                    client.sendInitData(options);
                },
                onClose: function () {
                    //连接关闭回调
                    term.write("\rconnection closed");
                },
                onData: function (data) {
                    //收到数据时回调
                    term.write(data);
                }
            });
        }
</script>
</body>
</html>