How to implement user login verification using PHP and UniApp

How to implement user login verification using PHP and UniApp

Introduction:
User login verification is a very important function when developing an App or website. This article will introduce how to use PHP and UniApp to implement user login verification.

1. Back-end part: PHP code

1. Create database
   First, we need to create a database to store the user's login information. You can use phpMyAdmin or other database management tools to create a database named "users" and create a data table named "users" containing two fields: "username" and "password".
2. Create PHP file
   On the server side, we need to create a PHP file to handle user login requests and verify user information. You can use the following code:

<?php
   // 连接数据库
   $conn = mysqli_connect("localhost", "root", "", "users");

   // 获取用户输入的用户名和密码
   $username = $_POST['username'];
   $password = $_POST['password'];

   // 查询数据库中是否存在匹配的记录
   $result = mysqli_query($conn, "SELECT * FROM users WHERE username='$username' AND password='$password'");

   // 判断是否存在匹配的记录
   if(mysqli_num_rows($result) > 0){
      echo "登录成功";
   } else{
      echo "登录失败";
   }

   // 关闭数据库连接
   mysqli_close($conn);
?>

2. Front-end part: UniApp code

1. Create login page
   In UniApp, we can use Vue.js to create login page. You can create a Login.vue file in the pages directory, containing input boxes for username and password, and a login button. The following is a sample code:

<template>
  <div>
    <input v-model="username" type="text" placeholder="请输入用户名" />
    <input v-model="password" type="password" placeholder="请输入密码" />
    <button @click="login">登录</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      password: ''
    };
  },
  methods: {
    login() {
      uni.request({
        url: 'http://localhost/login.php',
        method: 'POST',
        data: {
          username: this.username,
          password: this.password
        },
        success: res => {
          if (res.data === '登录成功') {
            uni.showToast({
              title: '登录成功',
              icon: 'success'
            });
          } else {
            uni.showToast({
              title: '登录失败',
              icon: 'none'
            });
          }
        },
        fail: err => {
          console.log(err);
        }
      });
    }
  }
};
</script>

2. Send login request
   In the login button click event on the login page, we use the uni.request function to send a login request to the server. The following is a sample code:

uni.request({
  url: 'http://localhost/login.php',
  method: 'POST',
  data: {
    username: this.username,
    password: this.password
  },
  success: res => {
    if (res.data === '登录成功') {
      uni.showToast({
        title: '登录成功',
        icon: 'success'
      });
    } else {
      uni.showToast({
        title: '登录失败',
        icon: 'none'
      });
    }
  },
  fail: err => {
    console.log(err);
  }
});

So far, we have implemented the user login verification method through PHP and UniApp. When the user enters the username and password in UniApp and clicks the login button, UniApp will send a login request to the server. The server verifies the user information through PHP code and returns the login result to UniApp for processing.

Summary:
This article introduces the method of using PHP and UniApp to implement user login verification. Through the above steps, we can implement the user login function in UniApp and realize data interaction with the back-end server to achieve the effect of user login verification. Hope this article is helpful to you!

The above is the detailed content of How to implement user login verification using PHP and UniApp. For more information, please follow other related articles on the PHP Chinese website!