vue加php怎么实现登陆

分类：PHP作者：编程之家用户

vue加php实现登录的方法：1、创建登录部分的代码文件；2、创建Javascript代码；3、在vue项目中使用PHP来做用户的注册和登录功能即可。

本文操作环境：Windows7系统，PHP7.1版，Dell G3电脑。

Vue + PHP 做用户注册登录功能

对于一款应用来说，最基本的就是用户的注册和登录功能，这篇博客就总结一下在vue项目中如何使用PHP来做用户的注册和登录功能。

登录部分：

HTML
<div id=app class=container>
   <div style=text-align:center;margin-top:60px;>
       <img src=../src/icon/vlogo.png style=width:20rem;height:auto; alt=>
   </div>
   <form class=form middle>
       <br>
       <div class=form-group>
           <input type=text class=form-control input100 v-model=userid placeholder=用户名 / 邮箱/>
       </div>
       <div class=form-group>
           <input type=password class=form-control input100 v-model=usercode placeholder=密码 @keyup.13=login />
       </div>
       <label class=errorMsg v-if=errorFlag v-cloak >{{ errorMsg }}</label>
       
       <div class=form-group btn100>
           <button type=button @click=login class=btn btn-primary btn100>登陆</button>
       </div>
       <div class=form-group btn100>
           <a href=./registermobile.html class=btn btn-default btn100>注册</a>
       </div>
       <h6 style=text-align:right;>
           <a href=./findpassword.html style=margin-right:2rem;>找回密码</a>
       </h6>
       <hr>         
       <h6 style=text-align:center;margin-top:3rem;>
           <a style=margin-right:2rem;>© vchenzhe</a>
           <a href='http://www.beian.gov.cn' style=text-decoration:none;color:black; target='_blank'>闽ICP备19008574号-1</a>
       </h6> 
   </form>    
</div>
Javascript
import $ from './js/jquery.js';import './css/mobilecommon.css';import Vue from '../node_modules/vue/dist/vue.js';$(function(){
    var vm = new Vue({
        el:#app,
        data:{
            userid:'',
            usercode:'',
            errorFlag:false,
            errorMsg:''
        },
        methods:{
            login(){
                var thisvue = this;
                if(thisvue.userid==''||thisvue.usercode=='')
                {
                    thisvue.errorMsg = '请输入用户名和密码';
                    thisvue.errorFlag = true;
                }
                else{
                    $.ajax({
                        type:'POST',
                        url:'../server/login.php',
                        data:{
                            userid:thisvue.userid,
                            usercode:thisvue.usercode                        },
                        success:function(res){
                            if(res[0].code==1)
                            {
                                thisvue.errorFlag = false;
                                window.location.href=./homemobile.html;
                            }
                            else{
                                thisvue.errorMsg = '账号或密码错误';
                                thisvue.usercode = '';
                                thisvue.errorFlag = true;
                            }
                        }
                    })

                }
            }
        }
    })})
PHP
<?php
	session_start();
	header('Content-Type:application/json; charset=utf-8');
	$myid = $_POST[userid]; 
	$mycode = md5($_POST[usercode]);
	if($myid!=''&&$mycode!='')
	{
		$conn = new mysqli(localhost:3306, root, , personal);
		if ($conn != null) 
		{
			$sql = select * FROM user_login where user_id='$myid' or user_mail = '$myid' ;
			$result =$conn->query($sql);
	  		$resArray = mysqli_fetch_array($result); 		
	  		if($resArray[user_password] == $mycode)
	  		{
				$_SESSION['chenzhe_user_id'] = $resArray['user_id'];
				$result_array[0] = ['code'=>'1','msg'=>'登陆成功'];
				echo json_encode($result_array);
	  		}
	  		else
	  		{
				$result_array[0] = ['code'=>'0','msg'=>'用户名或密码输入错误'];
				echo json_encode($result_array);
	  		}
			$conn->close();
		}
	}
	else
	{
		$result_array[0] = ['code'=>'0','msg'=>'请输入用户名或密码'];
		echo json_encode($result_array);
	}
	?>

注册部分

