web服务器，验证码，Xftp使用方法

阳光穿透心脏的1/2处 2021-09-19 02:18 301阅读 0赞

![web服务器][web]

IIS操作步骤

![image.png][]

![image.png][image.png 1]

![image.png][image.png 2]

![image.png][image.png 3]

![image.png][image.png 4]

![image.png][image.png 5]

![image.png][image.png 6]

![image.png][image.png 7]

![image.png][image.png 8]

![image.png][image.png 9]

![image.png][image.png 10]

![image.png][image.png 11]

![image.png][image.png 12]

![image.png][image.png 13]

直接装的wamp  
腾讯云主机控制台  
安全组里可以配置要开放的端口  
关闭防火墙

（C:\\wamp\\bin\\apache\\Apache2.4.4）  
打开httpd.conf文件  
require all denied  
改成：  
![image.png][image.png 14]

![image.png][image.png 15]

wamp用localhost可以访问，用公网ip无法访问  
用外网访问提示403 forbbiden

![image.png][image.png 16]

![image.png][image.png 17]

最好关闭防火墙

![image.png][image.png 18]

打开http://localhost

![image.png][image.png 19]

建立web服务器  
将网站挂在8080端口上

![image.png][image.png 20]

![image.png][image.png 21]

在IIS中可以选择“添加虚拟目录”和“添加应用程序”两种方法

![image.png][image.png 22]

选择一个网站或者虚拟目录

![image.png][image.png 23]

![image.png][image.png 24]

![image.png][image.png 25]

验证码功能

<!DOCTYPE html>
    <html>
    
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
    
      <title>前端验证码功能</title>
      <style>
        *{
          margin: 0;
          padding: 0;
        }
        body{
          background: rgba(0, 0, 0, .1);
          /* background: #061227; */
        }
        form{
          width: 600px;
          margin: 100px auto;
        }
        .box{
          height: 40px;
          line-height: 40px;
        }
        .tip{
          float: left;
        }
        input{
          float: left;
          width: 200px;
          height: 30px;
          padding: 3px 10px;
          line-height: 30px;
        }
        #identify{
          float: left;
          width: 100px;
          height: 40px;
          line-height: 40px;
          font-weight: bold;
          text-align: center;
          letter-spacing: 2px;
          background: #365c64;
          color: #fff;
          border-radius: 5px;
          margin: 0 10px;
        }
        .btn{
          margin: 25px auto;
        }
        .btn button{
          width: 200px;
          height: 36px;
          line-height: 36px;
          background: #409eff;
          border-radius: 5px;
          border: 0;
          color: #fff;
        }
      </style>
    </head>
    
    <body>
      <form action="">
        <div class="box">
          <span class="tip">验证码：</span>
          <input type="text" id="text" value="" placeholder="请输入验证码" autocomplete="off">
          <span id="identify" onclick="generatedCode()"></span>
          <a href="javascript:void(0)" onclick="generatedCode()">看不清，换一张</a>
        </div>
        <div class="btn"><button onclick="checkCode()">验证</button></div>
      </form>
    </body>
    <script>
      generatedCode();
      // 随机生成验证码
        function generatedCode() {
          var code1 = "";//生成的验证码 
          var array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
          for (let i = 0; i < 4; i++) {
            var index = Math.floor(Math.random() * 36);//随机0-35
            code1 += array[index];
            document.getElementById("identify").innerHTML = code1;
          }
          console.log("二维码是：",code1)
        };
        // 验证用户输入
        function checkCode() {
          var code2 = document.getElementById("identify").innerHTML;//获取当前生成的验证码
          code2 = code2.toUpperCase();
    
          var code3 = document.getElementById("text").value; //客户输入的验证码
          code3 = code3.toUpperCase();//把客户输入的验证码转换为大写
          console.log("生成的二维码是:"+ code2 +"\n用户输入的验证码是:"+ code3)
    
          if (code2 === code3) {
            alert("恭喜验证成功");
            // window.open('http://www.baidu.com');
          } else {
            alert("输入的验证码不正确");
            code3 = "";//清空用户输入
          }
        }
    </script>
    </html>

WampServer  
腾讯云服务器  
Windows Server 2012 R2，WampServer 2.4。

![image.png][image.png 26]

![image.png][image.png 27]

![image.png][image.png 28]

![image.png][image.png 29]

![image.png][image.png 30]

![image.png][image.png 31]

FTP是 File Transfer Protocol文件传输协议的缩写，用来在两台计算机之间互相传送文件。

![image.png][image.png 32]

![image.png][image.png 33]

![image.png][image.png 34]

![image.png][image.png 35]

![image.png][image.png 36]

![image.png][image.png 37]

![image.png][image.png 38]

> Xftp使用方法

![image.png][image.png 39]

![image.png][image.png 40]

![image.png][image.png 41]

