本文章最初发表在XJHui’s Blog，未经允许，任何人禁止转载！

为使您获得最好的阅读体验，强烈建议您点击这里前往 XJHui’s Blog 查看！

因服务器临近到期，个人demo已停止访问

WebSSH工具

初衷

9.9买的一年服务器，不用实属可惜
由于是计算机专业实验课经常需要用到linux系统，苦于每次上实验都要被虚拟机各种问题困扰浪费时间
博客已经搭建好了，完全可以把弄好的WebSSH嵌进去（别想太复杂，其实就是给个入口）

SSH和WebSSH工具

因为在搭建博客的时候经常用到SSH，自己对它的理解就是它能实现“远程登陆”，刚看了百度其实这种想法不对。

SSH(Secure Shell是专为远程登录会话和其他网络服务提供安全性的协议。

我在用的SSH工具是Xshell（免费版本对我来说足以），通过Xshell输入用户名和密码就能远程登陆服务器。

通过上面的介绍，应该对WebSSH工具有了一点点的猜想。

WebSSH工具说白了就是把Xshell放到网页上，用户不需要安装，有个联网的浏览器就能控制服务器。

慎重考虑

本博客教程使用的WebSSH工具，虽是GitHub开源项目，但安全性较客户端（Xshell一类的）肯定是不够的，使用者请自行注意保护个人隐私安全。
搭建该WebSSH工具需要云服务器。
需要linux命令基础（会vim足够）。
文章随长但也是为了让小白也能掌握，有些不得不啰嗦几句。

本博客的任务清单已在最后列出，清单未完成前会持续更新…

WebSSH神器Sshwifty

项目简介：Web SSH & Telnet (WebSSH & WebTelnet client)

作者DEMO：https://sshwifty.herokuapp.com（可以点进去体验一下，注意保护个人隐私）

个人Sshwifty：https://webssh.xingjiahui.top (安全起见暂时不开放)

点击访问项目地址，感谢作者！

有能力可以直接去看官方文档（小白还是建议老老实实看我教程，能少走些坑）。

安装步骤

下载sshwifty
1
$ wget https://github.com/niruix/sshwifty/releases/download/0.2.2-beta-release-prebuild/sshwifty_0.2.2-beta-release_linux_amd64.tar.gz
注：如果下载速度慢，可以尝试本地下载后使用Xftp上传到服务器（速度飞快）

由于服务器都在国外（我其实也不清楚，速度慢就是在国外），所以这里提供两个不限速下载链接：
- sshwifty_0.2.2-beta-release_linux_amd64.tar.gz
- Xftp
感谢蓝奏云！

Xftp使用方式很简单：先登录服务器，后拖拽上传（下图）：

解压sshwifty

1	$ tar -xzvf sshwifty_0.2.2-beta-release_linux_amd64.tar.gz

复制可执行文件到指定目录并赋予执行权限

1 2	$ cp sshwifty_linux_amd64 /usr/local/bin/sshwifty $ chmod +x /usr/local/bin/sshwifty

生成默认配置文件：

1	$ cp sshwifty.conf.example.json /etc/sshwifty.conf.json

感谢：iMike

本地运行

启动 sshwifty，命令行输入：

1	$ sshwifty

运行结果：

从上图可以看出本地访问默认使用127.0.0.1:8182这个地址

可视化系统

可视化系统可以安装浏览器，安装后可直接输入上面的地址访问。

服务器端

因为我用的云服务器，肯定不能像可视化系统那样直接访问，这里介绍如何使用ssh工具（Xshell为例）在自己电脑上远程访问服务器的本地地址（听起来有点绕，但的确是这么个意思）。

感谢hhhbada和宝塔提供的方法。

开放安全组

腾讯云：https://www.bt.cn/bbs/thread-1229-1-1.html
阿里云：https://www.bt.cn/bbs/thread-2897-1-1.html
华为云：https://www.bt.cn/bbs/thread-3923-1-1.html

根据自己服务器代理商选择对应链接进行操作，因为上面这些开放安全组的方法是我在安装CuteOne时遇到的，差异是最后开放端口时，我们要开放的端口号是8182，仅此一个（这里错了导致无法访问别找我…）。

Xshell建立隧道

版本：Xshell.exe: 6.0.0033（其余版本大同小异）

连接服务器（很简单，自行百度）
依次点击：文件（左上角）->当前会话属性->连接->SSH->隧道，进入到下面的界面：
选择添加

这里举例说明添加隧道的规则：

如果按照上图填写，实现的是我们自己计算机的localhost:8000地址可以访问服务器的localhost:8182，举这个例子应该很清楚了。

为了方便后面的操作，我选择了下面的填写方法：

点击确定（不要点连接）

本地启动

输入命令：

sshwifty

浏览器输入localhost:8182即可。

你可能会问前面不是说地址是127.0.0.1？为什么这里又要用localhost？这里说明一下你可以把localhost和127.0.0.1想成同一个东西。

刚启动如下图：

稍等，即出现验证页面：

这样就成功的在本地启动服务器上的sshwifty啦…

开始使用

如上图，进入sshwifty后需要输入验证密码，初始验证密码是：

1	WEB_ACCESS_PASSWORD

修改验证密码

正在运行中的sshwifty：

停止运行（快捷键）：

Ctrl+C

打开配置文件

1	$ vim /etc/sshwifty.conf.example.json

找到SharedKey，编辑后面的内容即可修改验证密码：

本地登陆SSH

输入验证密码：

进入主界面：

添加SSH：

输入服务器信息（注册服务器时填写的，登陆Xshell时也会用到）：

注意：Host处的IP地址为服务器公网IP，如果登陆失败尝试把:22去掉

选择Yes，I do：

输入服务器登陆密码（不是前面的验证密码！！！）：

进入终端界面：

我心心念念的在线SSH终于看到了苗头（因为现在才只是实现了本地），哈哈！

使用ip:端口号登陆

最终失败了，这里想看就看看，不想看直接到这里。

由于根本找不到教程，我就大胆把127.0.0.1改成了我的ip地址：

却无法正常使用端口访问，向作者提了issues#21

给出的方法是修改配置文件ip为：0.0.0.0

修改配置文件：

运行结果：
地址栏输入ip:8182（ip为服务器公网ip），访问sshwifty：

输入密码，报错：

README中作者给出了解释：

看不懂？我给你翻译：

服务器使用https连接

最简单的办法莫过于给ip地址申请一个ssl证书，然后在配置文件中添加上。

于时我去找哪里可以免费为ip颁发SSL证书，于时就看到了：

所以，我放弃了，使用ip:端口以失败告终！
收获

虽然失败了，但还是有收获的。

先看我配置：

稍微懂一定SSL的应该能看出来这是个证书，但与我ip不匹配，我知道肯定会提示不安全，但可以https访问，前面遇到的问题不是非https不能进去？我换成https试试能不能进去，能进去我就继续尝试绑定域名访问，否则就此放弃。

不出我所料，成功了（能登陆进去）：

也给了我信心！

绑定域名访问

下面就是要教你怎么绑定域名啦，看最下面的更新日期能看出来我中间搁了几天，原因是中途遇到的坑太多，中途放弃了，但昨天下午（05.12）突然想到用宝塔面板反代可能会简单些，回到家就先安排上了宝塔面板，开始尝试，进展很顺利，最后也是实现了绑定域名访问。

安装宝塔面板

以v5.9为例，参考了官方教程。

开放安全组

前面已经介绍了，点击这里查看，需要注意的是我们这次要开放的端口是8888，仅此一个。

贴上我的服务器安全组配置：
安装宝塔面板：

Centos安装命令：
1
yum install -y wget && wget -O install.sh http://download.bt.cn/install/install.sh && sh install.sh
Ubuntu/Deepin安装命令：
1
wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && sudo bash install.sh
Debian安装命令：
1
wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && bash install.sh
Fedora安装命令:
1
wget -O install.sh http://download.bt.cn/install/install.sh && bash install.sh
注：
1. 确认是否要安装宝塔，输入y 回车等待安装完即可：
2. 如果安装过程中出现大量黄色字体，说明出现错误（可能是下载错误），尝试重复执行安装命令解决。
3. 等待一段时间，如果提示pip install --upgrade pip：
  
  命令行输入：
  1
  pip install --upgrade pip
  还需要再次输入安装命令（安装命令可重复执行，不用太在意）。
4. 出现下图文字表示安装完成：
  
  分别代表登陆链接、账号、密码，注意报错。
进入宝塔面板：

打开浏览器，访问给出的登陆链接，输入账号和密码：

就可以进入宝塔面板啦：
安装反代插件：

注：需要等待一段时间，大约几分钟。
开放8182端口：

注：如果不放行肯定无法访问，谁给宝塔的权利能比安全组权力还大…

站点配置

本篇教程使用webssh.xingjiahui.top作为域名访问Sshwifty。

添加站点：

添加后：
设置SSL证书：

注：如果你已有证书，先下载下来，选择上图中的其他证书输入证书的pem和key，记得要在证书夹中部署。
解析域名：

注：主机记录如果不会填写，看这里：

Nginx反代配置

反代是什么？举个例子，你有个域名baidu.com，你想实现浏览器输入baidu.com进去的是hao123.com，反代的作用就是帮你实现这个（个人理解）。

再想想反代的条件：

自己得有个域名。
反代的域名能够直接访问。

把上面的条件拿到我们的Sshwifty这里来：

自己的域名：webssh.xingjiahui.top
反代的域名：ip:端口号

按照下图操作：

此时直接在浏览器输入上面的地址是没有效果的，因为Sshwifty没有启动。

Sshwifty配置

进入配置文件：

1	$ vim /etc/sshwifty.conf.json

按照下图修改（蓝框中信息一定要与我的一致）：

启动Sshwifty

输入命令：

sshwifty

运行结果：

使用前面的域名访问：

还有一个问题，如果此时在命令行按下CTRL+C，Sshwifty服务就会停止，应该怎么避免这样？

我首先想到的就是后台运行，之前接触过nohup：

怎么判断是否安装？

输入which nohub，如果出现/usr/bin/nohup 说明已经安装了，执行以下命令：

1	nohup sshwifty &

如果没有安装，可以根据这篇文章进行操作。

没错，到这里就实现了使用域名访问你的Sshwifty。

记得要看看下面的问题，你很有可能会遇到。

问题

Error (1006)

问题重现：创建SSH时，浏览器弹窗：

在GitHub项目地址的issues9中给出了解决方法：

1	map $http_upgrade $connection_upgrade { default upgrade; '' close; }

1 2	proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection $connection_upgrade;

第一步：

第二步：

注：如果实在不知道加在哪里，可以先根据行号找到大概位置然后根据前后代码找到具体位置粘进去。

Time difference

问题重现：浏览器访问Sshwifty并创建ssh后，关闭浏览器重新访问，报错：

但每次退出后重新访问都会出现这个问题，解决方法：

删除配置文件中：

location / {
        proxy_pass http://121.36.2.183:8182;
        proxy_set_header Host 121.36.2.183:8182;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header REMOTE-HOST $remote_addr;
                
        #持久化连接相关配置
        #proxy_connect_timeout 30s;
        #proxy_read_timeout 86400s;
        #proxy_send_timeout 30s;
        #proxy_http_version 1.1;
        #proxy_set_header Upgrade $http_upgrade;
        #proxy_set_header Connection "upgrade";
        
        add_header X-Cache $upstream_cache_status;
        
        expires 12h;
        proxy_set_header Upgrade $http_upgrade; 
        proxy_set_header Connection $connection_upgrade;
}

在原位置添加（记得先修改下面的你的ip:端口号）：

location / {
     proxy_pass http://你的ip:端口号;
     proxy_set_header Host $host;
     proxy_set_header X-Real-IP $remote_addr;
     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
     proxy_set_header X-Forwarded-Proto https;
}

location /sshwifty/socket {
     proxy_pass http://你的ip:端口号;
     proxy_http_version 1.1;
     proxy_set_header Host $host;
     proxy_set_header X-Real-IP $remote_addr;
     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
     proxy_set_header X-Forwarded-Proto https;
     proxy_set_header Upgrade $http_upgrade;
     proxy_set_header Connection $connection_upgrade;
}