django前后端交互

• 创建一个apps

• 在当前项目文件下,启动dos窗口。执行python manage.py startapp investigate
• pycharm->tools->Run mange.py Task...出现类似于命令行窗口，执行startapp investigate。

• 配置apps

在settings.py 的 INSTALL_APP配置中指定,在该列表中添加你刚刚新建的app名称。

静态资源导入

• 资源

• template目录中创建html
• 创建static目录，并在该目录中创建css、images、JavaScript目录
• django提供【django.contrib.staticfiles】来管理静态文件

• 资源配置

settings配置：STATIC_URL/STATICFILES_DIRS

STATIC_URL = ‘/static/‘
STATICFILES_DIRS = [
    os.path.join(BASE_DIR,‘STATIC‘)
]

Django的路由功能

• 路由是根据不同的url地址展示不同的内容或页面，一般在【urls.py】中配置访问的URL

EG:
urlpatterns = [
    url(r‘^admin‘,admin.site.urls),
    url(r‘^form/$‘,inverstigate)#inverstigate为你的路由路径
]
# 具体url配置也可参考urls.py中的注释内容

• Django中的urls和views的关系

• urls中配置的url调用views中的方法
• render函数将想要交给前端的数据，交给模板

创建Model

• 根据业务需求创建名为【UserInfo】的Model
• 【UserInfo】是【investigate】中的一个Model，Model与app为多对一的关系
• 为【UserInfo】创建字段【Field】。

• 常用的字段类型清单

• Field选项说明

初始化Model

• settings配置：DATABASES中键入你的数据库信息(假如使用sqlite则保持原有配置即可)

EG：
DATABASES = {
    ‘default‘: {
        ‘ENGINE‘: ‘django.db.backends.mysql‘, #驱动名称
        ‘NAME‘: ‘‘,#数据库名称
        ‘USER‘: ‘‘, #数据库用户名
        ‘PASSWORD‘: ‘‘, #用户名密码
        ‘HOST‘: ‘‘, #主机地址
        ‘PORT‘: ‘‘, #端口号
    }
}

• 在命令行(若有疑问请查看上文关于app的创建)执行makemigrations、migrate 初始化Django框架中隐含的表文件
• 同上执行makemigrations、migrate investigate,初始化你刚刚创建的Model。

创建views

• 创建showform函数，

def showform(request):
    if request.method == "POST":
        res_data = request.POST # 获取for表单提交数据
        ret = data_mod(res_data)
        models.UserInfo.objects.create(**ret)
    return render(request,‘form.html‘)

• 创建data_mod函数

def data_mod(rets):
    ret_data={}
    for k_ret,v_ret in rets.items():
        if k_ret != ‘csrfmiddlewaretoken‘:
            mid = {k_ret:v_ret}
            ret_data.update(mid)
    return ret_data

• run mysite
• 打开浏览器输入127.0.0.1:8000/form/查看效果
• 在web中输入你的个人信息，点击提交字段不能为空，若想填写为空值，可以参考Field选项，在Model创建时设定default值。
• 查看数据是否存储成功数据可视化工具可随意，推荐Navicat for MySQL

效果展示

web

database

问题思考

• 前端数据与后台交互时，采用什么方式更加安全合理？
• 在form表单提交前设置，若填写信息为空则提示用户
• form表单提交数据用request.POST修改会报异常(This QueryDict instance is immutable)

作者：羽恒
链接：https://www.jianshu.com/p/7917dd6c3b95
來源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。

原文地址：https://www.cnblogs.com/shiqu/p/10376551.html