PHPとVueで決済後のメンバーシップポイントの有効期限を管理する方法のチュートリアル

M66 2025-10-30

PHPとVueで決済後の会員ポイントの有効期限管理を実現

会員ポイントの有効期限設定は、多くの電子商取引システムや会員システムにおいて共通の機能である。通常、販売業者はユーザーの支払い後に一定数のポイントを付与しますが、これらのポイントは永久的なものではなく、特定の期間内に使用する必要があります。この記事では、ポイントの有効期限管理機能をPHPとVueで実装する方法を紹介します。

プロジェクトの構造

この例では、バックエンド言語として PHP、フロントエンドフレームワークとして Vue、データベースとして MySQL を使用します。このテクノロジーの組み合わせにより、バックエンドの安定性が保証されるだけでなく、柔軟で効率的なフロントエンドのインタラクティブエクスペリエンスも提供されます。

データベース設計

ポイント情報を保存するには、データベースにデータテーブルを作成する必要があります。テーブル構造の例は次のとおりです。

user_id: ユーザー ID。異なるユーザーを区別するために使用されます。
ポイント: ポイント数;
expire_date: ポイントの有効期限。

バックエンドロジックの実装 (PHP)

バックエンド部分では、フロントエンドから渡されたユーザー情報とポイント数を受け取るPHPファイルを記述し、ポイントの有効期限を計算します。

<?php
// データベースに接続する
$servername = "localhost";
$username = "your_username";
$password = "your_password";
$dbname = "your_database";

$conn = new mysqli($servername, $username, $password, $dbname);

// 接続が成功したかどうかを確認する
if ($conn->接続エラー) {
    die("接続に失敗しました: " . $conn->connect_error);
}

// フロントエンドからクロスされたパラメータをによるけ選ぶる $user_id = $_POST[&#39;user_id&#39;];
$ポイント = $_POST[&#39;ポイント&#39;];

// ポイントの有効期限を計算するします。ここでは30日とします $now = date(&#39;Ym-d&#39;);
$expire_date = date(&#39;Ym-d&#39;, strtotime($now . &#39; + 30 days&#39;));

// データベースにデータを挿入 $sql = "INSERT INTO Points (user_id, Points, Expire_date) VALUES (&#39;$user_id&#39;, &#39;$points&#39;, &#39;$expire_date&#39;)";

if ($conn->query($sql) === TRUE) {
    echo "ポイントは普通に設定されました";
} それ以外 {
    echo "エラー: " 。 $sql 。 」<br> " . $conn->エラー;
}

$conn->close();
?>

フロントエンドページ開発 (Vue)

フロントエンド部分では、管理者またはシステムがユーザー ID とポイント数を入力し、データをバックエンドに送信できるようにする Vue コンポーネントを作成します。

<template>
  <div>
    <input type="text" v-model="user_id" placeholder="ユーザーを入力してくださいID" />
    <input type="text" v-model="points" placeholder="ポイント数を入力してください" />
    <button @click="setPoints">設定値</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      user_id: "",
      points: ""
    };
  },
  methods: {
    setPoints() {
      axios
        .post("points.php", {
          user_id: this.user_id,
          points: this.points
        })
        .then(function(response) {
          console.log(response.data);
        })
        .catch(function(error) {
          console.log(error);
        });
    }
  }
};
</script>

プロジェクトで axios を使用する場合、依存関係がエントリファイルにインストールされ、インポートされていることを確認する必要があります。

 「vue」から Vue をインポートします。
「./App.vue」からアプリをインポートします。
「axios」から axios をインポートします。

Vue.prototype.$http = axios;

newVue({
  レンダリング: h => h(アプリ)
}).$mount("#app");

要約する

PHPとVueを組み合わせることで、決済後のポイント有効期限管理機能を簡単に実装できます。この記事の例はビジネスロジックの一部を簡略化していますが、完全な実装アイデアを示しています。実際のプロジェクトでは、ポイントの清掃タスク、セキュリティ検証、より複雑なポイント計算ルールの追加など、さらに拡張して、より完全な会員ポイントシステムを作成できます。