实际Django项目+VUE项目开发

1|0实际Django项目+VUE项目开发

2|0项目搭建

  • 步骤:
  1. pip换源
  2. 项目虚拟环境搭建
  3. 项目后台的创建
  4. 后台的项目配置(环境变量配置和日志文件配置)
  5. 项目的后端数据库配置
  6. user文件夹的创建(利用xadmin模块)
  7. 项目前端文件创建(VUE框架的前端项目)
  8. 项目的前端配置(main.js文件中全局配置)
  9. 前后端分离跨域问题的解决
  10. 前后端业务逻辑书写

2|11. pip换源

  • 配置永久安装源
1)windows系统下: ''' 在C:\Users\电脑用户\AppData\Roaming 文件夹中创建pip文件夹并新建pip.ini配置文件,在pip.ini文件中配置下面的内容 ''' 2)MacOS、Linux系统下: """ 1、在用户根目录下 ~ 下创建 .pip 隐藏文件夹,如果已经有了可以跳过 -- mkdir ~/.pip 2、进入 .pip 隐藏文件夹并创建 pip.conf 配置文件 -- cd ~/.pip && touch pip.conf 3、启动 Finder(访达) 按 cmd+shift+g 来的进入,输入 ~/.pip 回车进入 4、新增 pip.conf 配置文件内容 """ pip.ini配置内容:(直接复制粘贴到pip.ini文件中) """ [global] index-url = http://pypi.douban.com/simple [install] use-mirrors =true mirrors =http://pypi.douban.com/simple/ trusted-host =pypi.douban.com """

2|22. 项目虚拟环境搭建

1|0(1)优点:

1、使不同应用开发环境相互独立 2、环境升级不影响其他应用,也不会影响全局的python环境 3、防止出现包管理混乱及包版本冲突

1|0(2)windows系统下搭建虚拟环境:

1. 安装 # 先使用下面的命令安装到python3环境下 pip3 install virtualenv pip3 install virtualenvwrapper-win 2. 配置虚拟环境工作目录 1)在系统环境变量中添加新的环境变量WORKON_HOME eg:WORKON_HOME: D:\Virtualenvs 2)在python3安装文件中,找到Scripts文件夹=>virtualenvwrapper.bat => 双击

1|0(3) MacOS、Linux系统下搭建虚拟环境:

1. 安装 # 建议使用pip3安装到python3环境下 pip3 install -i https://pypi.douban.com/simple virtualenv pip3 install -i https://pypi.douban.com/simple virtualenvwrapper 2. 配置虚拟环境工作目录 # 先找到virtualenvwrapper的工作文件 virtualenvwrapper.sh,该文件可以刷新自定义配置,但需要找到它 # MacOS可能存在的位置 /Library/Frameworks/Python.framework/Versions/版本号文件夹/bin # Linux可能所在的位置 /usr/local/bin | ~/.local/bin | /usr/bin # 建议不管virtualenvwrapper.sh在哪个目录,保证在 /usr/local/bin 目录下有一份 # 如果不在 /usr/local/bin 目录,如在 ~/.local/bin 目录,则复制一份到 /usr/local/bin 目录 -- sudo cp -rf ~/.local/bin/virtualenvwrapper.sh /usr/local/bin 3. 配置 # 在 ~/.bash_profile 完成配置,virtualenvwrapper的默认默认存放虚拟环境路径是 ~/.virtualenvs # WORKON_HOME=自定义存放虚拟环境的绝对路径,需要自定义就解注 VIRTUALENVWRAPPER_PYTHON=/usr/local/bin/python3 source /usr/local/bin/virtualenvwrapper.sh # 在终端让配置生效: -- source ~/.bash_profile

1|0(3)虚拟环境的使用

# ***以下命令都是在终端中输入*** 1. 创建虚拟环境工作文件夹到上面配置环境变量的WORKON_HOME路径下 2. 创建虚拟环境 # 选取默认Python环境创建虚拟环境: mkvirtualenv 虚拟环境名称 # 基于某Python环境创建虚拟环境: mkvirtualenv -p python2.7 虚拟环境名称 mkvirtualenv -p python3.6 虚拟环境名称 3. 查看已有的虚拟环境 workon 4. 使用某个虚拟环境 workon 虚拟环境名称 5. 进入|退出 该虚拟环境的Python环境 python | exit() 6. 为虚拟环境安装项目开发所需要的模块 pip或pip3 install 模块名 7. 退出当前虚拟环境 deactivate 8. 删除虚拟环境(删除当前虚拟环境要先退出) rmvirtualenv 虚拟环境名称

