基于Django框架利用Ajax實(shí)現(xiàn)點(diǎn)贊功能實(shí)例代碼
概要:
要實(shí)現(xiàn)點(diǎn)贊功能,需要實(shí)現(xiàn)的有:誰(shuí)進(jìn)行的點(diǎn)贊、什么時(shí)候進(jìn)行點(diǎn)贊、點(diǎn)贊的對(duì)象是誰(shuí)、每一個(gè)對(duì)象的點(diǎn)贊數(shù)量是多少、點(diǎn)贊過(guò)后還需要能夠取消點(diǎn)贊,為了是點(diǎn)贊后的信息能夠及時(shí)的顯示在前端頁(yè)面,就需要使用Ajax來(lái)異步請(qǐng)求數(shù)據(jù),實(shí)現(xiàn)實(shí)時(shí)顯示。
下面話不多說(shuō)了,來(lái)隨著小編一起看看詳細(xì)的介紹吧
模型分析:
創(chuàng)建的模型需要記錄的數(shù)據(jù)有:點(diǎn)贊者、點(diǎn)贊對(duì)象、點(diǎn)贊時(shí)間、點(diǎn)贊的數(shù)量,由于前面三個(gè)屬性主要用于記錄點(diǎn)贊的狀態(tài),而點(diǎn)贊數(shù)量主要用于記錄某篇文章的點(diǎn)贊數(shù)量,所以這里最好把點(diǎn)贊數(shù)量單獨(dú)放在一個(gè)模型中。這里就創(chuàng)建了兩個(gè)模型,LikeRecord和LIkeCount,LikeRecord用于記錄點(diǎn)贊狀態(tài),LIkeCount用于記錄點(diǎn)贊的數(shù)量。大致的思路圖:

