超越村后端开发（3.安装djangorestframework+序列化+API开发前期准备）

1.安装djangorestframework

1.安装djangorestframework及其依赖包markdown、django-filter。

pip install djangorestframework markdown django-filter

2.在settings中注册，如下：

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'users.apps.UsersConfig',
    'wish.apps.WishConfig',
    'user_operation.apps.UserOperationConfig',
    'crispy_forms',
    'xadmin',
    'rest_framework'
]

2.序列化

1.在apps/users目录下新建serializers.py：

from rest_framework import serializers
from .models import UserProfile,WxUsers


class UserProfileModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = UserProfile
        fields="__all__"


class WxUsersModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = WxUsers
        fields="__all__"

View Code

2.在apps/wish目录下新建serializers.py：

from rest_framework import serializers
from .models import Wish,News,Images


class WishModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = Wish
        fields="__all__"


class NewsModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = News
        fields="__all__"


class ImagesModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = Images
        fields="__all__"

View Code

3.在apps/user_operation目录下新建serializers.py：

from rest_framework import serializers
from .models import Message,Pick,Share,Notice


class MessageModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = Message
        fields="__all__"
        

class PickModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = Pick
        fields="__all__"


class ShareModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = Share
        fields="__all__"


class NoticeModelSerializer(serializers.ModelSerializer):
    class Meta:
        model = Notice
        fields="__all__"

View Code

3.API开发前期准备

1.在settings中注释掉csrf验证，保证post请求不会出现403

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

2.跨域问题解决

1.安装django-cors-headers：

pip install django-cors-headers

2.在settings中注册：

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'users.apps.UsersConfig',
    'wish.apps.WishConfig',
    'user_operation.apps.UserOperationConfig',
    'crispy_forms',
    'xadmin',
    'rest_framework',
    'corsheaders'
]

3.在settings中添加相关中间件：

MIDDLEWARE = [
    'corsheaders.middleware.CorsMiddleware',  # 放到中间件顶部
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    # 'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

4.在settings.py中新增配置项：

CORS_ORIGIN_ALLOW_ALL = True

3.建立前端vue项目进行以备调试使用

1.安装Node.js环境

2.安装cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

3.搭建vue开发环境

cnpm install --global vue-cli

4.新建vue项目：

vue init webpack-simple test
一直回车
cd test 
cnpm install
npm run dev

Ctrl+c键，退出运行状态

5.安装axios

cnpm install axios