整理几个超实用的前端提效shell命令

curl

目前创新互联已为超过千家的企业提供了网站建设、域名、虚拟空间、网站托管、企业网站设计、石景山网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

curl 是常用的命令行工具，用来请求 Web 服务器。它的名字就是客户端（client）的 URL 工具的意思。curl 功能非常强大，它的命令可以直接放到 postman 使用，postman 也是支持 curl 的请求方式。

常用的结果参数

curl 的参数包括很多，这里只说几个常用的，如果遇到复杂情况可以参考文档。

不知道是不是还有的小伙伴不知道 postman 直接支持 curl 命令,在 postman 中点击 code 就会出现对应请求的curl命令

  •  -X 参数指定 HTTP 请求的方法。
  •  -H 参数添加 HTTP 请求的标头。
  •  -d 参数用于发送 POST 请求的数据体。使用 -d 参数以后，HTTP 请求会自动加上标头Content-Type : application/x-www-form-urlencoded。并且会自动将请求转为 POST 方法，因此可以省略-X POST
  •  -b 参数用来向服务器发送 Cookie。
  •  想了解更多参数可以去看下阮一峰老师文档 https://www.ruanyifeng.com/blog/2019/09/curl-reference.html

curl 项目中应用

如果对 curl 熟悉的小伙伴完全可以替代 postman 等工具，小伙伴可以直接模拟请求。（我认为curl能看到懂常用命令就够了）

因为在 BFF 项目中，好多时候前端也参与开发，我们也会直接调用后端的接口，有时候报错不知道是不是自己参数写错了，或者 cookie 有问题，找问题调试不方便，在 local 环境下，我们会直接打印出完整的 curl 请求，这时候可以直接看出错误，开发者只需要知道 curl 的一些参数就可以，还可以直接把 curl 命令复制到 postman 进行调试。看一下具体实现部分代码

 
 
 
 
    
  
  
  
  
  1.  //只在本地环境输出 
    2. 
  
  
  
  
  2.     if (ctx.app.config.env === 'local') { 
    3. 
  
  
  
  
  3.       const str = 
    4. 
  
  
  
  
  4.         curlString(url, { 
    5. 
  
  
  
  
  5.           method, 
    6. 
  
  
  
  
  6.           headers, 
    7. 
  
  
  
  
  7.           body, 
    8. 
  
  
  
  
  8.         }) + '\n'; 
    9. 
  
  
  
  
  9.       console.log('\x1b[32m%s\x1b[0m', str); 
    10. 
  
  
  
  
  10.     }    
    11. 
  
  
  
  
  11. /** 
    12. 
  
  
  
  
  12.  * Builds a curl command and returns the string. 
    13. 
  
  
  
  
  13.  * @param  {String} url               Endpoint 
    14. 
  
  
  
  
  14.  * @param  {Object} options           Object with headers, etc. (fetch format) 
    15. 
  
  
  
  
  15.  * @return {String}                   cURL command 
    16. 
  
  
  
  
  16.  */ 
    17. 
  
  
  
  
  17. function curlString(url, options) { 
    18. 
  
  
  
  
  18.   const method = options && options.method && typeof options.method === 'string' ? options.method.toUpperCase() : 'GET'; 
    19. 
  
  
  
  
  19.   const hasHeaders = options && options.headers && typeof options.headers === 'object'; 
    20. 
  
  
  
  
  20.   const hasBody = options && options.body; 
    21. 
  
  
  
  
  21.   let curl = `\ncurl --request ${method} \\\n--url '${url}'`; 
    22. 
  
  
  
  
  22.   if (hasHeaders) { 
    23. 
  
  
  
  
  23.     curl += 
    24. 
  
  
  
  
  24.       ' \\\n' + 
    25. 
  
  
  
  
  25.       Object.entries(options.headers) 
    26. 
  
  
  
  
  26.         .filter(([key, value]) => value !== undefined) 
    27. 
  
  
  
  
  27.         .map(([key, value]) => `--header '${key}: ${value}'`) 
    28. 
  
  
  
  
  28.         .join(' \\\n'); 
    29. 
  
  
  
  
  29.   } 
    30. 
  
  
  
  
  30.   if (hasBody) { 
    31. 
  
  
  
  
  31.     curl += ` \\\n--data '${bodyToDataString(options)}'`; 
    32. 
  
  
  
  
  32.   } 
    33. 
  
  
  
  
  33.   return curl; 
    34. 
  
  
  
  
  34. } 
    35. 
  
  
  
  
  35. /** 
    36. 
  
  
  
  
  36.  * Constructs a body string for use inside --data 
    37. 
  
  
  
  
  37.  * @param  {Object} options           Object with headers, etc. (fetch format) 
    38. 
  
  
  
  
  38.  * @return {String}                   cURL command data string 
    39. 
  
  
  
  
  39.  */ 
    40. 
  
  
  
  
  40. function bodyToDataString(options) { 
    41. 
  
  
  
  
  41.   let parsedData; 
    42. 
  
  
  
  
  42.   try { 
    43. 
  
  
  
  
  43.     parsedData = JSON.parse(options.body); 
    44. 
  
  
  
  
  44.   } catch (e) { 
    45. 
  
  
  
  
  45.     // fall back to original body if it could not be parsed as JSON 
    46. 
  
  
  
  
  46.     parsedData = options.body; 
    47. 
  
  
  
  
  47.   } 
    48. 
  
  
  
  
  48.   // return an ampersand delimited string 
    49. 
  
  
  
  
  49.   const headers = _.get(options, 'headers'); 
    50. 
  
  
  
  
  50.   const contentType = _.toLower(_.get(headers, 'content-type') || _.get(headers, 'Content-Type')); 
    51. 
  
  
  
  
  51.   if (contentType === 'application/x-www-form-urlencoded') { 
    52. 
  
  
  
  
  52.     if (typeof parsedData === 'string') { 
    53. 
  
  
  
  
  53.       return parsedData; 
    54. 
  
  
  
  
  54.     } else { 
    55. 
  
  
  
  
  55.       return Object.entries(parsedData) 
    56. 
  
  
  
  
  56.         .map(([key, val]) => `${key}=${val}`) 
    57. 
  
  
  
  
  57.         .join('&'); 
    58. 
  
  
  
  
  58.     } 
    59. 
  
  
  
  
  59.   } else { 
    60. 
  
  
  
  
  60.     return JSON.stringify(parsedData); 
    61. 
  
  
  
  
  61.   } 
    62. 
  
  
  
  
  62. }
    63.

