PHP实现微信小程序的注册功能

PHP实现微信小程序的注册功能

接着上一个登陆，我们这次来实现一个注册功能，废话不多说直接上代码，简单易懂。

.wxml

<form bindsubmit="regs">
  <view style="float:left;margin-left:15rpx">账号:</view>
  <input style="border:1px solid #ccc" type="text" placeholder="请输入账号" name="username"></input>
  <view style="float:left;margin-left:15rpx">密码:</view>
  <input style="border:1px solid #ccc" type="password" placeholder="请输入密码" name="password"></input>
  <view style="float:left;margin-left:15rpx">确认密码:</view>
  <input style="border:1px solid #ccc" type="password" placeholder="请输入密码" name="upassword"></input>
  <view style="margin-left:15rpx">用户头像</view>
  <!--图片预览 -->
  <view>
    <image src='{{img_l}}' style="width:300rpx;height:300rpx;float:left" bindtap='preview_img'></image>
  </view>
  <!--图片选择 -->
  <view>
    <image src="../../image/1.jpg" style="width:300rpx;height:300rpx;" bindtap='chooseImg'></image>
  </view>
  <button form-type="submit">注册</button>
</form>

我的.wxml代码用了一张图片，你们可以直接复制下方图片粘贴到文件里

接下来就是.js了不会的可以去参考一下微信开发手册

.js

Page({
  data: {
    img_l: ''
  },
  regs: function(e) {
    if ((e.detail.value.username != "") && (e.detail.value.password != "") && (e.detail.value.upassword != "") && (this.data.img_l != "")) {
      if (e.detail.value.password == e.detail.value.upassword) {
        wx.showToast({
          title: '注册成功',
          icon: 'none',
        })
        wx.request({
          url: 'http://127.0.0.1/regs.php', //本地PHP地址
          method: "POST",
          header: {
            "content-type": "application/x-www-form-urlencoded"
          },
          data: {
            "uname": e.detail.value.username,
            "upwd": e.detail.value.password,
            "imgs": this.data.img_l
          },
          success(res) {
            wx.redirectTo({
              url: '/pages/index/index'
            })
          }
        })
        // 上传图片
        var _this = this;
        wx.uploadFile({
          url: 'http://127.0.0.1/regs.php', //接口
          filePath: _this.data.img_l[0],
          name: 'file',
          formData: {
            'user': 'test'
          },
          success: function(res) {
            // console.log(res.data);
          },
          fail: function(error) {
            console.log(error);
          }
        })
      } else {
        wx.showToast({
          title: '输入密码不一致',
          icon: 'none'
        })
        return false;
      }
    } else {
      wx.showToast({
        title: '选项不能为空',
        icon: 'none'
      })
      return false;
    }
    console.log('账号', e.detail.value.username)
    console.log('密码', e.detail.value.password)
    console.log('确认密码', e.detail.value.upassword)
    console.log('图片地址', this.data.img_l)
  },
  //选择图片 预览图片
  chooseImg: function() {
    var _this = this;
    wx.chooseImage({
      count: 1, // 默认9
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
      success: function(res) {
        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
        var tempFilePaths = res.tempFilePaths;
        _this.setData({
          img_l: res.tempFilePaths
        })
        console.log(res)
      }
    })
  },
  preview_img: function() {
    wx.previewImage({
      current: this.data.img_l, // 当前显示图片的http链接
      urls: this.data.img_l // 需要预览的图片http链接列表
    })
  }
})

代码比较多没有进行封装，粘贴直接就能用,接下来就是PHP文件了

.php

<?php
header('content-type:text/html;charset=utf-8');
session_start();
try{
$link = new PDO('mysql:host=localhost;port=3306;dbname=wt_kp5b','root','root');
$link->setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION);
}catch(PDOException $e){
die('数据库连接出错:'.$e->getMessage());
}
//查询用户是否存在
$sqli = 'select * from wt_regs where uname=?';
try{
$stmt = $link->prepare($sqli);
$stmt->execute([$_GET['uname']]);
if($stmt->rowCount()>0){
	echo "用户已存在";
	return FALSE;
}else{
//上传图片
date_default_timezone_set("Asia/Shanghai"); //设置时区
$code = $_FILES['file'];//获取图片
if(is_uploaded_file($_FILES['file']['tmp_name'])) {  
    //文件目录  
    $uploaded_file=$_FILES['file']['tmp_name'];  
    $username = "img_l";
    //动态创建文件夹  
    $user_path=$username;  
    //判断文件夹是否存在 
    if(!file_exists($user_path)) {   
        mkdir($user_path,0777,true); 
    }  
    $file_true_name=$_FILES['file']['name'];  
    $move_to_file=$user_path."/".time().rand(1,1000)."-".date("Y-m-d").substr($file_true_name,strrpos($file_true_name,"."));
    if(move_uploaded_file($uploaded_file,iconv("utf-8","gb2312",$move_to_file))) {
        echo '上传成功';
    } else {  
        echo "上传失败"; 
    }  
	} else {  
	    echo "上传失败";  
	}
	//进行注册	
	$sql = 'insert into wt_regs(uname,upwd,imgs) values(?,?,?)';
	try{
	$stmt = $link->prepare($sql);
	$_POST['imgs'] = "img_l"."/".time().rand(1,1000)."-".date("Y-m-d").substr($_POST['imgs'],strrpos($_POST['imgs'],".").iconv("utf-8","gb2312",$_POST['imgs']));
	$stmt->execute([$_POST['uname'],$_POST['upwd'],$_POST['imgs']]);
	echo "注册成功";
	}catch(PDOException $e){
	die($e->getMessage());}}
	}catch(PDOException $e){
	die($e->getMessage());}
?>

代码可以直接复制到本地测试，有什么问题欢迎评论留言，我会及时回复你的。