Développement PHP et Vue : Comment obtenir des points de membre en s'enregistrant tous les jours

WBOY
Libérer: 2023-09-24 10:20:01
original
1221 Les gens l'ont consulté

Développement PHP et Vue : Comment obtenir des points de membre en senregistrant tous les jours

Développé avec PHP et Vue : La réalisation de points de membre peut être obtenue par enregistrement quotidien

Introduction :
Le système de points est l'une des fonctions courantes dans de nombreux sites Web ou applications, et la connexion et l'obtention quotidiennes des membres les points peuvent augmenter l'activité de l'utilisateur et des moyens efficaces d'adhérence. Dans cet article, nous utiliserons PHP et Vue comme outils de développement pour vous apprendre à implémenter un module fonctionnel permettant aux membres de s'enregistrer tous les jours et de gagner des points. Nous vous fournirons des exemples de code spécifiques que vous pourrez référencer et dont vous pourrez tirer des leçons.

Préparation :
Avant de commencer, vous devez vous assurer que vous disposez des outils et dépendances suivants dans votre environnement de développement :

  1. Environnement de développement PHP, tel que WAMP, XAMPP, etc.
  2. Environnement de développement et configuration de Vue.js, vous pouvez utiliser Vue CLI pour créer rapidement un projet Vue.
  3. Base de données, nous utiliserons MySQL comme exemple.

Étape 1 : Créer une base de données et un tableau de données
Tout d'abord, nous devons créer une base de données pour stocker les informations sur les membres et les enregistrements de points. Vous pouvez utiliser l'instruction SQL suivante pour créer une base de données nommée « membres » dans MySQL et créer une table de données nommée « sign_in_records ».

CREATE DATABASE members;

USE members;

CREATE TABLE sign_in_records (
  id INT AUTO_INCREMENT PRIMARY KEY,
  member_id INT,
  sign_in_date DATE,
  UNIQUE KEY unique_member_date (member_id, sign_in_date)
);
Copier après la connexion

Cette table de données contient les champs suivants :

  • id : En tant que clé primaire, incrémentation automatique.
  • member_id : ID de membre, utilisé pour associer les membres dans la table des membres.
  • sign_in_date : Date de connexion, utilisée pour enregistrer la date de chaque connexion. Nous avons également ajouté une clé unique à la combinaison (member_id, sign_in_date) pour garantir que chaque membre ne peut se connecter qu'une fois par jour.

Étape 2 : Créer une interface PHP
Ensuite, nous devons créer une interface PHP pour gérer les requêtes envoyées par la page Vue frontale. Cette interface sera chargée de vérifier les membres et d’enregistrer les informations d’enregistrement.

  1. Créez un fichier nommé "signin.php" et ajoutez le code suivant au fichier :
<?php
// 连接数据库
$conn = new mysqli("localhost", "root", "root", "members");

// 检查连接是否成功
if ($conn->connect_error) {
    die("连接失败: " . $conn->connect_error);
}

// 获取请求中的会员ID
$memberId = $_GET["memberId"];

// 获取当前日期
$currentDate = date("Y-m-d");

// 查询该会员今天是否已签到
$sql = "SELECT * FROM sign_in_records WHERE member_id = $memberId AND sign_in_date = '$currentDate'";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // 该会员今天已签到
    echo json_encode(["status" => "fail", "message" => "今天已签到"]);
} else {
    // 记录会员签到
    $insertSql = "INSERT INTO sign_in_records (member_id, sign_in_date) VALUES ($memberId, '$currentDate')";
    if ($conn->query($insertSql) === TRUE) {
        echo json_encode(["status" => "success", "message" => "签到成功"]);
    } else {
        echo json_encode(["status" => "fail", "message" => "签到失败"]);
    }
}

// 关闭数据库连接
$conn->close();
?>
Copier après la connexion

Ce code se connecte d'abord à la base de données nommée "members" et obtient les membres envoyés par l'ID de la page Vue frontale. Il vérifie ensuite si l'enregistrement d'enregistrement du membre pour ce jour existe déjà dans la base de données. Si elle existe, une réponse JSON sera renvoyée, indiquant que vous vous êtes enregistré aujourd'hui ; si elle n'existe pas, les informations d'enregistrement seront enregistrées et la réponse JSON correspondante sera renvoyée.

  1. Placez ce fichier dans le répertoire approprié de votre serveur PHP en vous assurant qu'il est accessible via l'URL.

Étape 3 : Créer une page Vue
Enfin, nous créerons une page Vue pour afficher la fonction de connexion des membres et interagir avec l'interface PHP back-end.

  1. Dans votre projet Vue, ouvrez le fichier App.vue et supprimez-y le code par défaut. Ensuite, ajoutez le code suivant au fichier :
<template>
  <div>
    <h1>会员签到</h1>
    <button @click="signIn">签到</button>
    <p>{{ status }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      memberId: 123, // 设置您的会员ID
      status: "",
    };
  },
  methods: {
    signIn() {
      // 发送签到请求到后端接口
      fetch(`http://localhost/signin.php?memberId=${this.memberId}`)
        .then((response) => response.json())
        .then((data) => {
          this.status = data.message;
        })
        .catch((error) => {
          this.status = "签到失败";
          console.error(error);
        });
    },
  },
};
</script>
Copier après la connexion

Cette page Vue affiche simplement un titre, un bouton d'enregistrement et un message d'état. Lorsque l'utilisateur clique sur le bouton d'enregistrement, il enverra une requête GET à l'interface PHP backend et mettra à jour les informations d'état sur la page en fonction de la réponse JSON renvoyée par l'interface.

  1. Enregistrez le fichier et exécutez le projet Vue dans le navigateur, et vous verrez la page de la fonction d'enregistrement.

Conclusion :
En combinant le développement de PHP et Vue, nous avons implémenté un module fonctionnel permettant aux membres de se connecter chaque jour pour gagner des points. Dans cet exemple, nous avons créé une base de données et une table de données pour stocker les informations sur les membres et les enregistrements d'enregistrement, utilisé PHP pour écrire une interface permettant de gérer les demandes d'enregistrement, affiché la fonction d'enregistrement via la page Vue et interagi avec l'arrière-plan. -interface de fin. J'espère que cet exemple pourra vous aider à mieux comprendre et utiliser PHP et Vue pour développer la fonction d'enregistrement dans le système de points.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal