美文网首页
SFTP VScode前端直接修改服务器代码

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

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

定义:

  • 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
    }
}

3.使用

image.png

Upload Folder 和 Download Folder 在 uploadOnSave 和 watcher 都关闭的情况下使用。

相关文章

网友评论

      本文标题:SFTP VScode前端直接修改服务器代码

      本文链接:https://www.haomeiwen.com/subject/movlvhtx.html