PHPとUniAppを使ってデータの閲覧履歴機能を実装する方法

PHP と UniApp を使用してデータの閲覧履歴機能を実装する方法

はじめに:
モバイル インターネットの急速な発展に伴い、ますます多くのアプリケーションが登場しています。ユーザーにとって閲覧履歴機能は重要かつ便利な機能となっています。この記事では、開発者がユーザーのニーズをより適切に満たせるように、PHP と UniApp を使用してデータの閲覧履歴機能を実装する方法を紹介します。

1. 概要
閲覧履歴機能は、ユーザーがアプリ内で閲覧したデータを記録する機能です。閲覧履歴を表示することで、ユーザーは以前に閲覧したデータを簡単に確認し、興味のあるコンテンツをすぐに見つけることができます。閲覧履歴機能を実装するには、ユーザーの閲覧履歴を保存して表示することがポイントです。

2. PHP を使用して閲覧履歴データを保存する
PHP は Web 開発で広く使用されているスクリプト言語で、データベースと対話し、データの追加、削除、変更、確認などの操作を実行できます。閲覧履歴機能の実装では、PHPを使用してユーザーの閲覧履歴をデータベースに保存できます。

1. データベース テーブルの作成
   まず、閲覧履歴データを保存するデータベース テーブルを作成する必要があります。テーブル構造は実際のニーズに応じて設計でき、通常は次のフィールドが含まれます:

id: 一意の識別子
user_id: ユーザーを閲覧履歴に関連付けるために使用されるユーザー ID
data_id: 閲覧データ ID
timestamp: 閲覧タイムスタンプ
閲覧履歴テーブルを作成する SQL 文の例:

CREATE TABLE browse_history (
id int(11) NOT NULL AUTO_INCREMENT,
user_id int(11) NOT NULL,
data_id int(11) NOT NULL,
タイムスタンプ int(11) NOT NULL,
主キー (id)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

#閲覧履歴の追加
2. ユーザーが特定のデータを閲覧するとき、その閲覧記録をデータベースに追加する必要があります。 PHP の MySQLi 拡張機能を使用してデータベースに接続し、挿入操作を実行できます。サンプル コードは次のとおりです。
   

//データベースに接続します
$mysqli = new mysqli("localhost", "username", "password", "database");

// 接続が成功したかどうかを確認します

if ($mysqli -> connect_errno) {
echo "MySQL への接続に失敗しました: " . $mysqli -> connect_error;
exit( );
}
// ユーザーIDと閲覧データを取得 ID

$user_id = $_POST["user_id"];
$data_id = $ _POST["data_id"];

// 現在のタイムスタンプを取得します

$timestamp = time();

// 閲覧履歴を挿入します

$stmt = $mysqli -> ; prepare("Browse_history (user_id, data_id, timestamp) VALUES (?, ?, ?)");
$stmt ->bind_param("iii", $user_id, $data_id, $timestamp);
$stmt ->execute();
$stmt ->close();

// データベース接続を閉じます

$mysqli ->close();
?>

3. UniApp を使用して閲覧履歴データを表示する

UniApp は、マルチターミナル アプリケーションを迅速に開発するために使用できる、Vue.js に基づくクロスプラットフォーム開発フレームワークです。閲覧履歴機能の実装では、UniAppを利用してユーザーの閲覧履歴を表示することができます。

uni-request プラグインをインストールする
1. まず、HTTP リクエストを送信するための UniApp のプラグインである uni-request プラグインをインストールする必要があります。 UniApp 公式プラグイン マーケットで uni-request を検索してインストールできます。
   
閲覧履歴データの取得
2. 閲覧履歴データを表示する前に、サーバーから閲覧履歴データを取得する必要があります。 uni-request を使用して HTTP リクエストを送信し、返されたデータを Vue インスタンスのデータに保存できます。
   

サンプル コードは次のとおりです。

export default {

data() {

return {
  historyList: []  // 存储浏览历史数据
}

},

Mounted() {

this.getHistoryList();

},

メソッド: {

getHistoryList() {
  uni.request({
    url: 'http://localhost/get_history_list.php',  // 替换为服务器端接口地址
    method: 'GET',
    success: res => {
      this.historyList = res.data;  // 将返回的数据保存到historyList中
    },
    fail: error => {
      console.error(error);
    }
  });
}

}

}

閲覧履歴データの表示
3. 最後に、uni-for を使用できます。 HistoryList をループして、ページ上の各閲覧履歴データを表示する命令。
   

サンプル コードは次のとおりです。