HTML
<div class=container style=margin-top:2rem; id=app>
        <ol class=breadcrumb btn100>
            <li><a href=./indexmobile.html>返回</a></li>
            <li class=active>注册</li>
        </ol>
        <p class=errorMsg v-if=errorFlag==1 v-cloak >{{errorMsg}}</p>
        <form class=form id=registerForm>	
            <div class=form-group has-feedback>
                <input type=text @keyup=testUserIdFunc v-model=userid name=userid minlength=9  maxlength=16  class=form-control input100 placeholder=用户名 required>
                <span v-show=testUserId class=glyphicon glyphicon-ok form-control-feedback aria-hidden=true style=color:#5cb85c;></span>
              </div>
              <div class=form-group>
                <input type=text v-model=username name=username maxlength=10  class=form-control input100 placeholder=昵称 required>
              </div>

              <div class=form-group has-feedback >
                <input type=password @keyup=readInfo v-model=usercode  name=usercode minlength=9 maxlength=20  class=form-control input100  placeholder=密码 required>
                <span v-show=testpass class=glyphicon glyphicon-ok form-control-feedback aria-hidden=true style=color:#5cb85c;></span>
              </div>
              
              <div class=form-group has-feedback >
                <input type=password @keyup=readInfo v-model=usercodes name=checkusercode maxlength=20  class=form-control input100  placeholder=确认密码 required>
                <span v-show=testpass class=glyphicon glyphicon-ok form-control-feedback aria-hidden=true style=color:#5cb85c;></span>
              </div>
    
              <div class=form-group has-feedback >
                <input type=email @keyup=testmailFunc v-model=usermail name=usermail  class=form-control input100  placeholder=邮箱 required>
                <span v-show=testmail class=glyphicon glyphicon-ok form-control-feedback aria-hidden=true style=color:#5cb85c;></span>
              </div>
              <div class=form-group btn100 style=display:flex; >
                <input type=number v-model=code class=form-control  placeholder=验证码 required>
                <button  v-if=testUserId==0||testpass==false||usermail==''||testmail==false  type=button class=btn btn-default btn80 btn-disabled disabled style=margin-left:1rem;>获取验证码</button>
                <button v-show=btnGetCode==0 v-if=testUserId==1&&testpass==true&&usermail!=''&&testmail==true  type=button class=btn btn-default btn80 @click=getCode style=margin-left:1rem;>获取验证码</button>
                <button v-show=btnGetCode==1 type=button class=btn btn-disabled btn80 disabled style=margin-left:1rem;>已发送({{ clock }}s)</button>
              </div>
            
            <div class=btn100>
                <button type=button class=btn btn-primary btn100 @click=register>注册</button>
            </div>
        </form>

        <div class=modal fade id=myModal tabindex=-1 role=dialog aria-labelledby=myModalLabel aria-hidden=false>
          <div class=modal-dialog>
              <div class=modal-content>
                  <div class=modal-header>
                      <button type=button class=close data-dismiss=modal aria-hidden=true>&times;</button>
                      <h4 class=modal-title id=myModalLabel>消息</h4>
                  </div>
                  <div class=modal-body>
                      {{ errorMsg }}
                  </div>
                  <div class=modal-footer>
                      <button type=button class=btn btn-primary  data-dismiss=modal>确认</button>
                  </div>
              </div><!-- /.modal-content -->
          </div><!-- /.modal -->
        </div>

        <h6 style=text-align:center;margin-top:3rem;>
            <a href=./index.html style=margin-right:2rem;>电脑版</a>
            <a href='http://www.beian.gov.cn' style=text-decoration:none;color:black; target='_blank'>闽ICP备19008574号-1</a>
        </h6> 
    </div>
