增加了使用golang ssh库接入访问SSH类型资产的选项 close #58

This commit is contained in:
dushixiang 2021-02-14 03:47:20 +08:00
parent 5b7cebb602
commit 0539ce351d
6 changed files with 136 additions and 62 deletions

View File

@ -76,6 +76,7 @@ func SetupRoutes() *echo.Echo {
assets.PUT("/:id", AssetUpdateEndpoint) assets.PUT("/:id", AssetUpdateEndpoint)
assets.DELETE("/:id", AssetDeleteEndpoint) assets.DELETE("/:id", AssetDeleteEndpoint)
assets.GET("/:id", AssetGetEndpoint) assets.GET("/:id", AssetGetEndpoint)
assets.GET("/:id/attributes", AssetGetAttributeEndpoint)
assets.POST("/:id/change-owner", Admin(AssetChangeOwnerEndpoint)) assets.POST("/:id/change-owner", Admin(AssetChangeOwnerEndpoint))
} }

View File

@ -20,7 +20,7 @@ func (r *AssetAttribute) TableName() string {
return "asset_attributes" return "asset_attributes"
} }
var SSHParameterNames = []string{guacd.FontName, guacd.FontSize, guacd.ColorScheme, guacd.Backspace, guacd.TerminalType} var SSHParameterNames = []string{guacd.FontName, guacd.FontSize, guacd.ColorScheme, guacd.Backspace, guacd.TerminalType, SshMode}
var RDPParameterNames = []string{guacd.EnableWallpaper, guacd.EnableTheming, guacd.EnableFontSmoothing, guacd.EnableFullWindowDrag, guacd.EnableDesktopComposition, guacd.EnableMenuAnimations, guacd.DisableBitmapCaching, guacd.DisableOffscreenCaching, guacd.DisableGlyphCaching} var RDPParameterNames = []string{guacd.EnableWallpaper, guacd.EnableTheming, guacd.EnableFontSmoothing, guacd.EnableFullWindowDrag, guacd.EnableDesktopComposition, guacd.EnableMenuAnimations, guacd.DisableBitmapCaching, guacd.DisableOffscreenCaching, guacd.DisableGlyphCaching}
var VNCParameterNames = []string{guacd.ColorDepth, guacd.Cursor, guacd.SwapRedBlue, guacd.DestHost, guacd.DestPort} var VNCParameterNames = []string{guacd.ColorDepth, guacd.Cursor, guacd.SwapRedBlue, guacd.DestHost, guacd.DestPort}
var TelnetParameterNames = []string{guacd.FontName, guacd.FontSize, guacd.ColorScheme, guacd.Backspace, guacd.TerminalType, guacd.UsernameRegex, guacd.PasswordRegex, guacd.LoginSuccessRegex, guacd.LoginFailureRegex} var TelnetParameterNames = []string{guacd.FontName, guacd.FontSize, guacd.ColorScheme, guacd.Backspace, guacd.TerminalType, guacd.UsernameRegex, guacd.PasswordRegex, guacd.LoginSuccessRegex, guacd.LoginFailureRegex}

View File

