初识Web和元素定位方法

我们今天来聊一聊什么是什么是Web自动化,以及如何写一个简单的登录的自动化脚本。Web自动化的含义就是用电脑模拟人工自动的在网页上执行各种各样的网页操作。比如说登陆、购物、下载电影或者是爬取信息。那我们就先聊下Web自动化的执行流程。我们使用Python语言编写一个自动化脚本,Selenium模拟人类在Web页面上增删改查,Web页面将selenium操作的信息发送给服务器,服务器返回数据在Web页面上显示,最后我们就看到了浏览器在自己操作。

Web自动化流程

从上图我们可以看出来两大问题:如何什么是Web页面和Python脚本应该怎么写。

一、什么是Web页面。

Web页面简而言之就是我们常说的网页,是构成网站的基本元素。通常我们登录网站,都是从网页上获取信息,所以我们自动化操作的主体也就是Web页面。大家在网上一般只能看到网页,并不知道后面还有个服务器。给大家举个例子,网页和服务器的关系就像显示器和主机的关系一样。服务器里存的都是数据,我们根本看不懂这些数据的含义,网页就是能够让我们轻松阅读这些数据的显示器。

网页与服务器通信

网页和服务器之间的交流就像写信一样,网页发送一个叫做Request的信件,而服务器收到后就立马回个叫做Response的回信。Web页面和服务器之间的信息交流是靠HTTP协议传输。HTTP协议的全称是超文本传输协议,是一种用于分布式的应用层协议。HTTP协议分为request和response两部分,并且他们同样包含Start Line和Headers两部分,但不同的是request中的Start Line中包含的是HTTP的方法、地址和协议,而response中的Start Line则是接受到request后返回的状态码和具体解释,当然Headers里的内容也不同。

HTTP协议内容

HTTP协议是明文传输,那么这就带来了安全问题。如果黑客从Web页面和服务器之间盗取数据,那我们的隐私则毫无秘密可言。因此诞生了带加密的HTTP协议,我们称之为HTTPS。下图便是HTTPS的工作原理。

HTTPS的工作原理

(1)客户使用https的URL访问Web服务器,要求与Web服务器建立SSL连接。

(2)Web服务器收到客户端请求后,会将网站的证书信息(证书中包含公钥)传送一份给客户端。

(3)客户端的浏览器与Web服务器开始协商SSL连接的安全等级,也就是信息加密的等级。

(4)客户端的浏览器根据双方同意的安全等级,建立会话密钥,然后利用网站的公钥将会话密钥加密,并传送给网站。

(5)Web服务器利用自己的私钥解密出会话密钥。

(6)Web服务器利用会话密钥加密与客户端之间的通信。

我们之前讲了网页的作用是将服务器中的数据展示给我们,那网页是怎么展示给我们的呢,这里就不得不提到HTML了。HTML 指的是超文本标记语言 (Hyper Text Markup Language) 所谓的超文本就是指页面内可以包含图片、链接、甚至音乐,等非文字元素。HTML文件后缀名就是(.html),下面就是HTML示例和结构图。

HTML示例

HTML结构图

HTML是一种标记语言,这些..就叫做标签,而HTML就是使用这些标签来描述网页的。HTML一般分成head和body两部分,这些标签有自己的含义,例如h1是定义HTML的标题heading,标签p定义的是HTML的段落。看上图你可以发现,html等标签都是成对出现的。在chrome浏览器中直接按F12,就能见到下面的界面,左边是常见的界面,右边则是HTML网页代码。

二、如何写Python脚本

如何写脚本呢?那就要问写的对象是谁呢?显而易见,就是根据HTML代码来定位确切元素,然后用Selenium来操作这些元素。Python的selenium常用ID、Name、tagName、className、xpath、linkText(和partialLinkText同类)和CSS选择器这七种方法定位。找到对应元素之后,直接可以进行操作。

元素定位方法

y示例:慕课网自动化登录

1.找到慕课网点地址并输入

browser.get('https://www.imooc.com/user/newlogin/from_url')

2.点击注册(使用链接文本查找元素)

browser.find_element_by_link_text('立即注册').click()

3.直接登录(只知道链接文本的部分内容)

browser.find_element_by_partial_link_text('直接').click()

4.输入用户名(tagName查找元素)

browser.find_element_by_tag_name('input').send_keys('************')

5.输入密码(name查找元素)

browser.find_element_by_name('password').send_keys('*************')

6.点击自动登录(className查找元素)

browser.find_element_by_class_name('auto-cbx').click()

7.点击登录(xpath查找元素)

点击阴影部分并鼠标右键,选择copy>copy xpath,就能复制到xpath信息。

browser.find_element_by_xpath('//*[@id=signup-form]/div[5]/input').click()

慕课网自动化登录脚本

这是完整的自动化登录操作,使用了五种查找元素的方法。其中click指的是点击操作,send_keys是输入关键字,find_element...指的是找到对应的元素。目前只需要将 * 号中的内容换成对应的用户名和密码就能自动运行了,现在你可以试试了。

附(python selenium 的指导与说明):

http://selenium-python-zh.readthedocs.io/en/latest/locating-elements.html#id2

本文来自企鹅号 - 全球大搜罗媒体

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏smy

微信小程序避坑指南

 详见官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/client-lib/cl...

4403
来自专栏魏艾斯博客www.vpsss.net

WDCP 面板 V3.2 新增多 PHP 版本共存和一键 SSL 功能

2163
来自专栏非著名程序员

环境配置:React Native智能开发工具,可代码提醒的IDE—VS Code

(友情提示:RN学习,从最基础的开始,大家不要嫌弃太基础,会的同学请自行略过,希望不要耽误已经会的同学的宝贵时间) VS Code是一个专门为React Nat...

3925
来自专栏美丽应用

给安卓Chrome加入主页按钮

8682
来自专栏魏艾斯博客www.vpsss.net

宝塔 linux 面板常见问题解答

7555
来自专栏web前端-

初始vue

     vue是一套构建用户界面的 渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,...

1043
来自专栏极客编程

Vue.js如何写一个简单的原生js模块,浏览器中的表现如何?

浏览器正在逐步的支持原生JavaScript模块。Safari和Chrome的最新版本已经支持它们了,Firefox和Edge也将很快推出。

1982
来自专栏云计算教程系列

如何使用WP-CLI安装WordPress

很多人都熟悉WordPress的安装,Wordpress安装起来非常简单,其号称5分钟快速安装。但是,当您需要部署多个Wordpress时,重复的工作会拖慢你大...

1642
来自专栏优启梦

PHP使用curl取HTTP状态码

3399
来自专栏葡萄城控件技术团队

Webpack4干货分享:第一部分,入口、输入和ES6模块

转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。

1022

扫码关注云+社区

领取腾讯云代金券