1|0(4)使用pycharm开发项目

  • 新建Django项目,使用已存在的环境,选择我们创建的虚拟环境中的python解释器即可。

2|33. 项目后台创建

1|0(1)项目环境搭建

""" 为项目创建一个虚拟环境 mkvirtualenv 虚拟环境名 安装基础环境依赖 pip install django==2.0.7 pip install djangorestframework pip install pymysql pip install djangorestframework-jwt # 第三方插件,辅助完成jwt token的签发和校验 """

1|0(2)项目后端文件的创建

""" ├── luffyapi # 项目根目录文件夹 ├── logs/ # 项目运行时/开发时日志目录 - 包 ├── manage.py # 脚本文件 ├── luffyapi/ # 项目主应用,开发时的代码保存 - 包 ├── wsgi.py # 脚本文件 ├── apps/ # 开发者的代码保存目录,以模块[子应用]为目录保存 - 包 ├── libs/ # 第三方类库的保存目录[第三方组件、模块] - 包 ├── settings/ # 配置目录 - 包 ├── dev.py # 项目开发时的本地配置 └── prod.py # 项目上线时的运行配置 ├── urls.py # 总路由 └── utils/ # 多个模块[子应用]的公共函数类库[自己开发的组件] └── scripts/ # 保存项目运营时的脚本文件 - 文件夹 """

2|44. 后台项目配置

1|0(1)基本配置

  • 创建dev.py文件
""" 1.修改 wsgi.py 与 manage.py 两个文件: os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'luffyapi.settings.dev') 2.将settings.py删除或改名,内容拷贝到settings/dev.py中 3.国际化配置(修改dev.py文件内容) LANGUAGE_CODE = 'zh-hans' TIME_ZONE = 'Asia/Shanghai' USE_TZ = False 4.修改启动配置:见插图 5.在任何一个__init__.py文件中测试默认配置文件是否是dev.py文件 from django.conf import settings print(settings) """
  • 插图

1|0(2)项目内的环境变量配置

# 环境变量操作:小luffyapiBASE_DIR与apps文件夹都要添加到环境变量 import sys sys.path.insert(0, BASE_DIR) APPS_DIR = os.path.join(BASE_DIR, 'apps') sys.path.insert(1, APPS_DIR)

1|0(3)日志配置

  • dev.py文件中
# 真实项目上线后,日志文件打印级别不能过低,因为一次日志记录就是一次文件io操作 LOGGING = { 'version': 1, 'disable_existing_loggers': False, 'formatters': { 'verbose': { 'format': '%(levelname)s %(asctime)s %(module)s %(lineno)d %(message)s' }, 'simple': { 'format': '%(levelname)s %(module)s %(lineno)d %(message)s' }, }, 'filters': { 'require_debug_true': { '()': 'django.utils.log.RequireDebugTrue', }, }, 'handlers': { 'console': { # 实际开发建议使用WARNING 'level': 'DEBUG', 'filters': ['require_debug_true'], 'class': 'logging.StreamHandler', 'formatter': 'simple' }, 'file': { # 实际开发建议使用ERROR 'level': 'INFO', 'class': 'logging.handlers.RotatingFileHandler', # 日志位置,日志文件名,日志保存目录必须手动创建,注:这里的文件路径要注意BASE_DIR代表的是小luffyapi 'filename': os.path.join(os.path.dirname(BASE_DIR), "logs", "luffy.log"), # 日志文件的最大值,这里我们设置300M 'maxBytes': 300 * 1024 * 1024, # 日志文件的数量,设置最大日志数量为10 'backupCount': 10, # 日志格式:详细格式 'formatter': 'verbose', # 文件内容编码 'encoding': 'utf-8' }, }, # 日志对象 'loggers': { 'django': { 'handlers': ['console', 'file'], 'propagate': True, # 是否让日志信息继续冒泡给其他的日志处理系统 }, } }
  • utils/logging.py文件中
import logging logger = logging.getLogger('django')

1|0(4)二次封装异常处理模块

  • utils/exception.py文件中
from rest_framework.views import exception_handler as drf_exception_handler from rest_framework.views import Response from rest_framework import status from utils.logging import logger def exception_handler(exc, context): response = drf_exception_handler(exc, context) # 异常模块就是记录项目的错误日志 logger.error('%s - %s - %s' % (context['view'], context['request'].method, exc)) if response is None: return Response({ 'detail': '%s' % exc }, status=status.HTTP_500_INTERNAL_SERVER_ERROR, exception=True) return response
  • settings文件中