点击Download下方的Free License菜单  
[https://www.netsarang.com/][https_www.netsarang.com]

![image.png][image.png 42]

![image.png][image.png 43]

## 结言 ##

好了，欢迎在留言区留言，与大家分享你的经验和心得。

感谢你学习今天的内容，如果你觉得这篇文章对你有帮助的话，也欢迎把它分享给更多的朋友，感谢。

[web]: /images/20210724/f95a92d6d90a402caead642149d50d23.png
[image.png]: /images/20210724/5f6cc3163bd545c18009e9c0ced8953f.png
[image.png 1]: /images/20210724/a5387af44a6f48f2af3b4430430d5875.png
[image.png 2]: /images/20210724/5dccf7fe8f2a4590a84a56741de8a357.png
[image.png 3]: /images/20210724/e4e67c28ae164dd2b074853f3bf91211.png
[image.png 4]: /images/20210724/a27ff282acb8459f80040aa40f2eaa53.png
[image.png 5]: /images/20210724/10302ef4d51840be97ceade40aee41f0.png
[image.png 6]: /images/20210724/07edd9d4a176447b8e8aa6d7a8d8af35.png
[image.png 7]: /images/20210724/2f2539b23bb74610a58eb585ba9f9248.png
[image.png 8]: /images/20210724/e2ea59c647a344ffa328992815fdf300.png
[image.png 9]: /images/20210724/84fb048c992d47a1af301542c1ceb495.png
[image.png 10]: /images/20210724/4455983b2c08452db6c17690386948cd.png
[image.png 11]: /images/20210724/5a7a8b7f38a843898e1e156de5d17ca5.png
[image.png 12]: /images/20210724/acb80cf808544d96ac5a16dedc2e6664.png
[image.png 13]: /images/20210724/aa7c7500ee814002af4bfab7fa4f9973.png
[image.png 14]: /images/20210724/8bd41596309648c5a13fbd47dd564d29.png
[image.png 15]: /images/20210724/c3dbd7570c834b508e6030c781757aba.png
[image.png 16]: /images/20210724/563e20f073ef4660bac636dba8592790.png
[image.png 17]: /images/20210724/77b2cf6d4f4649fc8ea7563e85906d9e.png
[image.png 18]: /images/20210724/6a1ce99984534f03aa2c4c6ea0990e1e.png
[image.png 19]: /images/20210724/bcb9ff984af04464aaa681c1ace5fb8c.png
[image.png 20]: /images/20210724/8c1a7b062db24ea68054d600ff9957ec.png
[image.png 21]: /images/20210724/6d96b3480cb84b4aa156cb39b84dd13b.png
[image.png 22]: /images/20210724/3a18e4638ecc46239c033fa65a92c485.png
[image.png 23]: /images/20210724/b00c7c21ede04048ba6cc9b9c4a1c7f7.png
[image.png 24]: /images/20210724/80387cb5d98b48f085c8179396ea62a6.png
[image.png 25]: /images/20210724/da597cd0fb064ae9a942a9011b071c7e.png
[image.png 26]: /images/20210724/5bba2180a8d94d87bd63a27bdcf93be9.png
[image.png 27]: /images/20210724/e6462cf1181e4073b7dfd338317cc57c.png
[image.png 28]: /images/20210724/c4b79b2e59954d1caddd46c136f437b2.png
[image.png 29]: /images/20210724/66a20c2d85f1483b9caac6a19962a2fc.png
[image.png 30]: /images/20210724/0091b6e451324011b095e6f3cf0e7b00.png
[image.png 31]: /images/20210724/4edd5f854e0b4519bf49ddbb4ab453c3.png
[image.png 32]: /images/20210724/e3380d2341b449a7b1018abe2aa023f2.png
[image.png 33]: /images/20210724/5770f55fde5b406087e627afeb2bdabf.png
[image.png 34]: /images/20210724/ba0fd4ae4ff3455584458bff8b019604.png
[image.png 35]: /images/20210724/673418d5199347cb8f6d59117004854a.png
[image.png 36]: /images/20210724/10215096937541b39589f2144b43070f.png
[image.png 37]: /images/20210724/5109b071966a42938581b8b5e7f87559.png
[image.png 38]: /images/20210724/62676112995341fe9f53421428a5ff32.png
[image.png 39]: /images/20210724/b65ae0bccc6f4ff7bb4e49ac033589f5.png
[image.png 40]: /images/20210724/4ce16a6ce0354f0d9e73313c2ae59243.png
[image.png 41]: /images/20210724/a2efc19eb2d647bc888eef90d89f9ee7.png
[https_www.netsarang.com]: https://www.netsarang.com/
[image.png 42]: /images/20210724/ebeaba5aef7747d3bc0d576b5b5439d1.png
[image.png 43]: /images/20210724/163fc6cc28204b0da2c7f85fb9ae53ab.png