vim 中的基本操作和配置

非 insert 模式

在 vim 打开文件后，还没有使用插入编辑，可以做哪些基本操作

  1.  G 快速移动到文件底部(常用于查看日志)
  2.  gg 快速移动到文件顶部
  3.  0 快速移动到行首
  4.  $ 快速移动到行尾
  5.  :13 快速移动到特定行
  6.  ZZ 光标移动到本屏中间
  7.  dd 剪切本行
  8.  yy 复制本行
  9.  u 撤销（undo缩写，撤销）
  10.  p 粘贴 （p指paste，粘贴）
  11.  在 mac 系统下可以 option+点击 快速移动到想要的位置（也就是光标）

insert 模式

前面说了多种移动方式，接下来结束几个常用的 insert 命令，我这里就结束一些常用简单的

  1.  i 在当前光标的前面进行编辑
  2.  o 快速进入 insert 模式，并定位到下一行编辑
  3.  esc 退出 insert 模式，与

ping

在网络中 ping 是一个十分强大的 TCP/IP 工具。

  1.  用来检测网络的连通情况和分析网络速度
  2.  根据域名得到服务器IP
  3.  根据ping返回的TTL值来判断对方所使用的操作系统及数据包经过路由器数量。

bytes值：数据包大小，也就是字节。

time值：响应时间，这个时间越小，说明你连接这个地址速度越快。

TTL值：Time To Live,表示DNS记录在DNS服务器上存在的时间，它是 IP 协议包的一个值，告诉路由器该数据包何时需要被丢弃。可以通过 Ping 返回的 TTL 值大小，粗略地判断目标系统类型是 Windows 系列还是 UNIX/Linux 系列。

默认情况下，Linux 系统的TTL值为64或255，WindowsNT/2000/XP 系统的 TTL 值为 128，Windows98 系统的 TTL 值为32，UNIX 主机的 TTL 值为 255。

除了直接 ping ip ，还可以 ping 域名，会自动把域名解析为 ip。

应用

最常用的方式是直接ping ip地址，测试网络连通性

学会看懂出错提示信息

（1）NoAnswer：这种故障表明本机有一条通向中心主机的路由，但没有收到发给该中心主机的任何信息。原因可能是：中心主机没有工作、本机或中心主机网络配置不正确、本地或中心的路由器没有工作、通信线路有故障、中心主机存在路由选择问题，等等。

（2）Request Timed Out：超时错误，被测试的机器不能正常连接，原因可能是该主机此时未连接（如已关机）、或到路由器的连接有问题、或路由器不能通过，或对方主机使用了防火墙软件禁止进行 Ping 测试等等。

（3）Unknown Host Name：无法解析主机名字，可能是DNS设置不对，或者对方主机不存在

telnet

telnet 经常可以确定远程服务的状态，比如确定远程服务器的某个端口是否能访问（端口连通性）。

telenet是windows标准服务，可以直接用;如果是linux或者mac，需要自己安装telnet

使用 telnet ip port

1）先用telnet连接不存在的端口

 
 
 
 
    
  
  
  
  
  1. [root@localhost ~]# telnet 10.0.250.3 80 
    2. 
  
  
  
  
  2. Trying 10.0.250.3... 
    3.

telnet: connect to address 10.0.250.3: Connection refused #直接提示连接被拒绝

2）再连接存在的端口

 
 
 
 
    
  
  
  
  
  1. [root@localhost ~]# telnet localhost 22 
    2. 
  
  
  
  
  2. Trying ::1... 
    3. 
  
  
  
  
  3. Connected to localhost. #看到Connected就连接成功了 
    4. 
  
  
  
  
  4. Escape character is '^]'. 
    5. 
  
  
  
  
  5. SSH-2.0-OpenSSH_5.3 
    6. 
  
  
  
  
  6. a 
    7. 
  
  
  
  
  7. Protocol mismatch. 
    8. 
  
  
  
  
  8. Connection closed by foreign host.
    9.

总结

优秀和常用的 shell 命令有好多，我这里只写了几个非常常用，并且前端开发者也会经常用到的命令，希望对小伙伴们有一丢丢帮助。

当前标题：整理几个超实用的前端提效shell命令
本文路径：http://www.shufengxianlan.com/qtweb/news8/517858.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

猜你还喜欢下面的内容

标签优化知识

同城分类信息

圣月阀门　　 　消防工程　　 　香港云主机　　 　绵阳托管服务器　　 　成都广告公司　　 　免备案空间　　 　奢侈品网站建设方案　　 　营销网站建设　　 　兴宏源活动板房　　 　四川盐亭做网站　　 　升施印刷　　 　App开发　　 　成都网站优化　　 　成都二枢机房　　 　网站SEO优化　　 　资阳做网站　　 　雅安托管服务器　　 　微信公众号开发　　 　成都纯水机　　 　IDC机房托管