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

web服务器

IIS操作步骤

image.png image.png image.png image.png image.png image.png image.png image.png image.png image.png image.png image.png image.png image.png

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

(C:\wamp\bin\apache\Apache2.4.4)
打开httpd.conf文件
require all denied
改成:
image.png image.png

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

image.png image.png

最好关闭防火墙

image.png

打开http://localhost

image.png

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

image.png image.png

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

image.png

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

image.png image.png image.png

验证码功能

<!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 image.png image.png image.png image.png

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

image.png image.png image.png image.png image.png image.png image.png

Xftp使用方法

image.png image.png image.png

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

image.png image.png

 

posted @   老虎死了还有狼  阅读(447)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示