웹 SSH 프로젝트 의 예제 코드 를 순수 자바 로 구현 합 니 다.
github 프로젝트 오픈 소스 주소:https://github.com/NoCortY/WebSSH
기술 선택
웹 쉬 는 실시 간 데이터 상호작용 이 필요 하기 때문에 긴 연결 의 웹 소켓 을 사용 합 니 다.개발 의 편 의 를 위해 프레임 워 크 는 SpringBoot 를 사용 합 니 다.또한 자바 사용자 가 ssh 를 연결 하 는 jsch 와 전단 셸 페이지 를 실현 하 는 xterm.js 도 알 고 있 습 니 다.
그래서 최종 기술 선택 은 SpringBoot+Websocket+jsch+xterm.js 입 니 다.
가 져 오기 의존
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.7.RELEASE</version>
<relativePath /> <!-- lookup parent from repository -->
</parent>
<dependencies>
<!-- Web -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- jsch -->
<dependency>
<groupId>com.jcraft</groupId>
<artifactId>jsch</artifactId>
<version>0.1.54</version>
</dependency>
<!-- WebSocket -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
<!-- -->
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>1.4</version>
</dependency>
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
</dependencies>
간단 한 xterm 사례xterm 은 인기 없 는 기술 이기 때문에 많은 학생 들 이 이 분야 의 지식 을 지탱 하지 못 합 니 다.저도 이 기능 을 실현 하기 위해 임시로 배 웠 습 니 다.그래서 여기 서 소개 해 드 리 겠 습 니 다.
xterm.js 는 웹 소켓 을 기반 으로 한 용기 로 전단 에서 명령 행 을 실현 하 는 데 도움 을 줄 수 있 습 니 다.우리 가 평소에 SecureCRT 나 XShell 로 서버 를 연결 할 때 처럼.
다음은 홈 페이지 의 입문 사례 입 니 다.
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="node_modules/xterm/css/xterm.css" rel="external nofollow" />
<script src="node_modules/xterm/lib/xterm.js"></script>
</head>
<body>
<div id="terminal"></div>
<script>
var term = new Terminal();
term.open(document.getElementById('terminal'));
term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
</script>
</body>
</html>
최종 테스트,페이지 는 아래 와 같 습 니 다:페이지 에 셸 과 유사 한 스타일 이 나 타 났 음 을 볼 수 있 습 니 다.이것 에 따라 웹 쉬 를 계속 진행 하 십시오.
백 엔 드 구현
xterm 은 전단 의 스타일 만 실현 하면 서버 와 의 상호작용 을 진정 으로 실현 할 수 없 기 때문에 서버 와 의 상호작용 은 주로 우리 자바 백 엔 드 에 의 해 제어 되 기 때문에 우 리 는 백 엔 드 부터 jsch+websocket 을 사용 하여 이 부분 을 실현 합 니 다.
WebSocket 설정
메 시 지 를 실시 간 으로 전단 으로 보 내 려 면 웹 소켓 을 사용 해 야 하기 때문에 웹 소켓 을 모 르 는 학생 들 은 먼저 스스로 알 아 볼 수 있 습 니 다.여 기 는 더 많은 소개 에 불과 합 니 다.우 리 는 웹 소켓 의 설정 을 직접 시작 합 니 다.
/**
* @Description: websocket
* @Author: NoCortY
* @Date: 2020/3/8
*/
@Configuration
@EnableWebSocket
public class WebSSHWebSocketConfig implements WebSocketConfigurer{
@Autowired
WebSSHWebSocketHandler webSSHWebSocketHandler;
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry webSocketHandlerRegistry) {
//socket
// ,
webSocketHandlerRegistry.addHandler(webSSHWebSocketHandler, "/webssh")
.addInterceptors(new WebSocketInterceptor())
.setAllowedOrigins("*");
}
}
프로세서(Handler)와 차단기(Interceptor)의 실현방금 우 리 는 웹 소켓 의 설정 을 완 료 했 고 프로세서 와 차단 기 를 지정 했다.그래서 다음은 프로세서 와 차단기 의 실현 이다.
차단기:
public class WebSocketInterceptor implements HandshakeInterceptor {
/**
* @Description: Handler
* @Param: [serverHttpRequest, serverHttpResponse, webSocketHandler, map]
* @return: boolean
* @Author: NoCortY
* @Date: 2020/3/1
*/
@Override
public boolean beforeHandshake(ServerHttpRequest serverHttpRequest, ServerHttpResponse serverHttpResponse, WebSocketHandler webSocketHandler, Map<String, Object> map) throws Exception {
if (serverHttpRequest instanceof ServletServerHttpRequest) {
ServletServerHttpRequest request = (ServletServerHttpRequest) serverHttpRequest;
// UUID, , , UUID
// ,
String uuid = UUID.randomUUID().toString().replace("-","");
// uuid websocketsession
map.put(ConstantPool.USER_UUID_KEY, uuid);
return true;
} else {
return false;
}
}
@Override
public void afterHandshake(ServerHttpRequest serverHttpRequest, ServerHttpResponse serverHttpResponse, WebSocketHandler webSocketHandler, Exception e) {
}
}
프로세서:
/**
* @Description: WebSSH WebSocket
* @Author: NoCortY
* @Date: 2020/3/8
*/
@Component
public class WebSSHWebSocketHandler implements WebSocketHandler{
@Autowired
private WebSSHService webSSHService;
private Logger logger = LoggerFactory.getLogger(WebSSHWebSocketHandler.class);
/**
* @Description: WebSocket
* @Param: [webSocketSession]
* @return: void
* @Author: Object
* @Date: 2020/3/8
*/
@Override
public void afterConnectionEstablished(WebSocketSession webSocketSession) throws Exception {
logger.info(" :{}, WebSSH", webSocketSession.getAttributes().get(ConstantPool.USER_UUID_KEY));
//
webSSHService.initConnection(webSocketSession);
}
/**
* @Description:
* @Param: [webSocketSession, webSocketMessage]
* @return: void
* @Author: NoCortY
* @Date: 2020/3/8
*/
@Override
public void handleMessage(WebSocketSession webSocketSession, WebSocketMessage<?> webSocketMessage) throws Exception {
if (webSocketMessage instanceof TextMessage) {
logger.info(" :{}, :{}", webSocketSession.getAttributes().get(ConstantPool.USER_UUID_KEY), webSocketMessage.toString());
// service
webSSHService.recvHandle(((TextMessage) webSocketMessage).getPayload(), webSocketSession);
} else if (webSocketMessage instanceof BinaryMessage) {
} else if (webSocketMessage instanceof PongMessage) {
} else {
System.out.println("Unexpected WebSocket message type: " + webSocketMessage);
}
}
/**
* @Description:
* @Param: [webSocketSession, throwable]
* @return: void
* @Author: Object
* @Date: 2020/3/8
*/
@Override
public void handleTransportError(WebSocketSession webSocketSession, Throwable throwable) throws Exception {
logger.error(" ");
}
/**
* @Description:
* @Param: [webSocketSession, closeStatus]
* @return: void
* @Author: NoCortY
* @Date: 2020/3/8
*/
@Override
public void afterConnectionClosed(WebSocketSession webSocketSession, CloseStatus closeStatus) throws Exception {
logger.info(" :{} webssh ", String.valueOf(webSocketSession.getAttributes().get(ConstantPool.USER_UUID_KEY)));
// service
webSSHService.close(webSocketSession);
}
@Override
public boolean supportsPartialMessages() {
return false;
}
}
주의해 야 할 것 은 제 가 차단기 에 가입 한 사용자 표 지 는 무 작위 UUID 를 사 용 했 습 니 다.이것 은 독립 된 websocket 프로젝트 로 서 사용자 모듈 이 없 기 때 문 입 니 다.이 프로젝트 를 자신의 프로젝트 에 통합 하려 면 이 코드 를 수정 하고 자신의 프로젝트 에서 사용자 가 사용 하 는 사용자 표 지 를 식별 하 는 것 으로 바 꿔 야 합 니 다.WebSSH 의 업무 논리 실현(핵심)
방금 우 리 는 웹 소켓 의 설정 을 실 현 했 습 니 다.모두 죽은 코드 입 니 다.인 터 페 이 스 를 실현 한 다음 에 자신의 수요 에 따라 실현 할 수 있 습 니 다.지금 우 리 는 백 엔 드 의 주요 업무 논 리 를 실현 할 것 입 니 다.이 논 리 를 실현 하기 전에 우 리 는 먼저 웹 SSH 를 생각해 보 겠 습 니 다.우 리 는 주로 어떤 효 과 를 나타 내 고 싶 습 니까?
나 는 여기 서 총 결 을 하나 했다.
1.우선 터미널 에 연결 해 야 합 니 다(연결 초기 화)
2.그 다음 에 저희 서버 는 전단 에서 온 메 시 지 를 처리 해 야 합 니 다(전단 메 시 지 를 수신 하고 처리 합 니 다)
3.터미널 에서 되 돌아 오 는 메 시 지 를 전단 에 다시 써 야 합 니 다(데이터 재 작성 전단)
4.연결 닫 기
이 네 가지 수요 에 따라 우 리 는 먼저 인 터 페 이 스 를 정의 하면 수 요 를 명확 하 게 할 수 있다.
/**
* @Description: WebSSH
* @Author: NoCortY
* @Date: 2020/3/7
*/
public interface WebSSHService {
/**
* @Description: ssh
* @Param:
* @return:
* @Author: NoCortY
* @Date: 2020/3/7
*/
public void initConnection(WebSocketSession session);
/**
* @Description:
* @Param:
* @return:
* @Author: NoCortY
* @Date: 2020/3/7
*/
public void recvHandle(String buffer, WebSocketSession session);
/**
* @Description: for websocket
* @Param:
* @return:
* @Author: NoCortY
* @Date: 2020/3/7
*/
public void sendMessage(WebSocketSession session, byte[] buffer) throws IOException;
/**
* @Description:
* @Param:
* @return:
* @Author: NoCortY
* @Date: 2020/3/7
*/
public void close(WebSocketSession session);
}
이제 우 리 는 이 인터페이스 에 근거 하여 우리 가 정의 한 기능 을 실현 할 수 있다.연결 초기 화
우리 의 밑바닥 은 jsch 에 의존 하여 이 루어 지기 때문에 여 기 는 jsch 를 사용 하여 연결 을 구축 해 야 한다.연결 을 초기 화 하 는 것 은 사실상 우리 가 필요 로 하 는 연결 정 보 를 하나의 맵 에 저장 하 는 것 이다.여 기 는 어떠한 실제 연결 작업 도 하지 않 는 다.왜 여 기 는 직접 연결 하지 않 습 니까?이 전단 은 웹 소켓 에 만 연결 되 어 있 기 때 문 입 니 다.그러나 우 리 는 전단 에서 Liux 터미널 의 사용자 이름과 비밀 번 호 를 보 내야 합 니 다.이런 정보 가 없 으 면 연결 할 수 없습니다.
public void initConnection(WebSocketSession session) {
JSch jSch = new JSch();
SSHConnectInfo sshConnectInfo = new SSHConnectInfo();
sshConnectInfo.setjSch(jSch);
sshConnectInfo.setWebSocketSession(session);
String uuid = String.valueOf(session.getAttributes().get(ConstantPool.USER_UUID_KEY));
// ssh map
sshMap.put(uuid, sshConnectInfo);
}
클 라 이언 트 가 보 낸 데이터 처리이 단계 에서 우 리 는 두 갈래 로 나 눌 것 이다.
첫 번 째 지점:클 라 이언 트 가 터미널 의 사용자 이름과 비밀번호 등 정 보 를 보 내 면 터미널 연결 을 합 니 다.
두 번 째 지점:클 라 이언 트 가 터미널 을 조작 하 라 는 명령 을 보 내 면 터미널 로 직접 전송 하고 터미널 의 실행 결 과 를 가 져 옵 니 다.
구체 적 인 코드 구현:
public void recvHandle(String buffer, WebSocketSession session) {
ObjectMapper objectMapper = new ObjectMapper();
WebSSHData webSSHData = null;
try {
// JSON
webSSHData = objectMapper.readValue(buffer, WebSSHData.class);
} catch (IOException e) {
logger.error("Json ");
logger.error(" :{}", e.getMessage());
return;
}
// uuid
String userId = String.valueOf(session.getAttributes().get(ConstantPool.USER_UUID_KEY));
if (ConstantPool.WEBSSH_OPERATE_CONNECT.equals(webSSHData.getOperate())) {
//
// ssh
SSHConnectInfo sshConnectInfo = (SSHConnectInfo) sshMap.get(userId);
//
WebSSHData finalWebSSHData = webSSHData;
executorService.execute(new Runnable() {
@Override
public void run() {
try {
//
connectToSSH(sshConnectInfo, finalWebSSHData, session);
} catch (JSchException | IOException e) {
logger.error("webssh ");
logger.error(" :{}", e.getMessage());
close(session);
}
}
});
} else if (ConstantPool.WEBSSH_OPERATE_COMMAND.equals(webSSHData.getOperate())) {
//
String command = webSSHData.getCommand();
SSHConnectInfo sshConnectInfo = (SSHConnectInfo) sshMap.get(userId);
if (sshConnectInfo != null) {
try {
//
transToSSH(sshConnectInfo.getChannel(), command);
} catch (IOException e) {
logger.error("webssh ");
logger.error(" :{}", e.getMessage());
close(session);
}
}
} else {
logger.error(" ");
close(session);
}
}
데 이 터 는 웹 소켓 을 통 해 전단 으로 보 냅 니 다.
public void sendMessage(WebSocketSession session, byte[] buffer) throws IOException {
session.sendMessage(new TextMessage(buffer));
}
연결 닫 기
public void close(WebSocketSession session) {
// uuid
String userId = String.valueOf(session.getAttributes().get(ConstantPool.USER_UUID_KEY));
SSHConnectInfo sshConnectInfo = (SSHConnectInfo) sshMap.get(userId);
if (sshConnectInfo != null) {
//
if (sshConnectInfo.getChannel() != null) sshConnectInfo.getChannel().disconnect();
//map ssh
sshMap.remove(userId);
}
}
이로써 우리 의 전체 백 엔 드 실현 은 끝났다.편폭 이 제한 되 어 있 기 때문에 여기 서 일부 조작 을 방법 으로 포장 하면 너무 많이 보 여주 지 않 고 논리 적 실현 의 방향 에 중심 을 두 자.앞으로 우 리 는 전단 의 실현 을 진행 할 것 이다.전단 실현
전단 작업 은 주로 이렇게 몇 가지 절차 로 나 뉜 다.
페이지 구현
페이지 의 실현 은 매우 간단 합 니 다.우 리 는 전체 화면 에 터미널 의 큰 검 은 화면 을 표시 해 야 하기 때문에 우 리 는 어떤 스타일 을 쓰 지 않 고 div 를 만 든 다음 에 terminal 인 스 턴 스 를 xterm 을 통 해 이 div 에 넣 으 면 이 루어 집 니 다.
<!doctype html>
<html>
<head>
<title>WebSSH</title>
<link rel="stylesheet" href="../css/xterm.css" rel="external nofollow" />
</head>
<body>
<div id="terminal" style="width: 100%;height: 100%"></div>
<script src="../lib/jquery-3.4.1/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>
<script src="../js/base64.js" charset="utf-8"></script>
</body>
</html>
웹 소켓 을 연결 하고 데이터 전송,수신,재 작성 을 완료 합 니 다.
openTerminal( {
// , , , 。
operate:'connect',
host: 'ip ',
port: ' ',
username: ' ',
password: ' '
});
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
');
},
onConnect: function () {
//
client.sendInitData(options);
},
onClose: function () {
//
term.write("\rconnection closed");
},
onData: function (data) {
//
term.write(data);
}
});
}
효과 전시잇닿다
연결 성공
명령 조작
ls 명령:
vim 편집기:
top 명령:
결어
이렇게 해서 우 리 는 웹 sh 프로젝트 의 실현 을 완 성 했 습 니 다.다른 어떠한 구성 요소 에 도 의존 하지 않 고 백 엔 드 는 자바 로 이 루어 졌 습 니 다.SpringBoot 를 사용 하여 쉽게 배치 할 수 있 습 니 다.
그러나 우 리 는 이 항목 을 확장 할 수 있 습 니 다.예 를 들 어 새로 업로드 하거나 파일 을 다운로드 할 수 있 습 니 다.예 를 들 어 Xftp 처럼 다운로드 파일 을 편리 하 게 드래그 해서 업로드 할 수 있 습 니 다.
이 프로젝트 이후 에 저 는 계속 업 데 이 트 를 할 것 입 니 다.상기 기능 도 천천히 실 현 될 것 입 니 다.Github:https://github.com/NoCortY/WebSSH
순수 자바 로 웹 SSH 프로젝트 를 실현 하 는 것 에 관 한 이 글 은 여기까지 소개 되 었 습 니 다.더 많은 자바 가 웹 SSH 프로젝트 를 실현 하 는 내용 은 우리 의 이전 글 을 검색 하거나 아래 의 관련 글 을 계속 조회 하 시기 바 랍 니 다.앞으로 많은 응원 바 랍 니 다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
JPA + QueryDSL 계층형 댓글, 대댓글 구현(2)이번엔 전편에 이어서 계층형 댓글, 대댓글을 다시 리팩토링해볼 예정이다. 이전 게시글에서는 계층형 댓글, 대댓글을 구현은 되었지만 N+1 문제가 있었다. 이번에는 그 N+1 문제를 해결해 볼 것이다. 위의 로직은 이...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.