创建Django项目，利用pycharm控制发出ajax数据

本文链接：https://blog.csdn.net/m0_59329828/article/details/135244873

1，环境配置

确认电脑内具备django环境（我这里用的是django==2.2）

打开cmd(命令提示符)

按 Windows+R 打开“运行”框。键入“cmd”，然后单击“确定”以打开常规命令提示符。输入

pip list

查看资源列表里面有没有配置。如果没有，输入以下语句配置即可

pip install django==2.2

2.定位到项目文件位置

在cmd中进入项目文件需要创建的位置，如下

3.创建项目名称

django-admin startproject 网站名称（mysite）

django-admin startproject mysite

4.cd mysite 文件夹下，dir查看文件夹目录

执行以下语句

python manage.py runserver

5.查看返回数据，

确认网站通过localhost：8000可以访问即可

6.通过pycharm进入项目

打开pycharm程序，选择文件下的打开

选择项目文件路径，就是刚创建的项目文件路径地址，ok就可以了

7.查看总配置文件

新建的项目只有下面这几个文件夹，其中settings.py 可以当作总配置文件，

urls可以当作总路由文件，

8.django三层框架的概念

以下三总类型的文件

view.py 是视图层，用来显示页面和实现功能的，也叫做视图控制器

model.py 用来控制数据库的

templates.py 用来存放html文件的，所有app页面的html文件都可以保存在这里

9.配置templates

在总目录下，就是mysite文件夹下新建templates文件夹

打开mysite文件夹下的settings.py文件，

然后找到templates，在他的根路径dirs里添加

os.path.join(BASE_DIR,'templates')

10.配置static

static文件夹是用来存放css、javascript、images文件的地方

同样的方法，

在总目录下，就是mysite文件夹下新建static文件夹

打开mysite文件夹下的settings.py文件，最下面添加

STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'static')
]

11.新建app子应用

pycharm总目录中tool选项卡下，下拉列表run manage.py tesk选项。

跳出控制台中，输入

startapp app名称（如：ajax_test3）

enter后，会在总目录下创建一个app子应用

然后在settings.py总配置文件中的

INSTALLED_APPS列表里写入app名称

12.apps配置

当存在多个app子应用时，可以放入到一个apps文件夹下，方便管理

首先在总目录下新建一个apps的文件夹

然后打开settings.py文件，导入sys

添加语句

sys.path.insert(0,os.path.join(BASE_DIR,'apps'))

并将新建的app子应用添加到apps中，右击apps将文件夹配置成sources root

13.将需要实现的html文件保存在templates中

14.app子应用视图层文件链接

在app子应用的文件夹下，有views.py文件，写入以下代码，将templates中的html文件链接到这个app子应用中。

from django.shortcuts import render

# Create your views here.
def index(request):
    return render(request,'index1.html')

15.总路由配置，子路由设置

视图是需要通过总路由发送到网站上去的。

在app子应用中新建urls子文件件，设置如下

from django.urls import path
from ajax_test.views import index,product


urlpatterns = [
    path('',index,name='index'),
    #django路由是可以取别名的
    path('pro/',product,name='pro')

]

mysite下urls文件夹总路由配置中设置如下：

from django.urls import path,include

from django.contrib import admin

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

完成了路由系统的配置

16.ajax请求的编写

在html文件中，注意，由于ajax时jquery的功能，所以需要导入jquery文件，保存在static文件夹下

在编写ajax语句

由于时ajax请求，不安全，需要关闭scrf的令牌，这句话注释掉就好了

<script>
    $('.btn').click(function () {
        $.ajax({
            //指定访问的后端地址
            url:"{% url 'pro' %}",
            //指定请求方式
            method:'post',
            //在页面中获取到用户输入的两个值
            data:{
                'a1':$('#a1').val(),
                'a2':$('#a2').val()
            },
            //回调函数 args用来接收httpresponse的返回值
            success: function(args){
                //把后端返回的值通过dom操作显示到第三个input框中
                $('#a3').val(args)
            }
        }
        )
        }
    )
</script>

17.最后检查运行即可