SFTP VScode前端直接修改服务器代码

作者: 青争小台 | 来源:发表于2020-04-22 17:49 被阅读0次

Visual Studio Code如何连接远程服务器？
SFTP VScode前端直接修改服务器代码
vscode 实时同步代码到远程服务器
vscode使用remote ssh插件管理服务器
Linux Sftp
累，终于搞定 Sublime sftp 插件里的密钥登录
Nginx下配置codeigniter框架方法
Docker下安装Apache
如何用python发送邮件
【vscode折腾系列】更换vscode背景图

定义：

sftp是Secure FileTransferProtocol的缩写，安全文件传送协议，可以为传输文件提供一种安全的加密方法。

sftp与 ftp有着几乎一样的语法和功能，SFTP为 SSH的一部分，是一种传输文件到服务器的安全方式。

其实在SSH软件包中，已经包含了一个叫作SFTP(Secure File TransferProtocol)的安全文件传输子系统，SFTP本身没有单独的守护进程，它必须使用sshd守护进程（端口号默认是22）来完成相应的连接操作，所以从某种意义上来说，SFTP并不像一个服务器程序，而更像是一个客户端程序。它的优势在于可以利用安全的连接传输文件，还能遍历本地和远程系统上的文件系统。

由于采用明文传输用户名和密码，FTP协议是不安全的。在同一机房中只要有一台服务器被攻击者控制，它就可能获取到其它服务器上的FTP密码，从而控制其它的服务器。

sftp同样是使用加密传输认证信息和传输的数据，所以，使用SFTP是非常安全的。但是，由于这种传输方式使用了加密/解密技术，所以传输效率比普通的FTP要低得多，如果您对网络安全性要求更高时，可以使用SFTP代替FTP。

sftp的主要功能是在本地与远程计算机间安全地复制文件，并且可以直接编辑文件。

浅谈SFTP、FTP的区别

FTP（File Transfer Protocol），即文件传输协议，用于Internet上控制文件的双向传输。
FTP在linux系统中，传输默认的端口为21端口，通常以ASCII码和二进制的方式传输数据，支持主动模式和被动模式两种方式。

SFTP（Secure File Transfer Protocol），即文件加密传输协议，
SFTP在linux系统中，传输默认的端口为22端口，这种传输方式更为安全，传输双方既要进行密码安全验证，还要进行基于密钥的安全验证，有效的防止了“中间人”的威胁和攻击。

在使用linux的centos服务器系统中，两个比较起来，ftp传输会比sftp传输速率快，毕竟sftp牺牲了一定的效率，以保证传输过程的安全。

VScode 配置SFTP

1. vscode扩展中安装SFTP插件
在vscode扩展中搜索sftp，下载量超过一百万的那个就是了，作者是liximomo。

截屏2020-04-20下午4.31.16.png
2. ctrl+shift+p（command+shift+p）,输入SFTP:config
这里必须要打开一个项目或者一个空文件夹也行，因为修改的文件需要保存在这里

image.png
3. 配置sftp.json

注意：
1. 不要注释
2. 只需要配置host、username、password以及 remotePath四个参数就可以使用了
3. 不建议开启autoUpload和autoDelete操作，避免不小心把临时改动update到服务器上，就不好玩了

{
    "host": "远程ip地址",
    "port": 服务器端口,
    "username": "登录名",
    "password": "登录密码",
    "protocol": "sftp", 
    "agent": null,
    "privateKeyPath": null, 
    "passphrase": null, 
    "passive": false, 
    "interactiveAuth": true,
    "remotePath": "需要打到的远程的文件夹地址",//例："/www/ceshi.cn/"，注意：www前的'/'不能少
    "context": "本地项目地址",
    "uploadOnSave": true,
    "syncMode": "update",
    "ignore": [
        "**/.vscode/**",
        "**/.git/**",
        "**/.DS_Store"
    ],
    "watcher": {
        "files": false,
        "autoUpload": false,
        "autoDelete": false
    }
}
//例：
{
    "host": "47.92.36.112",
    "port": 22,
    "username": "root"
    "password": "CeShi2020",
    "protocol": "sftp", 
    "agent": null,
    "privateKeyPath": null, 
    "passphrase": null, 
    "passive": false, 
    "interactiveAuth": true,
    "remotePath": "/www/ceshi.cn/",
    "context": "/Users/zhao/Desktop",
    "uploadOnSave": true,
    "syncMode": "update",
    "ignore": [
        "**/.vscode/**",
        "**/.git/**",
        "**/.DS_Store"
    ],
    "watcher": {
        "files": "glob",
        "autoUpload": true,
        "autoDelete": true
    }
}

4. 在本地编辑远程文件并测试

查看到远程
ctrl+shift+p（command+shift+p）,输入view:Show SFTP

image.png
打开一个远程文件

image.png
初始内容是

image.png
现在我们修改一下

image
需要注意的是，修改完成后你保存的只是本地副本，还需要经过上传，才能达到真正修改的目的，右键选择upload即可，为了方便起见，这里修改一下快捷键，连续按下ctrl+k和ctrl+s，再ctrl+f搜索upload，将对应项快捷键设为ctrl+alt+s

image

上传之后，源文件就已经和本地编辑器相同了

补充

1.原理

SFTP原理是这样的：首先本地要有一个项目文件夹，同时远程也有一个项目文件夹，然后通过配置文件来同步二者。
SFTP可以查看远程项目所有文件，但不能直接操作，必须操作本地项目文件，再同步到远程项目。

现在我们本地和远程均有一个文件夹“sftpFolder”，用VsCode打开本地文件夹“sftpFolder”，然后执行 ctrl+shift+p ，搜索 SFTP:Config ，回车后，会生成一个“.vscode/sftp.json”，这个就是配置文件。
同时，如下图左侧会多了一个“远程目录”。

image.png

2.配置

常用配置

{
    "name": "本地文件夹名称（可自定义）",
    "host": "ip或域名",
    "protocol": "协议：[sftp/ftp]默认ftp",
    "port": 22,
    "username": "username",
    "password":"password",
    "remotePath": "远程文件夹地址，默认/",
    "context": "本地文件夹地址，默认为vscode工作区根目录",
    "uploadOnSave": true,
    "downloadOnOpen":false,
    "ignore": [
        "**/.vscode/**",
        "**/.git/**",
        "**/.DS_Store"
    ],
    "watcher": {
        "files": "*",
        "autoUpload": false,
        "autoDelete": false
    }
}
配置文件不能写注释，所以这里说明一下其中几个属性：

uploadOnSave：本地更新文件保存会自动同步到远程文件（不会同步重命名文件和删除文件）
downloadOnOpen：从远程服务器下载打开的文件
ignore：忽略的文件（匹配的文件不会同步）
watcher：监听器（可以重命名文件和删除文件）
autoUpload：文件变更会自动同步（修改和重命名）
autoDelete：文件删除会自动同步

3.示例配置

{
    "name": "test", 
    "host": "abc.com",
    "protocol": "ftp",
    "port": 21,
    "username": "username",
    "password":"password",
    "remotePath": "/",
    "uploadOnSave": true,
    "ignore": [
        "**/.vscode/**",
        "**/.git/**",
        "**/.DS_Store"
    ],
    "watcher": {
        "files": "*",
        "autoUpload": false,
        "autoDelete": false
    }
}