如何在用户的django rest框架中创建登录弹出模型未经验证

我有一个简单的django博客，上面有一个like按钮，但如果用户未经身份验证，我希望有一个登录弹出模型

##MODEL
class Song(models.Model):
    name        =   models.CharField(max_length=120)
    like        =   models.ManyToManyField(User, blank=True, related_name="like")

##Like Api View

<!-- Modal HTML -->
<div id="myModal" class="modal fade">
    <div class="modal-dialog modal-login">
        <div class="modal-content">
            <form action="/examples/actions/confirmation.php" method="post">
                <div class="modal-header">              
                    <h4 class="modal-title">Login</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                </div>
                <div class="modal-body">                
                    <div class="form-group">
                        <label>Username</label>
                        <input type="text" class="form-control" required="required">
                    </div>
                    <div class="form-group">
                        <div class="clearfix">
                            <label>Password</label>
                            <a href="#" class="float-right text-muted"><small>Forgot?</small></a>
                        </div>
                        
                        <input type="password" class="form-control" required="required">
                    </div>
                </div>
                <div class="modal-footer justify-content-between">
                    <label class="form-check-label"><input type="checkbox"> Remember me</label>
                    <input type="submit" class="btn btn-primary" value="Login">
                </div>
            </form>
        </div>
    </div>
</div>

 

类SonglikeAppitoggle（APIView）： 身份验证\u类=[authentication.SessionAuthentication] 权限\u类=[权限.已验证]

def get(self, request, slug=None, format=None):
    obj = get_object_or_404(Song, slug=slug)
    updated = False
    liked = False
    
    if obj.like.filter(id=request.user.id).exists():
        obj.like.remove(request.user.id)
        liked = False  
    else:
        liked = True
        obj.like.add(request.user.id)
    updated = True

    data = {
        'updated':updated,
        'liked': liked
    }
    return Response(data)


### TEMPLATE WITH JQUERY

我想有一个登录弹出模型，如果用户单击下面的类似按钮

<a data-href="{% url 'music:like' object.slug %}" class="like_btn" >
Like button here
</a>



    function update(btn, verb){
        btn.html(verb);
    }
    $(".like_btn").click(function(e){
        e.preventDefault()
        var this_ = $(this);
        var likeUrl = this_.attr("data-href");
        $.ajax({
            url:likeUrl,
            method: "GET",
            data: {},
            success: function(data){
                console.log(data);
                var newLikes;
                if (data.liked){
                    //add like
                    update(this_, "<i class='fa fa-thumbs-up'></i>");
                }else{
                    //remove like
                    update(this_, "<i class='fa fa-thumbs-o-up'></i>");
                }
            },error: function(error){
                console.log(error);
                console.log("error")
            }
        })
    }
)

功能更新（btn，动词）{
html（动词）；
}
$（“.like_btn”）。单击（函数（e）{
e、 预防默认值（）
var this=$（this）；
var likurl=此属性（“数据href”）；
$.ajax({
url:likeUrl，
方法：“获取”，
数据：{}，
成功：功能（数据）{
控制台日志（数据）；
var newLikes；
if（data.like）{
//加上
更新（此“”）；
}否则{
//移开
更新（此“”）；
}
}，错误：函数（错误）{
console.log（错误）；
console.log（“错误”）
}
})
}
)

下面是一个腰部模型，我想弹出，如果用户现在已验证

##MODEL
class Song(models.Model):
    name        =   models.CharField(max_length=120)
    like        =   models.ManyToManyField(User, blank=True, related_name="like")

##Like Api View

<!-- Modal HTML -->
<div id="myModal" class="modal fade">
    <div class="modal-dialog modal-login">
        <div class="modal-content">
            <form action="/examples/actions/confirmation.php" method="post">
                <div class="modal-header">              
                    <h4 class="modal-title">Login</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                </div>
                <div class="modal-body">                
                    <div class="form-group">
                        <label>Username</label>
                        <input type="text" class="form-control" required="required">
                    </div>
                    <div class="form-group">
                        <div class="clearfix">
                            <label>Password</label>
                            <a href="#" class="float-right text-muted"><small>Forgot?</small></a>
                        </div>
                        
                        <input type="password" class="form-control" required="required">
                    </div>
                </div>
                <div class="modal-footer justify-content-between">
                    <label class="form-check-label"><input type="checkbox"> Remember me</label>
                    <input type="submit" class="btn btn-primary" value="Login">
                </div>
            </form>
        </div>
    </div>
</div>

 

登录
&时代；
用户名
密码
记得我吗

现在，您基本上要求我们为您编写代码。请尝试自己解决这个问题，然后发布一个具体的问题。