thinkphp quickly implements a like function based on Ajax-ThinkPHP-php.cn

thinkphp quickly implements a like function based on Ajax

PHPz

Release： 2023-04-10 09:28:58

Original

707 people have browsed it

With the rapid development of the Internet, the user experience of Web applications has become an increasingly important factor. Using Ajax technology to implement the like function is a common way. This article will introduce how to use the ThinkPHP framework to quickly implement an Ajax-based like function.

1. Development environment preparation

This article uses the ThinkPHP5.1 framework. You need to install PHP5.5 or above and a MySQL database, and ensure that the environment can run ThinkPHP.

2. Create database table

Create the following table in MySQL:

CREATE TABLE `likes` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `content_id` int(11) NOT NULL COMMENT '点赞的文章id',
  `user_id` int(11) NOT NULL COMMENT '点赞的用户id',
  `created_time` int(11) NOT NULL DEFAULT '0' COMMENT '点赞时间戳',
  `updated_time` int(11) NOT NULL DEFAULT '0' COMMENT '更新时间戳',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

Copy after login

3. Controller layer

Create a LikesController.php controller, use The following code obtains the Ajax request:

namespace app\index\controller;

use think\Controller;
use think\Db;

class LikesController extends Controller
{
    public function like()
    {
        $content_id = input('post.content_id');
        $user_id = input('post.user_id');
        $created_time = time();
        $updated_time = time();
        $data = [
            'content_id' => $content_id,
            'user_id' => $user_id,
            'created_time' => $created_time,
            'updated_time' => $updated_time,
        ];
        $result = Db::name('likes')->insert($data);
        if ($result) {
            return json(['code' => 200, 'msg' => '点赞成功']);
        } else {
            return json(['code' => 500, 'msg' => '点赞失败']);
        }
    }
}

Copy after login

4. View layer

Create an index.html front-end page, use jQuery to monitor user click events, and send Ajax requests to the server:

<!DOCTYPE html>
<html>
<head>
    <title>点赞</title>
    <meta charset="utf-8">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
    <div id="like_button" data-content-id="1" data-user-id="1">点赞</div>
</body>
<script type="text/javascript">
    $(document).ready(function () {
        $('#like_button').click(function () {
            var content_id = $(this).data('content-id');
            var user_id = $(this).data('user-id');
            $.ajax({
                url: "/LikesController/like",
                type: "POST",
                dataType: "json",
                data: {"content_id": content_id, "user_id": user_id},
                success: function (data) {
                    if (data.code == 200) {
                        alert(data.msg);
                    } else {
                        alert(data.msg);
                    }
                }
            });
        });
    });
</script>
</html>

Copy after login

5. Routing settings

Add a route in the routing file (route.php):

Route::post('/LikesController/like', 'index/LikesController/like');

Copy after login

6. Test

Start the server and visit http://localhost/ index/index/index, click Like to test this function. Check whether records are added in the likes table in MySQL to ensure that the likes are successful.

7. Summary

By using the ThinkPHP framework and jQuery technology, an Ajax-based like function is implemented. This feature can improve the user experience of web applications and enhance the interaction between users and web applications.

The above is the detailed content of thinkphp quickly implements a like function based on Ajax. For more information, please follow other related articles on the PHP Chinese website!