使用selenium实现轮播

发表于 | 分类于 |

需求定义

  • 公司需要对外展示若干web页面，需要一种能够自动在屏幕上循环播放这些web页面的功能；
  • web页面上的按钮和各种功能点也要能够自动点击和展示；
  • 现在有三种方案：用js实现、用制作视频的方式实现、用录屏的方式实现；
  • 第一种方案理论上可以实现，但是如果一个页面上的功能点过多，编写js代码就显得非常繁杂，而且一旦页面的元素、控件等有所改动就需要修改代码；
  • 第二种方案可能会存在视频不清晰、分辨率不高的缺点，同样，一旦系统有所变化，就需要重新录制，比较麻烦；
  • 第三种方案也没有能够避免第二种方案的缺陷；
  • 经过认真上网查询，我最终选择了用selenium来完成这件事；

为什么是selenium

  • selenium原本是一种网页自动化测试工具，可以实现自动测试网页功能和性能；
  • 这里，我们只用它的”网页动作”录制的功能来实现轮播效果；
  • selenium和selenium IDE均可直接安装在firefox上面，非常方便；
  • selenium支持多种浏览器播放录制的网页动作，官网上面可下载所需的浏览器驱动，浏览器支持性较强；
  • selenium支持各种常用语言，比如java、javascript（需要安装node）、C#、Python、Ruby，让你用最擅长的语言随心所欲操控网页；
  • 以java语言为例，selenium最终的录制脚本可以导出成jar包，无论是linux还是windows，只要机器上安装了java，你就可以运行jar包、开启轮播，没有比这更方便的啦！
  • 下面，我就带您用selenium一步一步实现轮播；

下载Selenium

  • 下载selenium插件
    • 目前，只有firefox支持selenium插件，不知道以后会不会跨浏览器支持；
    • 打开firefox，搜索插件selenium，安装插件；
    • 安装完后，可以看到firefox的功能列表中已经多了selenium啦！
    • 但此时启动selenium还不能够使用，这是因为我们尚未安装selenium IDE；
  • 安装Selenium IDE
    • 用firefox打开selenium官网，下载selenium IDE：点击这里下载；
    • selenium IDE将直接以插件形式安装在firefox上面；

Selenium IDE使用

  • 使用Selenium IDE来录制网页动作的方法十分简单，打开selenium后，点击红色的圆点即可开始录制，再次点击即停止录制，点击run按钮可以以设定好的速率播放相应脚本的动作，还能够将另存为脚本或者将脚本导出成为java/Ruby/Python等；

selenium1

  • 如果需要查询更复杂的功能，请看这里

实现轮播

  • 确保您的机器安装了java；
  • 打开eclipse，新建一个工程；
  • 在这里的Selenium Standalone Server一栏下载selenium依赖jar包，我下载的是selenium-server-standalone-2.48.2.jar；
  • 将上述jar包导入eclipse新建的工程中，注意不要仅仅是复制进eclipse呦，还需要在工程右键build path>library>add jars将jar包真正添加进工程中；

selenium2

  • 然后，我们就可以开始录制脚本啦；
    • 打开Selenium插件，点击红色圆形按钮开始录制；
    • 在浏览器操作一遍需要录制的动作，比如进入URL、点击按钮、选择下拉菜单等等；
    • 注意在录制前将所需的用户名和密码填写好并保存，否则在录制过程中还要填写用户名密码，这样会使得轮播的展示效果变差；
  • 录制完后，点击文件>export test case as java/JUnit4/webDriver，将脚本导出为JUnit；
  • 然后我们就该处理脚本了：
    • 将脚本复制进ecplise中；
    • 如果您使用的不是firefox来进行轮播，则将driver = new FirefoxDriver();改为driver = new ChromeDriver();就可以来，注意要引入外部包；
    • 可以加入诸如for循环或者while(true)之类的语句，保证脚本可以自动无限次循环播放；
    • 可以加入诸如Thread.sleep(3000);的语句来实现每个动作之间的时间驻留；
    • 对于具体的网页动作，也可根据代码进行必要的修改；
    • 需要注意的是，如果您使用的不是firefox来进行轮播，那么还需要下载您使用的浏览器的驱动才行，否则Selenium在启动浏览器时找不到相应的驱动会报错，各大浏览器的驱动在这里下载，linux版本的chrome驱动请在这里下载，chrome驱动版本和chrome版本的对应关系在这里查询；
    • 下载完驱动后，您还需要在程序中指明驱动存放位置，即添加下述代码：
1
System.setProperty("webdriver.chrome.driver", "D:\\chromedriver_win32\\chromedriver.exe");

  • 脚本录制大功告成，下面我们可以试着播放脚本，看看效果如何：

    • 将上面工程导出为jar包；
    • 用java -jar jar包名称运行jar包；
    • 此时，Selenium将自动为您开启浏览器，并播放刚才录制的网页动作，是不是非常方便！

  • 需要注意的是，在linux上面运行脚本，需要对chrome驱动赋予执行权限：

1
chmod +x chromedriver

进一步优化

  • 实现了录制和播放脚本还不够，我们要让整个轮播的过程更加优雅！
  • 可以添加下面的代码，实现浏览器自动全屏播放，是不是很炫！
1
2
3
4
// full screen automatic
ChormeOptions options = new ChormeOptions();
options.addArguments("kiosk");
driver = new ChromeDriver(options);
  • 如果您用的是windows系统，可直接将运行jar包的命令放在.bat文件中，这样如果有人来公司参观，直接双击.bat文件就能够实现轮播了，相当方便；
  • 如果您用的是linux系统，可以写一个shell脚本实现上述功能：
1
2
3
#!/bin/sh
cd /home/haohan/Desktop/looping_play/
java -jar /home/haohan/Desktop/looping_play/looping_play_linux64_2015.6.30.jar  &
  • 您还可以写一个.desktop文件，即桌面图标文件，链接到上面的shell脚本，这样双击桌面图标就能开启轮播功能！
1
2
3
4
5
6
7
8
9
10
11
#!/usr/bin/env xdg-open

[Desktop Entry]
Version=1.0
Name=Idea
Exec=looping_play/looping_play.sh
Terminal=false
Icon=looping_play/looping_play_pic.jpg
Type=Application
Categories=Development;
Name[en_US]=LoopingPlay
  • 现在我们完整的实现了整个轮播效果，我准备把它部署在公司门口的显示屏上，让每一个路过的人都能看到公司的产品展示！
您的支持是对我最大的鼓励！