代碼:
from django.db import models
from django.contrib.contenttypes.fields import GenericForeignKey
from django.contrib.contenttypes.models import ContentType
from django.contrib.auth.models import User
# Create your models here.
# 用于記錄點(diǎn)贊數(shù)量的模型
class LikeCount(models.Model):
content_type = models.ForeignKey(ContentType, on_delete=models.DO_NOTHING)
object_id = models.PositiveIntegerField()
content_object = GenericForeignKey('content_type', 'object_id')
# 用于記錄點(diǎn)贊數(shù)量的字段
like_num = models.IntegerField(default=0)
# 用于記錄點(diǎn)贊狀態(tài)的模型
class LikeRecord(models.Model):
content_type=models.ForeignKey(ContentType, on_delete=models.DO_NOTHING)
object_id=models.PositiveIntegerField()
content_object=GenericForeignKey('content_type', 'object_id')
# 記錄點(diǎn)贊的用戶
like_user = models.ForeignKey(User, on_delete=models.DO_NOTHING)
# 記錄點(diǎn)贊的時(shí)間
like_time = models.DateTimeField(auto_now_add=True)
視圖函數(shù):
視圖函數(shù)主要的作用就是接受前端通過(guò)Ajax發(fā)送回來(lái)的數(shù)據(jù),并且對(duì)數(shù)據(jù)進(jìn)行判斷處理,然后對(duì)前面的兩個(gè)模型進(jìn)行實(shí)例化操作已經(jīng)數(shù)據(jù)變更操作,當(dāng)數(shù)據(jù)成功過(guò)后返回處理后的結(jié)果,當(dāng)數(shù)據(jù)存在錯(cuò)誤時(shí),返回相應(yīng)的提示信息。
代碼:
from django.shortcuts import render, HttpResponseRedirect
from django.contrib.contenttypes.models import ContentType
from django.http import JsonResponse
from .models import LikeCount, LikeRecord
# Create your views here.
# 數(shù)據(jù)操作成功返回?cái)?shù)據(jù)方法
def success_response(like_num):
data = {}
data['status'] = 'SUCCESS'
data['like_num'] = like_num
return JsonResponse(data)
# 數(shù)據(jù)操作失敗返回信息的方法
def error_response(message):
data = {}
data['status'] = 'ERROR'
data['message'] = message
return JsonResponse(data)
def like_up(request):
# 得到GET中的數(shù)據(jù)以及當(dāng)前用戶
user = request.user
# 判斷用戶是否登錄
if not user.is_authenticated:
return error_response('未登錄,不能進(jìn)行點(diǎn)贊操作')
content_type = request.GET.get('content_type')
content_type = ContentType.objects.get(model=content_type)
object_id = request.GET.get('object_id')
is_like = request.GET.get('is_like')
# 創(chuàng)建一個(gè)點(diǎn)贊記錄
if is_like == 'true':
# 進(jìn)行點(diǎn)贊,即實(shí)例化一個(gè)點(diǎn)贊記錄
like_record, created = LikeRecord.objects.get_or_create(content_type=content_type, object_id=object_id, like_user=user)
# 通過(guò)created來(lái)判斷點(diǎn)贊記錄是否存在,如果存在則不進(jìn)行點(diǎn)贊,如果不存在則進(jìn)行點(diǎn)贊數(shù)量加一
if created:
# 不存在點(diǎn)贊記錄并且已經(jīng)創(chuàng)建點(diǎn)贊記錄,需要將點(diǎn)贊數(shù)量加一
like_count, created = LikeCount.objects.get_or_create(content_type=content_type, object_id=object_id)
like_count.like_num += 1
like_count.save()
return success_response(like_count.like_num)
else:
# 已經(jīng)進(jìn)行過(guò)點(diǎn)贊
return error_response('已經(jīng)點(diǎn)贊過(guò)')
else:
# 取消點(diǎn)贊
# 先查詢數(shù)據(jù)是否存在,存在則進(jìn)行取消點(diǎn)贊
if LikeRecord.objects.filter(content_type=content_type, object_id=object_id, like_user=user).exists():
# 數(shù)據(jù)存在,取消點(diǎn)贊
# 刪除點(diǎn)贊記錄
LikeRecord.objects.get(content_type=content_type, object_id=object_id, like_user=user).delete()
# 判斷對(duì)應(yīng)的點(diǎn)贊數(shù)量數(shù)據(jù)是否存在,如果存在則對(duì)點(diǎn)贊數(shù)量進(jìn)行減一
like_count, create = LikeCount.objects.get_or_create(content_type=content_type, object_id=object_id)
if create:
# 數(shù)據(jù)不存在,返回錯(cuò)誤信息
return error_response('數(shù)據(jù)不存在,不能取消點(diǎn)贊')
else:
# 數(shù)據(jù)存在,對(duì)數(shù)量進(jìn)行減一
like_count.like_num -= 1
like_count.save()
return success_response(like_count.like_num)
else:
# 數(shù)據(jù)不存在,不能取消點(diǎn)贊
return error_response('數(shù)據(jù)不存在,不能取消點(diǎn)贊')
Ajax代碼:
該段代碼的主要作用:通過(guò)前端按鈕觸動(dòng)相應(yīng)的處理函數(shù),將當(dāng)前的數(shù)據(jù)傳遞給后端,后端接受數(shù)據(jù)后進(jìn)行處理,處理完后的數(shù)據(jù)再返回給前端,通過(guò)Ajax實(shí)時(shí)顯示到前端。
代碼:
<script type="text/javascript">
function change_like(obj, content_type, object_id) {
// 判斷obj中是否包含active的元素,用于判斷當(dāng)前狀態(tài)是否為激活狀態(tài)
var is_like = obj.getElementsByClassName('active').length == 0
$.ajax({
url: '/like_up/',
// 為了避免加入csrf_token令牌,所以使用GET請(qǐng)求
type: 'GET',
// 返回的數(shù)據(jù)用于創(chuàng)建一個(gè)點(diǎn)贊記錄
data: {
content_type: content_type,
object_id: object_id,
is_like: is_like,
},
cache: false,
success: function (data) {
console.log(data);
if (data['status'] == 'SUCCESS'){
// 更新點(diǎn)贊狀態(tài)
// 通過(guò)class找到對(duì)應(yīng)的標(biāo)簽
var record = $(obj.getElementsByClassName('glyphicon'))
if (is_like){
record.addClass('active')
}
else {
record.removeClass('active')
}
// 更新點(diǎn)贊數(shù)量
var like_num = $(obj.getElementsByClassName('like_num'))
like_num.text('(' + data['like_num'] + ')')
}
else {
// 以彈窗的形式顯示錯(cuò)誤信息
alert(data['message'])
}
},
error: function (xhr) {
console.log(xhr)
}
});
return false;
};
</script>
最終效果圖:

總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,如果有疑問(wèn)大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
Python數(shù)據(jù)分析Numpy中常用相關(guān)性函數(shù)
這篇文章主要為大家介紹了Python數(shù)據(jù)分析Numpy中常用相關(guān)性函數(shù)講解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-06-06
jupyter 實(shí)現(xiàn)notebook中顯示完整的行和列
這篇文章主要介紹了jupyter 實(shí)現(xiàn)notebook中顯示完整的行和列,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-04-04
pycharm日志總是彈出“無(wú)法運(yùn)行Git,未安裝Git”的問(wèn)題
這篇文章主要介紹了pycharm日志總是彈出“無(wú)法運(yùn)行Git,未安裝Git”的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-06-06
Python?Flask框架實(shí)現(xiàn)Proteus仿真Arduino與網(wǎng)頁(yè)數(shù)據(jù)交互
這篇文章主要介紹了Python?Flask框架實(shí)現(xiàn)Proteus仿真Arduino與網(wǎng)頁(yè)數(shù)據(jù)交互,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)吧2022-11-11
Python利用緩存流實(shí)現(xiàn)壓縮PDF文件
在Python中,有許多庫(kù)可以用來(lái)壓縮PDF文件,其中最常用的是PyPDF2和PDFMiner,本文將為大家介紹一個(gè)新的方法,即使用緩存流壓縮PDF文件,感興趣的可以了解下2023-08-08
Tensorflow中k.gradients()和tf.stop_gradient()用法說(shuō)明
這篇文章主要介紹了Tensorflow中k.gradients()和tf.stop_gradient()用法說(shuō)明,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-06-06

