一、核心差异与原则
- 职责划分
- 后端(Django):仅负责数据处理、业务逻辑、权限校验,输出JSON格式的API。
- 前端:负责页面渲染、用户交互,通过AJAX/Fetch/axios等调用后端API。
- 关键技术
- 后端:Django + Django REST framework(DRF,简化API开发)。
- 跨域处理:需配置CORS(跨域资源共享)。
- 认证:常用JWT(JSON Web Token)替代传统Session认证。
二、项目开发流程
1. 环境准备
-
安装核心依赖:
bashpip install django djangorestframework django-cors-headers djangorestframework-simplejwt # 核心库:DRF、CORS、JWT
2. 创建项目与应用
-
项目结构与传统类似,但需新增API专用应用(如
api):bashdjango-admin startproject backend # 项目名(后端专用) cd backend python manage.py startapp api # 存放API视图、序列化器等 python manage.py startapp users # 可选:用户认证专用应用
3. 核心配置(settings.py)
重点配置DRF、CORS、JWT认证:
python
# 注册应用
INSTALLED_APPS = [
# Django内置
'django.contrib.admin',
'django.contrib.auth',
...
# 第三方应用
'rest_framework', # DRF框架
'corsheaders', # CORS跨域
'rest_framework_simplejwt',# JWT认证
# 自定义应用
'api',
'users',
]
# 中间件:CORS中间件需放在最前面(尤其是CommonMiddleware之前)
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware', # 跨域中间件
'django.middleware.common.CommonMiddleware',
...
]
# CORS配置(允许前端域名访问)
CORS_ALLOWED_ORIGINS = [
"http://localhost:8080", # 前端本地开发地址(Vue默认8080,React默认3000)
"http://127.0.0.1:8080",
]
CORS_ALLOW_CREDENTIALS = True # 允许携带cookie(如需)
# DRF配置
REST_FRAMEWORK = {
# 认证方式:JWT
'DEFAULT_AUTHENTICATION_CLASSES': (
'rest_framework_simplejwt.authentication.JWTAuthentication',
),
# 权限控制:默认需认证
'DEFAULT_PERMISSION_CLASSES': (
'rest_framework.permissions.IsAuthenticated',
),
# 分页(可选)
'DEFAULT_PAGINATION_CLASS': 'rest_framework.pagination.PageNumberPagination',
'PAGE_SIZE': 10,
}
# JWT配置(过期时间等)
from datetime import timedelta
SIMPLE_JWT = {
'ACCESS_TOKEN_LIFETIME': timedelta(minutes=30), # 访问令牌有效期
'REFRESH_TOKEN_LIFETIME': timedelta(days=1), # 刷新令牌有效期
'ROTATE_REFRESH_TOKENS': False,
}
# 数据库配置(同传统项目,推荐PostgreSQL/MySQL)
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'backend_db',
'USER': 'root',
'PASSWORD': '123456',
'HOST': 'localhost',
'PORT': '3306',
}
}
三、项目结构(前后端分离专用)
backend/ # 后端项目根目录
├── manage.py
├── backend/ # 项目配置目录
│ ├── __init__.py
│ ├── asgi.py
│ ├── settings.py # 核心配置(DRF、CORS、JWT等)
│ ├── urls.py # 主路由(聚合API路由)
│ └── wsgi.py
├── api/ # API应用(核心业务接口)
│ ├── __init__.py
│ ├── admin.py # 可选:后台管理
│ ├── apps.py
│ ├── migrations/
│ ├── models.py # 数据模型(ORM)
│ ├── serializers.py # DRF序列化器(数据格式转换)
│ ├── urls.py # API路由(如/api/articles/)
│ ├── views.py # API视图(处理请求,返回JSON)
│ └── tests.py # 接口测试
├── users/ # 用户认证应用(可选)
│ ├── __init__.py
│ ├── serializers.py # 用户序列化器(登录/注册)
│ ├── urls.py # 认证路由(如/login/、/register/)
│ └── views.py # 登录/注册视图
└── requirements.txt # 依赖清单(pip freeze > requirements.txt)
四、代码编写要点
1. 数据模型(models.py)
与传统项目一致,定义数据库表结构:
python
# api/models.py
from django.db import models
class Article(models.Model):
title = models.CharField(max_length=200)
content = models.TextField()
created_at = models.DateTimeField(auto_now_add=True)
updated_at = models.DateTimeField(auto_now=True)
def __str__(self):
return self.title
2. 序列化器(serializers.py)
DRF核心组件,负责模型数据与JSON的转换(序列化/反序列化):
python
# api/serializers.py
from rest_framework import serializers
from .models import Article
class ArticleSerializer(serializers.ModelSerializer):
class Meta:
model = Article
fields = ['id', 'title', 'content', 'created_at'] # 需返回的字段
read_only_fields = ['id', 'created_at'] # 只读字段(前端无需提交)
3. API视图(views.py)
使用DRF的视图类(如ModelViewSet)快速实现CRUD接口:
python
# api/views.py
from rest_framework import viewsets
from .models import Article
from .serializers import ArticleSerializer
class ArticleViewSet(viewsets.ModelViewSet):
"""提供文章的增删改查接口"""
queryset = Article.objects.all() # 查询集
serializer_class = ArticleSerializer # 关联序列化器
4. URL路由配置
-
应用级路由(
api/urls.py):pythonfrom django.urls import path, include from rest_framework.routers import DefaultRouter from .views import ArticleViewSet # 自动生成路由(list/create/update/delete) router = DefaultRouter() router.register(r'articles', ArticleViewSet) # 路由前缀:/api/articles/ urlpatterns = [ path('', include(router.urls)), ] -
项目级路由(
backend/urls.py):pythonfrom django.contrib import admin from django.urls import path, include from rest_framework_simplejwt.views import ( TokenObtainPairView, # 获取令牌(登录) TokenRefreshView, # 刷新令牌 ) urlpatterns = [ path('admin/', admin.site.urls), path('api/', include('api.urls')), # API接口根路径 # JWT认证路由 path('api/token/', TokenObtainPairView.as_view(), name='token_obtain_pair'), path('api/token/refresh/', TokenRefreshView.as_view(), name='token_refresh'), ]
5. 用户认证(登录/注册)
示例:自定义注册视图(users/views.py):
python
from rest_framework import status
from rest_framework.response import Response
from rest_framework.views import APIView
from django.contrib.auth.models import User
from .serializers import UserSerializer
class RegisterView(APIView):
def post(self, request):
serializer = UserSerializer(data=request.data)
if serializer.is_valid():
serializer.save() # 创建用户
return Response(serializer.data, status=status.HTTP_201_CREATED)
return Response(serializer.errors, status=status.HTTP_400_BAD_REQUEST)
对应序列化器(users/serializers.py):
python
from rest_framework import serializers
from django.contrib.auth.models import User
from django.contrib.auth.password_validation import validate_password
class UserSerializer(serializers.ModelSerializer):
password = serializers.CharField(write_only=True, required=True, validators=[validate_password])
class Meta:
model = User
fields = ['username', 'email', 'password']
def create(self, validated_data):
user = User.objects.create_user(
username=validated_data['username'],
email=validated_data.get('email', ''),
password=validated_data['password']
)
return user
五、测试API
- 启动开发服务器:
python manage.py runserver - 访问接口(推荐使用Postman或浏览器插件测试):
- 注册:
POST http://127.0.0.1:8000/api/register/(参数:username、email、password) - 登录(获取令牌):
POST http://127.0.0.1:8000/api/token/(参数:username、password,返回access和refresh令牌) - 获取文章列表:
GET http://127.0.0.1:8000/api/articles/(请求头需携带Authorization: Bearer <access_token>)
- 注册:
六、注意事项
-
跨域安全
- 生产环境中
CORS_ALLOWED_ORIGINS需严格限制为前端域名,避免*(允许所有域名)。 - 如需携带cookie,需配置
CORS_ALLOW_CREDENTIALS = True,且前端请求需设置withCredentials: true。
- 生产环境中
-
JWT安全
- 合理设置令牌过期时间(
ACCESS_TOKEN_LIFETIME不宜过长)。 - 生产环境中通过HTTPS传输令牌,避免明文泄露。
- 敏感操作(如修改密码)可要求重新验证令牌。
- 合理设置令牌过期时间(
-
API权限控制
-
使用DRF的
permission_classes控制接口权限(如IsAuthenticated、IsAdminUser)。 -
自定义权限类(如仅作者可修改自己的文章):
pythonfrom rest_framework import permissions class IsAuthor(permissions.BasePermission): def has_object_permission(self, request, view, obj): return obj.author == request.user # 假设模型有author字段关联User
-
-
数据验证
- 序列化器中通过
validators或def validate_<field>()方法严格验证前端传入数据。 - 避免直接使用
request.data操作数据库,必须通过序列化器校验。
- 序列化器中通过
-
生产环境配置
-
关闭
DEBUG = False,配置ALLOWED_HOSTS。 -
使用环境变量存储敏感信息(
SECRET_KEY、数据库密码等):pythonimport os SECRET_KEY = os.environ.get('DJANGO_SECRET_KEY') -
部署时使用Gunicorn/uWSGI作为WSGI服务器,搭配Nginx处理静态文件和反向代理。
-
-
文档自动生成
-
集成DRF Swagger(
drf-yasg)或ReDoc自动生成API文档,方便前后端协作:bashpip install drf-yasg配置后访问
/swagger/即可查看交互式文档。
-
通过以上配置和流程,Django可作为高效的后端API服务,与前端框架无缝配合,实现前后端分离的Web应用开发。