Javascript
import $ from './js/jquery.js';import './css/mobilecommon.css';import Vue from '../node_modules/vue/dist/vue.js';$(function(){
    var vm = new Vue({
        el:#app,
        data:{
            errorMsg:'',
            errorFlag:0,
            //填写注册信息
            userid:'',
            username:'',
            usercode:'',
            usercodes:'',
            usermail:'',
            //验证注册信息
            code:'',
            btnGetCode:0, //用于判断当前是否获取了一次验证码，默认是0，获取一次后改成1
            testcode:0, //用于判断当前是否完成了验证码验证，默认是0，验证通过是1
            clock:60,
            testUserId:false,//检测当前用户名是否已经注册
            testpass:false,//检测密码安全
            testmail:false, //检测邮箱是否被注册过了


        },
        methods:{
            testUserIdFunc(){ //检测用户名是否已经注册
                var thisvue = this;
                var testall = /^[a-zA-Z][a-zA-Z0-9]*$/; //只能是数字和字母
                if(thisvue.userid=='')
                {
                    thisvue.testUserId = false;
                    return 0;
                }
                else if(!testall.test(thisvue.userid)) //检测英文和数字
                {
                    this.errorFlag = 1;
                    this.errorMsg = '用户名必须以英文开头，且只能由英文和数字组成';
                }
                else if(thisvue.userid.length<9)
                {
                    thisvue.errorFlag = 1;
                    thisvue.errorMsg = '用户名长度须在9-16之间';
                    thisvue.testUserId = false;
                    return 0;
                }    
                else{
                    $.ajax({
                        type:'POST',
                        url:'../server/testUserId.php',
                        data:{
                            user_id:thisvue.userid                        },
                        success:function(res)
                        {
                            if(res.code==1)
                            {
                                thisvue.testUserId = true;
                                thisvue.errorFlag = 0;
                            }
                            else{
                                thisvue.testUserId = false;
                                thisvue.errorFlag = 1;
                                thisvue.errorMsg = res.msg;
                            }
                        }
                    })
                }
            },
            readInfo(){ //检索密码安全等
                var result = 1;
                var testall = /^(?!\d+$)[\da-zA-Z]+$/; //只能是数字和字母
                if(this.usercode.length<9) //检测长度
                {
                    this.errorFlag = 1;
                    this.errorMsg = '密码长度须在9-20个字符，只能由英文和数字组成';
                    result = 0;
                }
                else if(!testall.test(this.usercode)) //检测英文和数字
                {
                    this.errorFlag = 1;
                    this.errorMsg = '密码只能使用英文+数字,且不能为纯数字';
                    result = 0;
                
                }
                else if(this.usercode!=this.usercodes)
                {
                    this.errorFlag = 1;
                    this.errorMsg = '两次密码输入不一致';
                    result = 0;
                    
                }
                /*else if(testenglish.test(this.usercode))
                {
                    this.errorFlag = 1;
                    this.errorMsg = '密码不能为纯数字';
                    result = 0;
                }*/
                
                if(result==1)
                {
                    this.errorFlag = 0;
                    this.testpass = 1;//如果密码验证成功，则通过
                } 
                return result;
            },
            register(){
                var thisvue = this;
                if(thisvue.usermail==''||thisvue.code=='')
                {
                    thisvue.errorMsg = '你还没有进行邮箱验证';
                    thisvue.errorFlag = 1;
                }
                else{
                    thisvue.verifyCode();
                    $.ajax({
                        url:'../server/register.php',
                        type:'POST',
                        data:$(#registerForm).serialize(),
                        success:function(res)
                        {
                            if(res.code==1)
                            {
                                window.location.href = 'indexmobile.html';
                            }
                            else{
                                thisvue.errorMsg = '注册失败';
                                thisvue.errorFlag = 1;
                            }
                        }
                    })
                }                
            },
            getCode(){ //获取验证码
                if(this.userid==''||this.username==''||this.usercode==''||this.usercodes==''||this.usermail=='')
                {
                    this.errorFlag = 1;
                    this.errorMsg = '请填写全部的信息后获取验证码';
                }
                else if(this.usercode!=this.usercodes)
                {
                    this.errorFlag = 1;
                    this.errorMsg = '两次密码输入不一致';
                }
                else{
                    var thisvue = this;
                    thisvue.btnGetCode = 1; //把获取验证码按钮禁用
                    var timer1 = setInterval(function(){thisvue.clock=thisvue.clock-1;},1000);
                    setTimeout(function(){
                        clearInterval(timer1);
                        thisvue.btnGetCode=0;
                        thisvue.clock=60;
                    },60000);
                    //发送邮件
                    $.ajax({
                        type:'POST',
                        url:'../server/mail/sendMail.php',
                        async:false,
                        data:{
                            address:thisvue.usermail                        },
                        success:function(res)
                        {
                            if(res.code==1)
                            {
                                thisvue.errorFlag = 1;
                                thisvue.errorMsg = '我们发送了一封邮件到你的邮箱，请尽快验证' 
                            }
                        }
                    })
                }
            },
            verifyCode(){ //验证验证码
                var thisvue =this;
                if(thisvue.code>100000&&thisvue.code<999999)
                {
                    $.ajax({
                        type:'POST',
                        url:'../server/mail/verifyCode.php',
                        data:{code:thisvue.code},
                        success:function(res)
                        {
                            if(res.code=='1')
                            {
                                thisvue.testcode=1;
                            }
                            else{
                                thisvue.errorFlag=1;
                                thisvue.errorMsg='验证码不正确，请重新输入';
                                return 0;
                            }
                        }
                    })
                }
            },
            testmailFunc(){
                var thisvue = this;
                if(this.usermail!=''&&this.usermail.indexOf('@')!='')
                {
                    $.ajax({
                        type:'POST',
                        url:'../server/testmail.php',
                        data:{
                            user_mail:thisvue.usermail                        },
                        success:function(res){
                            if(res.code==1)
                            {
                                thisvue.testmail = true;
                                thisvue.errorFlag = 0;
                            }
                            else{
                                thisvue.testmail = false;
                                thisvue.errorFlag = 1;
                                thisvue.errorMsg = '此邮箱已被注册,换个邮箱试试吧';
                            }
                        }
                    })
                }
            }
        }
    })})
<?php
session_start();
	header('Content-Type:application/json; charset=utf-8');
	$myid = $_POST[userid];
	$mycode = md5($_POST[usercode]);
	$myname = $_POST[username];
	$mymail = $_POST[usermail];
	$gm = 'vchenzhecom';
	$conn = new mysqli(47.106.190.129:3306, root, 52F7cbad94f2, personal);
	$test = SELECT * FROM user_login WHERE `user_id` = '$myid';
	$testResult = $conn->query($test);
	if(mysqli_num_rows($testResult)==0)
	{
		$path=/home/www/htdocs/carelesswhisper/src/img/.$myid; //判断目录存在否，存在给出提示，不存在则创建目录
		if (is_dir($path)){
			$result = ['code'=>'1','msg'=>'覆盖用户目录']; 
		}
		else{//第三个参数是“true”表示能创建多级目录，iconv防止中文目录乱码
			$res=mkdir(iconv(UTF-8, GBK, $path),0777,true); 
			$result = ['code'=>'1','msg'=>'注册成功'];
		}
		$conn->query( INSERT INTO user_login VALUES('$myid','$mycode','$myname','$mymail','imageFile/image.jpg','未填','未填','未填','未填','0') );
		$conn->query(INSERT INTO personal_follow VALUES('$gm','$myid',1,'2019',0));
		$conn->query(INSERT INTO personal_follow VALUES('$myid','$gm',1,'2019',0));
		$conn->close();
		
	}
	else{
		$result = ['code'=>'0','msg'=>'此用户名已被使用']; 
	}
	$_SESSION['code']='';
	echo json_encode($result);
	?>

推荐学习：《PHP教程》

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。

vuevue

相关推荐

SourceCodester Online Tours & Travels Management System pay.php sql injection
文章浏览阅读8.4k次，点赞8次，收藏7次。SourceCodester Online Tours & Travels Management System pay.php sql injectionLine 16 of pay.php invokes a SQL query built using unvalidated input. This call could allow an attacker to modify the statement’s meaning or to execute arbitrary SQL commands.SQL
Windows搭建Typecho个人博客并发布公网访问【内网穿透】
文章浏览阅读3.4k次，点赞46次，收藏51次。本文为大家介绍在windwos系统搭建typecho博客+cpolar内网穿透工具将博客发布到公共网络环境,实现远程也可以访问和操作。_windows搭建typecho
php从静态资源到动态内容
文章浏览阅读1.1k次。- php是最优秀, 最原生的模板语言, 替代语法,让php更加的优雅的与html生活在一起 -->请放心, 最终生成的,或者说用户最终看到的,仍然是一个html文档, php代码中的内容不会被泄漏的。-- 将php与html代码混编的时候,大括号很容易造成配对错误,最好杜绝它 -->php标签内部代码由php.exe解释, php标签之外的代码原样输出,仍由web服务器解析。-- 所以php的流程控制语句, 都提供了替代语法,用冒号代替大括号 -->php echo '百变鹏仔'?_利用php将静态页面修改为动态页面
Linux network namespace(网络命名空间)认知
文章浏览阅读1.1k次，点赞18次，收藏15次。整理K8s网络相关笔记博文内容涉及 Linux network namespace 认知以及彼此通信Demo，实际中的应用理解不足小伙伴帮忙指正不必太纠结于当下，也不必太忧虑未来，当你经历过一些事情的时候，眼前的风景已经和从前不一样了。——村上春树。_linux network namespace 多端通信 模式认知
Kubernetes基础(十一)-CNI网络插件用法和对比
文章浏览阅读1.2k次，点赞22次，收藏19次。此网络模型提供了一个逻辑二层（L2）网络，该网络封装在跨 Kubernetes 集群节点的现有三层（L3）网络拓扑上。使用此模型，可以为容器提供一个隔离的 L2 网络，而无需分发路由。封装网络带来了少量的处理开销以及由于覆盖封装生成 IP header 造成的 IP 包大小增加。封装信息由 Kubernetes worker 之间的 UDP 端口分发，交换如何访问 MAC 地址的网络控制平面信息。此类网络模型中常用的封装是 VXLAN、Internet 协议安全性 (IPSec) 和 IP-in-IP。_k8s网络组件对比
黑客技术（网络安全）自学2024
文章浏览阅读1.1k次，点赞14次，收藏19次。当我们谈论网络安全时，我们正在讨论的是保护我们的在线空间，这是我们所有人的共享责任。网络安全涉及保护我们的信息，防止被未经授权的人访问、披露、破坏或修改。
能够ping通某个网站，但是却不能访问
文章浏览阅读1.3w次，点赞3次，收藏7次。尽管您可以通过 ping 命令解析出网站的 IP 地址，但是可能在浏览器中访问时仍然遇到问题，这可能是因为浏览器使用的 DNS 解析结果不同于 ping 命令使用的解析结果。可能是因为您的网络或设备上设置了防火墙，阻止了对特定网站的访问。有些国家或组织可能会对特定的域名进行屏蔽，从而阻止访问相关网站。如果您的网络使用代理服务器进行访问控制，可能会由于代理服务器的配置问题导致无法访问某些网站。即使您的网络和设备一切正常，目标网站本身可能也存在问题，例如服务器故障、维护或过载，导致无法访问。_能ping通打不开网页
java/php/node.js/python基于web的小说浏览系统【2024年毕设】
文章浏览阅读839次，点赞22次，收藏19次。本系统带文档lw万字以上文末可领取本课题的JAVA源码参考。
基于微信小程序奶茶点餐外卖系统设计与实现(PHP后台+Mysql)可行性分析
文章浏览阅读2.1k次，点赞31次，收藏22次。基于微信小程序奶茶点餐外卖系统设计与实现(PHP后台+Mysql)可行性分析毕设源代码毕业设计，数据安全和系统稳定性以及团队能力和资源配备方面都具备较好的条件。因此，该项目的可行性较高。：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；微信小程序作为一种快捷、方便的移动应用形式，成为很多用户点餐外卖的首选。项目的界面和功能都可以定制，包安装运行！项目配有对应开发文档、开题报告、任务书、PPT、论文模版等。
PHP+Lucky+Baby母婴用品网站的设计与实现75554-计算机毕业设计项目选题推荐（赠源码）
文章浏览阅读1.8k次，点赞52次，收藏38次。本文主要通过对系统的前台系统和后台管理系统进行了功能性需求分析，对系统的安全性和可扩展性进行了非功能性需求分析。在详细的需求分析的基础上，根据系统的功能设计确定了数据库结构，实现完整的代码编写。Lucky+Baby母婴用品网站使用 Dreamweaver、HBuilder代码编辑器、Apache服务器等开发工具，完成了系统的主要模块的页面设计和功能实现。本文展示了首页页面的实现效果图，并通过代码和页面介绍了用户注册功能、商品搜索功能、生成订单和查看我的订单功能、在线付款功能功能的实现过程。
PHP人事信息管理系统 毕业设计 附源码45934
文章浏览阅读1.5k次，点赞45次，收藏40次。本设计主要实现集人性化、高效率、便捷等优点于一身的人事信息管理系统，完成首页、系统用户、通知公告、部门信息、员工薪资、考勤签到、员工请假、招聘信息、应聘信息等功能模块。
php初学者常见的几个错误及解决方法
文章浏览阅读1k次。该错误通常出现在数据库读取结果集数据时，比如当我们写好SQL语句从数据库读取数据时，本身应该返回结果集，再给结果集中读取数据。解决思路：这种错误一般是因为echo后面输出了一个数组导致的，或者是数组作为字符串进行拼接运算时导致的。该错误直译为：警告：mysqli_fetch_assoc函数期望参数1是mysqli的结果集，但是给了一个布尔值。这种错误是PHP解析器在解析时遇到了语法错误，直译为：解析错误:语法错误，意料之外的...该错误直译为：提示：未定义的索引：username。_array to string conversion in
http请求报错context deadline exceeded (Client.Timeout exceeded while awaiting headers)
文章浏览阅读2.7w次。解决http请求报错context deadline exceeded (Client.Timeout exceeded while awaiting headers)_context deadline exceeded (client.timeout exceeded while awaiting headers)
【复杂网络建模】——基于代理的社会网络建模（Agent-Based Modeling，ABM）[Python实现]
文章浏览阅读1.3k次，点赞26次，收藏24次。复杂网络是一种由大量相互连接的元素（节点或顶点）组成的网络结构，这些连接通常是非常复杂和动态的。这些网络可以在各种领域中发现，包括社交网络、生物学系统、信息技术和交通系统等。_代理建模
【文末送书】计算机网络编程 | epoll详解
文章浏览阅读2.6k次，点赞76次，收藏71次。epoll详解，事件模型，ET/LT模式，并通过三个示例进行代码实现。
如何检查代理和防火墙设置
文章浏览阅读3.3k次。罗拉ROLA-IP是一家来自纽约的代理IP提供商，由李嘉诚先生投资建设，韩国人工智能、自动驾驶、虚拟现实方面的领军企业World IT Show投资入股，由美国纽约大学IT管理教授团队研究开发，进入中国市场6年多，全世界设有多个分子公司。接下来，我们要检查代理和防火墙的设置，因为在绝大多数情况下，它们是导致这个错误的原因，尤其是当用户使用免费代理时。对网站的访问受阻实际上是一个非常常见的错误，它既可能是由于物理原因（硬件问题）造成的，也可能是由于软件错误引起的。检查代理设置，并确保其正确配置。_无法访问此网站,检查代理服务器和防火墙
java/php/node.js/python预约上门洗车系统【2024年毕设】
文章浏览阅读1.1k次，点赞14次，收藏20次。本系统带文档lw万字以上文末可领取本课题的JAVA源码参考。_php洗车服务预约管理系统php源码
分别用JavaScript，Java，PHP，C++实现桶排序的算法（附带源码）
文章浏览阅读1.1k次。桶排序是计数排序的升级版。它利用了函数的映射关系，高效与否的关键就在于这个映射函数的确定。同时，对于桶中元素的排序，选择何种比较排序算法对于性能的影响至关重要。
java/php/node.js/python基于Java宠物寄存管理系统【2024年毕设】
文章浏览阅读936次，点赞22次，收藏17次。本系统带文档lw万字以上文末可领取本课题的JAVA源码参考。
java/php/node.js/python闽科社团活动助手APP的设计与实现【2024年毕设】
文章浏览阅读822次，点赞15次，收藏14次。在整个设计过程中，要确定可能的具体解决方案，以实现每一个小的最终目标，对于每一个小目标，我们首先必须了解一些相关的需求分析信息。除了以上作品下面是2023-2024年最新100套计算机专业原创的毕业设计源码+数据库，是近期作品，如果你的题目刚好在下面可以文末领取java源码参考。springboot基于springboot的在线考试系统。springboot基于springboot的商城购物系统。springboot基于微信小程序的智慧校园设计与实现。springboot基于用户的协同过滤算法的话题推荐。
pythonJavaScriptjavaHTMLPHPreactjsC#AndroidCSSNode.jssqlrpython-3.xMysqLjQueryc++pandasFlutterangularIOSdjangolinuxswifttypescript路由器JSON路由器设置无线路由器h3c华三华三路由器设置华三路由器电脑软件教程arraysdocker软件图文教程Cvue.jslaravelspring-boot