阅读 170

接口测试平台代码实现5:亲手创造第一个首页

上节我们学的主要是如何启动服务,并让同事进入你的django默认页面,接下来要学习如何理解和操作一个自造页面来让同事可以访问。

可能大家都已经知道百度 首页中暗藏的小彩蛋,在f12的console里可以看到,总是更换,现在是这个:

图片

我记得很多年前我第一次发现的时候,彩蛋是:“一个网页是如何来到用户眼前,一个....是如何...., 一个....是如何。那么就来投递我们吧”

所以我们本节要讨论的问题就是,一个html网页,是如何通过django展现出到你和你同事的浏览器中的。

首先要明白一个事:一个最终呈现在用户眼前的网页是由以下几部分构成的:

1.html模版 :相当于树干树枝

2.具体展现的数据:就是动态的各种树叶

3.html静态语言:就是形成树干树枝的语言

4.js脚本语言:就是我们看到页面内的各种动作行为的脚本

5.css样式:就是美化这些树干树叶的装饰方法

好,我们现在开始梳理一下用户访问你平台首页的逻辑:

  1. 用户打开浏览器,输入网址url

  2. 你的django服务接到这个网址url

  3. 你的django服务去根据这个url 找到对应的后台函数

  4. 找到后台函数后,看到这个后台函数要做一件事,就是返回一个html首页模版,外加初始的数据。打包给你的浏览器

  5. 你的浏览器接到这个html模版和数据后,就给你组合成一个完整的网页展示给你。

       好,我们来在项目中按照上述过程具体实践出来:

首先要在django服务中 写好,你的url 和 后台函数的映射关系,好让django知道根据url找到对应后台函数。

这个映射关系就在urls.py中写,其实听着很高大上,实际上就是一个列表,每个元素是一个映射。每个元素都调用一个库函数,给他传俩个值,第一个是你的url,第二个是你后台函数名字。

如下格式:

[

    库函数('你的url 1',‘你的后台函数名1 ’),

库函数('你的url 2',‘你的后台函数名2 ’),

]

这就是所谓的url分发路由管理器。

下面来找到urls.py文件,进去看到

图片

它已经自动给你生成了一个映射,你可以按照它的格式去写后续的。

但是我们的后台函数 是写在views.py中的,当然可以自己新建其他的。所以这里我们要导入views.py的所有内容:

图片

再在下面的urlpattens 这个大列表中,添加一个新元素:

url(r'^welcome/$',welocme), #进入主页

图片

如图,虽然welcom下面标红了,但是这是正常的,因为我们还没有写这个welcome函数,所以不红就怪了,(小技巧:这时候鼠标不要去点击pycharm之外的地方,否则django会监控到你的文件更改,自动重启,然后重启过场发现代码错误标红,服务就会终止,我们还要修改代码重启。) 

我们现在必须直接进入views.py文件,来写这个welcome函数。

注意,参数中一定要写一个request(可以自己改), 这个参数是必须存在的,只要是urls.py中映射的函数,必须有。它里面包含了所有这次请求的东西,比如请求者的ip,登陆的用户名,http请求等等,都会包含在此。

图片

简单点,就输出 进来了 字符串。

现在我们回到urls.py发现已经不标红了,这说明已经映射成功。

图片

前面的这个写法,是正则匹配写法,大家有兴趣后续可以研究,这里新人建议照葫芦画瓢即可。前面不写/ 后面必写/$ 。

我们现在打开网页,输入网址:127.0.0.1:8000/welcome 看看效果:

图片

网页报错,不要慌,这是正常的。它是在说,你没有给浏览器返回个东西,让它展示个毛线?

图片

但是我们的后台函数中却有print,这个print是打印在你的控制台的,所以你去看看有没有吧?

图片

这个输出证明我们的这条链路其实已经打通了。这里的报错也不用管,这也是在说你没有给浏览器返回一个页面或者什么。

所以我们接下来就给浏览器返回个东西,先来个简单的,返回一句话。

先导入俩个重要的包,是给前端返回用的。

from django.http import HttpResponse,HttpResponseRedirect
from django.shortcuts import render
复制代码

图片

调用的HttpResponse函数是用来返回一个字符串的,后续返回的json格式字符串也是用它,HttpResponseRedirect 是用来重定向到其他url上的。render是用来返回html页面和页面初始数据的。

写好后,我们鼠标点击pycharm外的其他地方,比如微信,qq,网页。这样pycharm会开始检查你的代码,发现你修改了之后,会重启django来让你的修改生效。

图片

看到控制台又输出来一次 启动时候才有的白色文字后,没有其他报错信息,证明重启成功,你的修改应该生效了。再次进入刚刚的网址或刷新:

http://127.0.0.1:8000/welcome/

看看这次展示什么?

图片

看看这是不是成功展示出来了?我们的文案!

好,今天的内容先到这里,下节开始正式制作一个网页,然后调用render函数来返回。

喜欢的朋友点个分享和在看,感谢~

本文使用 文章同步助手 同步

文章分类
开发工具
文章标签