@ -5,6 +5,10 @@ import (
"next-terminal/pkg/guacd" "next-terminal/pkg/guacd"
) )
const (
SshMode = "ssh-mode"
)
type Property struct { type Property struct {
Name string `gorm:"primary_key" json:"name"` Name string `gorm:"primary_key" json:"name"`
Value string `json:"value"` Value string `json:"value"`

View File

@ -7,7 +7,10 @@ import {getToken, isEmpty} from "../../utils/utils";
import {FitAddon} from 'xterm-addon-fit'; import {FitAddon} from 'xterm-addon-fit';
import "./Access.css" import "./Access.css"
import request from "../../common/request"; import request from "../../common/request";
import {message} from "antd"; import {Affix, Button, Col, Drawer, message, Row} from "antd";
import {AppstoreTwoTone} from "@ant-design/icons";
import Draggable from "react-draggable";
import FileSystem from "./FileSystem";
class Term extends Component { class Term extends Component {
@ -16,7 +19,8 @@ class Term extends Component {
height: window.innerHeight, height: window.innerHeight,
term: undefined, term: undefined,
webSocket: undefined, webSocket: undefined,
fitAddon: undefined fitAddon: undefined,
sessionId: undefined
}; };
componentDidMount = async () => { componentDidMount = async () => {
@ -123,7 +127,8 @@ class Term extends Component {
this.setState({ this.setState({
term: term, term: term,
webSocket: webSocket, webSocket: webSocket,
fitAddon: fitAddon fitAddon: fitAddon,
sessionId: sessionId
}); });
window.addEventListener('resize', this.onWindowResize); window.addEventListener('resize', this.onWindowResize);
@ -190,6 +195,39 @@ class Term extends Component {
overflowX: 'hidden', overflowX: 'hidden',
overflowY: 'hidden', overflowY: 'hidden',
}}/> }}/>
<Draggable>
<Affix style={{position: 'absolute', top: 50, right: 50, zIndex: 9999}}>
<Button icon={<AppstoreTwoTone/>} onClick={() => {
this.setState({
fileSystemVisible: true,
});
}}/>
</Affix>
</Draggable>
<Drawer
style={{zIndex: 10000}}
title={'会话详情'}
placement="right"
width={window.innerWidth * 0.8}
closable={true}
// maskClosable={false}
onClose={() => {
this.setState({
fileSystemVisible: false
});
}}
visible={this.state.fileSystemVisible}
>
<Row style={{marginTop: 10}}>
<Col span={24}>
<FileSystem sessionId={this.state.sessionId}/>
</Col>
</Row>
</Drawer>
</div> </div>
); );
} }

View File

