Django--前后端分离-后端(二)实现简单的登陆接口进行跨域

前后端分离-登陆接口实现跨域

一、创建login项目

1、创建testBackends项目(如果做过第一章节这里可以跳过)

django-admin startproject testBackends

2、创建login模块应用

(1)cd进入testBackends项目
(2)创建任意项目模块如:login

python3 manage.py startapp login

3、把login应用配置到testBackends–>settings.py里面,(如果看过第一章那么安装Django依赖包这里可以跳过,如果没有看过在这里需要安装依赖包,并且也要配置到settings.py里面)

1、安装rest_framework框架
它是基于Django的,帮助我们快速开发符合restful规范的接口框架,它主要适用于前后端分离项目。
Django中文网:https://www.django.cn/course/show-20.html
Django官方文档:https://www.django-rest-framework.org/api-guide/serializers/

pip3 install djangorestframework

2、安装django-cors-headers依赖
django-cors-headers处理跨域请求,一个为响应添加跨源资源共享(CORS)头的Django应用。这允许从其他源向Django应用程序发出浏览器内请求。

pip3 install django-cors-headers

在这里插入图片描述
或者写成下列这样也是可以的:
在这里插入图片描述

4、在login模块内添加下列.py文件

login/serializers.py 数据序列化
login/urls.py 添加login的路由
在这里插入图片描述

二、创建登陆数据库

1、在login/models.py内编写数据表及名称

from django.db import models


class Login(models.Model):
    # 数据库格表字段,用户名及密码
    username = models.CharField(max_length=20)
    password = models.CharField(max_length=20)

    class Meta:
        # 数据库名称d_login
        db_table = "d_login"

在这里插入图片描述

2、login/serializers.py序列化器编写

#!/usr/bin/python3
# -*- coding: utf-8 -*-
# @Date  : 2022/1/8
# @Name  : ZhouZongXin

"""
序列化器
"""
from rest_framework import serializers
from .models import Login  # 引用数据库文件


class LoginSerializer(serializers.HyperlinkedModelSerializer):
    class Meta:
        # 需要序列化的模型 Login
        model = Login
        # 需要序列化的字段,"__all__"的意思是所有字段
        fields = "__all__"

在这里插入图片描述

3、然后在终端进行输入下列命令进行创建数据库

1、迁移模型,创建表结构

python3 manage.py makemigrations

2、创建数据库表

python3 manage.py migrate 

在这里插入图片描述
这样数据库表就生成了。这个是内置的sqlite。

三、进入login/views.py编写登陆逻辑

from django.shortcuts import render
from django.http import JsonResponse
from login import models  # 引用数据库


# 创建登陆API方法,这里必须有一个形参request
def apiLogin(request):

    # 简单写一个返回结果
    res = {
    
    
        'code': 0,
        'msg': '登录成功'
    }

    # request.POS获取请求格式为POST
    if request.POST:
        # request.POST.get获取POST请求参数
        username = request.POST.get('username')  # 用户名
        password = request.POST.get('password')  # 密码
        Type = request.POST.get('type')  # 类型(1=登陆,2=注册)
        # 登陆
        if Type == "1":
            # 查询数据库的所有字段,查询的数据结果是一个数组包含字典
            # <QuerySet [{'id': 1, 'username': 'admin', 'password': 'admin'}, {'id': 2, 'username': 'zzx', 'password': 'zzx'}]>
            Login = models.Login.objects.values()
            # 遍历数据库数据
            for i in Login:
                if i['username'] == username and i['password'] == password:
                    # JsonResponse(res)返回json格式
                    return JsonResponse(res)

            res['code'] = 1
            res['msg'] = "账号密码不正确"
            return JsonResponse(res)
        # 注册
        elif Type == "2":
            if username and password:
                # 添加username,password数据到数据库
                login_save = models.Login(username=username, password=password)
                # 保存数据
                login_save.save()
                res['msg'] = "账号密码注册成功"
                return JsonResponse(res)
            res['msg'] = "注册失败"
            return JsonResponse(res)

        else:
            res['msg'] = "类型错误"
            return JsonResponse(res)

    res['msg'] = "错误的请求方式"
    return JsonResponse(res)

四、在配置路由

1、打开login/urls.py 文件进行编写路由

在各自 app 目录下,写自己的 urls.py 文件,最后进行路径跳转

#!/usr/bin/python3
# -*- coding: utf-8 -*-
# @Date  : 2022/1/8
# @Name  : ZhouZongXin
"""
路由
"""
from django.urls import path
from . import views  # 引用视图层
from django.views.decorators.csrf import csrf_exempt  # 解决跨域


# 路由list
urlpatterns = {
    
    
    # "login" 参数表示路径
    # csrf_exempt()用来解决前后端分离跨域问题,如果不添加这个那么无法进行跨域
    # views.apiLogin 是当前视图层views内的apiLogin方法
    # login/urls.py 中给路由起别名,name="路由别名"
    path("login", csrf_exempt(views.apiLogin), name='login')  # 第一个参数表示路径
}

在这里插入图片描述

2、主路由配置跳转到login模块的路由

from django.contrib import admin
from django.urls import path, include  # 导入了include函数


urlpatterns = [
    path('admin/', admin.site.urls),

    # 此时的路由是 api/login
    # 存在问题:Django 项目里多个app目录共用一个 urls 容易造成混淆,后期维护也不方便。所以我们用到路由分发(include),使用路由分发(include),让每个app目录都单独拥有自己的 urls
    # include("login.urls"),login模块下的urls路由
    path('api/', include("login.urls"))
]

在这里插入图片描述

五、启动项目,进行前后端联调

python3 manage.py runserver

启动项目后,我们用postman或者VUE进行前后端联调就可以啦

1、postman

在这里插入图片描述

2、VUE

在这里插入图片描述
在这里插入图片描述

在这里我们简单的前后端分离就完成了,具体的业务实现还是要看代码基础以及业务知识哦~~

六、额外小知识

1、HttpResponse与JsonResponse的区别

HttpResponse与JsonResponse都是django中后台给前台返回数据的方法,并且他们最后走的都是http协议。

HttpResponse:需要我们自己前后台进行序列化与反序列化

JsonResponse:则把序列化和反序列化封装了起来,我们直接传入可序列化的字符串,在前台就能收到对应的数据。

总结:主要是针对前端进行序列化与反序列化是否处理的区别。

猜你喜欢

转载自blog.csdn.net/zhouzongxin94/article/details/122382992