REST_FRAMEWORK = { 'EXCEPTION_HANDLER': 'utils.exception.exception_handler', }

1|0(5)二次封装Response模块

  • utils/response.py文件中
from rest_framework.response import Response class APIResponse(Response): def __init__(self, data_status=0, data_msg='ok', results=None, http_status=None, headers=None, exception=False, **kwargs): data = { 'status': data_status, 'msg': data_msg, } if results is not None: data['results'] = results data.update(kwargs) super().__init__(data=data, status=http_status, headers=headers, exception=exception)

1|0(6)路由组件配置

  • utils/router.py文件中
from rest_framework.routers import Route, DynamicRoute, SimpleRouter as DRFSimpleRouter class SimpleRouter(DRFSimpleRouter): routes = [ # List route. /资源s/ Route( url=r'^{prefix}{trailing_slash}$', mapping={ 'get': 'list', # 群查 'post': 'create', # 单增、群增 'put': 'multiple_update', # 群整改 'patch': 'multiple_partial_update', # 群局改 'delete': 'multiple_destroy', # 群删 }, name='{basename}-list', detail=False, initkwargs={'suffix': 'List'} ), # Dynamically generated list routes. Generated using # @action(detail=False) decorator on methods of the viewset. DynamicRoute( url=r'^{prefix}/{url_path}{trailing_slash}$', name='{basename}-{url_name}', detail=False, initkwargs={} ), # Detail route. /资源s/(pk)/ Route( url=r'^{prefix}/{lookup}{trailing_slash}$', mapping={ 'get': 'retrieve', # 单查 'put': 'update', # 单整改 'patch': 'partial_update', # 单局改 'delete': 'destroy' # 单删 }, name='{basename}-detail', detail=True, initkwargs={'suffix': 'Instance'} ), # Dynamically generated detail routes. Generated using # @action(detail=True) decorator on methods of the viewset. DynamicRoute( url=r'^{prefix}/{lookup}/{url_path}{trailing_slash}$', name='{basename}-{url_name}', detail=True, initkwargs={} ), ] # 对外提供十大接口的router对象 router = SimpleRouter() # eg: router.register('users', UserModelViewSet, basename='user') """ /users/ 'get': 'list', # 群查 'post': 'create', # 单增、群增 'put': 'multiple_update', # 群整改 'patch': 'multiple_partial_update', # 群局改 'delete': 'multiple_destroy', # 群删 /users/(pk)/ 'get': 'retrieve', # 单查 'put': 'update', # 单整改 'patch': 'partial_update', # 单局改 'delete': 'destroy' # 单删 """

1|0(7)media文件配置

  • dev.py文件中
MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
  • media目录配置
""" ├── luffyapi └── luffyapi/ └── media/ └── icon └── default.png """

1|0(8)项目路由配置

  • 主路由(项目/urls.py文件中)
from django.contrib import admin from django.urls import path, re_path, include from django.views.static import serve from django.conf import settings urlpatterns = [ path('admin/', admin.site.urls), path('user/', include('user.urls')), re_path('^media/(?P<path>.*)', serve, {'document_root': settings.MEDIA_ROOT}) ]
  • 子路由(应用文件夹/urls.py文件中)
from django.urls import path, re_path urlpatterns = [ ]

2|55. 项目的后端数据库配置

1|0(1)创建数据库

""" 1.管理员连接数据库 >: mysql -uroot -proot 2.创建数据库 >: create database luffy default charset=utf8; 3.查看用户 >: select user,host,password from mysql.user; """

1|0(2)为数据库指定账户

""" 设置权限账号密码 # 授权账号命令:grant 权限(create, update) on 库.表 to '账号'@'host' identified by '密码' 1.配置任意ip都可以连入数据库的账户 >: grant all privileges on luffy.* to 'luffy'@'%' identified by 'Luffy123?'; 2.由于数据库版本的问题,可能本地还连接不上,就给本地用户单独配置 >: grant all privileges on luffy.* to 'luffy'@'localhost' identified by 'Luffy123?'; 3.刷新一下权限 >: flush privileges; 只能操作luffy数据库的账户 账号:luffy 密码:Luffy123? """

1|0(3)项目中配置文件配置

DATABASES = { 'default': { 'ENGINE': 'django.db.backends.mysql', 'NAME': 'luffy', 'USER': 'luffy', 'PASSWORD': 'Luffy123?', 'HOST': 'localhost', 'PORT': 3306 } } import pymysql pymysql.install_as_MySQLdb()

2|66. user文件夹的创建(app)

1|0(1)创建user 文件夹

*****************前提:在 luffy 虚拟环境下******************** 1.终端从项目根目录进入apps目录 >: cd luffyapi & cd apps 2.创建app >: python ../../manage.py startapp user

2|7(2)创建user表对应的model

  • user文件夹下的models文件中
from django.db import models from django.contrib.auth.models import AbstractUser class User(AbstractUser): mobile = models.CharField(max_length=11, unique=True) # 需要pillow包的支持 icon = models.ImageField(upload_to='icon', default='icon/default.png') class Meta: db_table = 'luffy_user' verbose_name = '用户表' verbose_name_plural = verbose_name def __str__(self): return self.username
  • 注册user app,配置user表
# 注册user app INSTALLED_APPS = [ # ... 'user', ] # 配置自定义User表 AUTH_USER_MODEL = 'user.User'

1|0(3)数据库迁移

""" 1)去向大luffyapi所在目录的终端(项目最顶层的目录) 2)安装pillow模块 pip install pillow 3)数据库迁移 python manage.py makemigrations python manage.py migrate """

1|0(4)xadmin后台管理

  • Django自带的后台管理在实际开发中,不太健全,所以我们使用xadmin后台管理
1. 安装 pip install https://codeload.github.com/sshwsfc/xadmin/zip/django2 2. 注册app (dev.py文件中) INSTALLED_APPS = [ # ... # xamin主体模块 'xadmin', # 渲染表格模块 'crispy_forms', # 为模型通过版本控制,可以回滚数据 'reversion', ] 3. 需要自己的数据库模型类,完成数据库迁移 python manage.py makemigrations python manage.py migrate 4. 主路由中替换掉admin # xadmin的依赖 import xadmin xadmin.autodiscover() # xversion模块自动注册需要版本控制的 Model from xadmin.plugins import xversion xversion.register_models() urlpatterns = [ # ... path(r'xadmin/', xadmin.site.urls), ] 5. 创建超级用户:大luffyapi路径终端 # 在项目根目录下的终端 python manage.py createsuperuser # 账号密码设置:admin | Admin123 6. 完成xadmin全局配置:新建home/adminx.py # home/adminx.py # xadmin全局配置 import xadmin from xadmin import views class GlobalSettings(object): """xadmin的全局配置""" site_title = "路飞学城" # 设置站点标题 site_footer = "路飞学城有限公司" # 设置站点的页脚 menu_style = "accordion" # 设置菜单折叠 xadmin.site.register(views.CommAdminView, GlobalSettings) 7. 在adminx.py中注册model(home/adminx.px) from . import models # 注册 xadmin.site.register(models.Banner) 8. 修改app:home的名字:xadmin页面上的显示效果 # home/__init__.py default_app_config = "home.apps.HomeConfig" # home/apps.py from django.apps import AppConfig class HomeConfig(AppConfig): name = 'home' verbose_name = '我的首页'

2|87. 项目前端文件创建

2|98. 前端项目配置

1|0(1)模块安装及配置

1. 安装 cnpm install axios cnpm install vue-cookies cnpm install element-ui cnpm install jquery cnpm install bootstrap@3 2. 将安装的模块在main.js文件中分别配置 ***************************** import axios from 'axios' Vue.prototype.$axios = axios; ***************************** import cookies from 'vue-cookies' Vue.prototype.$cookies = cookies; ***************************** import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI); ***************************** const webpack = require("webpack"); module.exports = { configureWebpack: { plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", "window.jQuery": "jquery", "window.$": "jquery", Popper: ["popper.js", "default"] }) ] } }; ***************************** import 'bootstrap' import 'bootstrap/dist/css/bootstrap.min.css'

2|109. 前后端分离跨域问题的解决

1. 在后端项目中,安装插件 pip install django-cors-headers 插件参考地址:https://github.com/ottoyiu/django-cors-headers/ 2. 项目配置:dev.py # 注册app INSTALLED_APPS = [ ... 'corsheaders' ] # 添加中间件 MIDDLEWARE = [ ... 'corsheaders.middleware.CorsMiddleware' ] # 允许跨域源 CORS_ORIGIN_ALLOW_ALL = True

__EOF__

本文作者BigSun丶
本文链接https://www.cnblogs.com/Mcoming/p/12158326.html
关于博主:评论和私信会在第一时间回复。或者直接私信我。
版权声明:本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!
声援博主:如果您觉得文章对您有帮助,可以点击文章右下角推荐一下。您的鼓励是博主的最大动力!
posted @   BigSun丶  阅读(2479)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
点击右上角即可分享
微信分享提示