@ -328,12 +328,16 @@ class Asset extends Component {
if (result.code === 1) { if (result.code === 1) {
if (result.data === true) { if (result.data === true) {
message.success({content: '检测完成,您访问的资产在线,即将打开窗口进行访问。', key: id, duration: 3}); message.success({content: '检测完成,您访问的资产在线,即将打开窗口进行访问。', key: id, duration: 3});
window.open(`#/access?assetId=${id}&assetName=${name}&protocol=${protocol}`); if (protocol === 'ssh') {
// if (protocol === 'ssh') { result = await request.get(`/assets/${id}/attributes`);
// window.open(`#/term?assetId=${id}&assetName=${name}`); if (result.code === 1 && result['data']['ssh-mode'] === 'naive') {
// } else { window.open(`#/term?assetId=${id}&assetName=${name}`);
// window.open(`#/access?assetId=${id}&assetName=${name}&protocol=${protocol}`); } else {
// } window.open(`#/access?assetId=${id}&assetName=${name}&protocol=${protocol}`);
}
} else {
window.open(`#/access?assetId=${id}&assetName=${name}&protocol=${protocol}`);
}
} else { } else {
message.warn('您访问的资产未在线,请确认网络状态。', 10); message.warn('您访问的资产未在线,请确认网络状态。', 10);
} }

View File

@ -1,6 +1,7 @@
import React, {useState} from 'react'; import React, {useState} from 'react';
import {Col, Collapse, Form, Input, InputNumber, Modal, Radio, Row, Select, Tooltip, Typography} from "antd/lib/index"; import {Col, Collapse, Form, Input, InputNumber, Modal, Radio, Row, Select, Tooltip, Typography} from "antd/lib/index";
import {ExclamationCircleOutlined} from "@ant-design/icons"; import {ExclamationCircleOutlined} from "@ant-design/icons";
import {isEmpty} from "../../utils/utils";
const {TextArea} = Input; const {TextArea} = Input;
const {Option} = Select; const {Option} = Select;
@ -41,6 +42,8 @@ const AssetModal = function ({title, visible, handleOk, handleCancel, confirmLoa
let [accountType, setAccountType] = useState(model.accountType); let [accountType, setAccountType] = useState(model.accountType);
let [protocol, setProtocol] = useState(model.protocol); let [protocol, setProtocol] = useState(model.protocol);
let [sshMode, setSshMode] = useState(model['ssh-mode']);
console.log(sshMode)
let initAccountTypes = [] let initAccountTypes = []
if (model.protocol) { if (model.protocol) {
@ -233,7 +236,7 @@ const AssetModal = function ({title, visible, handleOk, handleCancel, confirmLoa
</Form.Item> </Form.Item>
</Col> </Col>
<Col span={12}> <Col span={12}>
<Collapse defaultActiveKey={['remote-app', '认证', '显示设置', '控制终端行为', 'VNC中继']} ghost> <Collapse defaultActiveKey={['remote-app', '认证', '显示设置', '控制终端行为', 'VNC中继', '模式设置']} ghost>
{ {
protocol === 'rdp' ? protocol === 'rdp' ?
<> <>
@ -275,64 +278,88 @@ Windows需要对远程应用程序的名称使用特殊的符号。
{ {
protocol === 'ssh' ? protocol === 'ssh' ?
<> <>
<Panel header={<Text strong>显示设置</Text>} key=""> <Panel header={<Text strong>模式设置</Text>} key="">
<Form.Item <Form.Item
name="color-scheme" name="ssh-mode"
label="配色方案" label={<Tooltip
title="guacd对部分SSH密钥支持不完善当密钥类型为ED25519时请选择原生模式。">连接模式&nbsp;
<ExclamationCircleOutlined/></Tooltip>}
initialValue="" initialValue=""
> >
<Select onChange={null}> <Select onChange={(value) => {
setSshMode(value)
}}>
<Option value="">默认</Option> <Option value="">默认</Option>
<Option value="gray-black">黑底灰字</Option> <Option value="guacd">guacd</Option>
<Option value="green-black">黑底绿字</Option> <Option value="naive">原生</Option>
<Option value="white-black">黑底白字</Option>
<Option value="black-white">白底黑字</Option>
</Select>
</Form.Item>
<Form.Item
name="font-name"
label="字体名称"
>
<Input type='text' placeholder="为空时使用系统默认字体"/>
</Form.Item>
<Form.Item
name="font-size"
label="字体大小"
>
<Input type='number' placeholder="为空时使用系统默认字体大小" min={8} max={96}/>
</Form.Item>
</Panel>
<Panel header={<Text strong>控制终端行为</Text>} key="">
<Form.Item
name="backspace"
label="退格键映射"
initialValue=""
>
<Select onChange={null}>
<Option value="">默认</Option>
<Option value="127">删除键(Ctrl-?)</Option>
<Option value="8">退格键(Ctrl-H)</Option>
</Select>
</Form.Item>
<Form.Item
name="terminal-type"
label="终端类型"
initialValue=""
>
<Select onChange={null}>
<Option value="">默认</Option>
<Option value="ansi">ansi</Option>
<Option value="linux">linux</Option>
<Option value="vt100">vt100</Option>
<Option value="vt220">vt220</Option>
<Option value="xterm">xterm</Option>
<Option value="xterm-256color">xterm-256color</Option>
</Select> </Select>
</Form.Item> </Form.Item>
</Panel> </Panel>
{
isEmpty(sshMode) || sshMode === 'guacd' ?
<>
<Panel header={<Text strong>显示设置</Text>} key="">
<Form.Item
name="color-scheme"
label="配色方案"
initialValue=""
>
<Select onChange={null}>
<Option value="">默认</Option>
<Option value="gray-black">黑底灰字</Option>
<Option value="green-black">黑底绿字</Option>
<Option value="white-black">黑底白字</Option>
<Option value="black-white">白底黑字</Option>
</Select>
</Form.Item>
<Form.Item
name="font-name"
label="字体名称"
>
<Input type='text' placeholder="为空时使用系统默认字体"/>
</Form.Item>
<Form.Item
name="font-size"
label="字体大小"
>
<Input type='number' placeholder="为空时使用系统默认字体大小" min={8}
max={96}/>
</Form.Item>
</Panel>
<Panel header={<Text strong>控制终端行为</Text>} key="">
<Form.Item
name="backspace"
label="退格键映射"
initialValue=""
>
<Select onChange={null}>
<Option value="">默认</Option>
<Option value="127">删除键(Ctrl-?)</Option>
<Option value="8">退格键(Ctrl-H)</Option>
</Select>
</Form.Item>
<Form.Item
name="terminal-type"
label="终端类型"
initialValue=""
>
<Select onChange={null}>
<Option value="">默认</Option>
<Option value="ansi">ansi</Option>
<Option value="linux">linux</Option>
<Option value="vt100">vt100</Option>
<Option value="vt220">vt220</Option>
<Option value="xterm">xterm</Option>
<Option value="xterm-256color">xterm-256color</Option>
</Select>
</Form.Item>
</Panel>
</> : undefined
}
</> : undefined </> : undefined
} }