用C#+Selenium+ChromeDriver 生成我的咕咚跑步路线地图
程序员文章站
2022-06-24 12:37:01
先上结果： 之前 在公司业务中用过java+Selenium+ChromeDriver ，使用起来非常顺手，可以完美模拟真实的用户浏览行为。最近休息的时候想用C#也试一下，于是有了本文。 实现原理一样，只是由java换成了C#。（ps:个人感觉就业务开发代码来说，熟悉之后两种语言可以无缝切换。） 事 ......
先上结果：
之前 在公司业务中用过java+Selenium+ChromeDriver ，使用起来非常顺手，可以完美模拟真实的用户浏览行为。最近休息的时候想用C#也试一下，于是有了本文。
实现原理一样，只是由java换成了C#。（ps:个人感觉就业务开发代码来说，熟悉之后两种语言可以无缝切换。）
事先声明，代码中会采集用户登录咕咚网站之后的个人数据接口，如果此行为损害了咕咚网站的利益，请联系我删除或修改本文（我对采集行为一直本着每一次调用之后sleep的原则，毕竟不是为了把人家的网站搞死）。文中使用的数据是我自己的跑步数据，不涉及到其他用户的数据。
项目结构：为了方便跑友使用，用的winform程序，附nuget包
以下是form1.cs的代码，删除了部分提示的 MessageBox.Show()，从产品角度来讲，应该添加loading提示和进度条，这里就只放代码了。需要安装最新的chrome浏览器+代码中使用的chromedriver是 v2.9.248315
1 using Newtonsoft.Json;
2 using OpenQA.Selenium;
3 using OpenQA.Selenium.Chrome;
4 using System;
5 using System.Collections.Generic;
6 using System.ComponentModel;
7 using System.Data;
8 using System.Drawing;
9 using System.IO;
10 using System.Linq;
11 using System.Net;
12 using System.Text;
13 using System.Threading;
14 using System.Threading.Tasks;
15 using System.Windows.Forms;
16
17 namespace GuDongLine
18 {
19 public partial class Form1 : Form
20 {
21 public Form1()
22 {
23
24 InitializeComponent();
25 label2.Text = "请根据提示进行操作，本产品需要最新版本Chrome浏览器支持，网络良好的情况下运行，内部交流，不作为商业软件，如有侵权请扫中间微信二维码联系我。祝各位跑友生活愉快，身体健康，happy PB";
26 }
27 delegate void ChangeInvoke(int num);
28 public int Fun1;
29 private void button1_Click(object sender, EventArgs e)
30 {
31 try
32 {
33 Thread thread = new Thread(go);
34 thread.Start();
35
36 }
37 catch (Exception)
38 {
39 MessageBox.Show("操作异常，请重新打开，或联系我");
40 }
41
42 }
43 private void ChangeNum()
44 {
45 MessageBox.Show("正在运行请等待！运行完毕后会有提示！");
46 }
47 public void go()
48 {
49 if (MessageBox.Show("下面请登录咕咚，本软件只会向咕咚官网发送和接受数据，如果发现软件向其他网址发送数据，说明本软件被修改，可能有病毒", "登录咕咚账号", MessageBoxButtons.OKCancel).Equals(DialogResult.OK))
50 {
51 ChromeOptions options = new ChromeOptions();
52 options.AddArguments("--test-type", "--ignore-certificate-errors");
53 IWebDriver driver = new ChromeDriver(System.Environment.CurrentDirectory, options);
54 driver.Url = "http://www.codoon.com/home";
55 Thread.Sleep(10000);
56
57 driver.Navigate().GoToUrl("http://www.codoon.com/gps_sports/my_routes");
58
59
60 Thread.Sleep(5000);
61 int runCount = int.Parse(driver.FindElement(By.Id("current_index")).Text) / 3;
62 for (int i = 0; i < runCount + 5000; i++)
63 {
64 try
65 {
66 driver.FindElement(By.ClassName("more_data")).Click();
67 Thread.Sleep(800);
68 }
69 catch (Exception)
70 {
71 if (i > runCount + 100)
72 {
73 break;
74 }
75
76 }
77 }
78 Thread thread2 = new Thread(ChangeNum);
79 thread2.Start();
80 string userId = driver.FindElement(By.ClassName("home_user_header")).GetAttribute("src").Substring(33, 36);
81 string data = "";
82 dynamic va = driver.FindElements(By.ClassName("detail_sports_content"));
83 foreach (IWebElement iwe in va)
84 {
85 using (var client = new WebClient())
86 {
87 Thread.Sleep(200);
88 var responseString = client.DownloadString("http://www.codoon.com/gps_sports/route?user_id=" + userId + "&route_id=" + iwe.FindElement(By.TagName("table")).GetAttribute("id") + "&need_next=1&_=1520349266435");
89
90
91 var DynamicObject = JsonConvert.DeserializeObject<dynamic>(responseString);
92 string ss = "";
93 foreach (var s in DynamicObject.line)
94 {
95 ss += ((double)s[1] + 0.0062).ToString() + "," + ((double)s[0] + 0.00135).ToString() + ";";
96 }
97 ss = ss.Remove(ss.Length - 1);
98 data += ss + "&";
99 }
100 }
101 data = data.Remove(data.Length - 1);
102 driver.Close();
103 string html = @"<!DOCTYPE html><html lang='zh - CN\'>
104 <head>
105
106 <meta charset = 'utf-8'>
107
108 <meta http - equiv = 'X-UA-Compatible' content = 'IE=edge'>
109
110 <meta name = 'viewport' content = 'width=device-width, initial-scale=1'>
111
112 <title> my_all_run_lines </title>
113
114 <link rel = 'stylesheet' href = 'http://cache.amap.com/lbs/static/main1119.css' />
115 </head>
116 <body>
117 <div id = 'container' class='container'></div>
118 <script src = 'http://webapi.amap.com/loca?key=6ac3f558819c2c4711ea0c0a37192137'></script>
119 <script src='http://a.amap.com/Loca/static/dist/jquery.min.js'></script>
120 <script>
121
122 var map = Loca.create('container', {
123 key: '1e387d3db027b46a23600cf7f2ed7344',
124 mapStyle: 'amap://styles/grey',
125 features: ['bg', 'road'],
126 zoom: 10
127 });
128
129 var layer = Loca.visualLayer({
130 container: map,
131 type: 'line',
132 shape: 'line',
133 });
134
135 $.get('http://a.amap.com/Loca/static/mock/buslines.txt', function (data) {
136 data = '" + data + "';" + "" +
137 "" +
138 "" +
139 "" +
140 "" +
141 "" + @"var lines = data.split('&').map(function (item) {
142 return {
143 linePath: item.split(';').map(function(lnglat) {
144 return lnglat.split(',');
145 })
146 };
147 });
148
149 layer.setData(lines, {
150 lnglat: 'linePath'
151 });
152 layer.setOptions({
153 style: {
154 opacity: 0.2,
155 lineWidth: 2,
156 stroke: '#b7eff7',
157 }
158 });
159
160 layer.render();
161 })
162
163 </script>
164 </body>
165 </html>";
166
167 string path = System.Environment.CurrentDirectory + "\\map.html";
168 File.WriteAllText(path, html);
169 }
170 else
171 {
172 System.Environment.Exit(0);
173 }
174 }
175
176 }
177 }
178
179
说一下思路:
1.确定使用的语言和采集框架。
2.确定数据来源，从咕咚app还是咕咚网站，如果咕咚网站没有提供接口，估计就得去研究app了。本文中耗费时间的一个点就在研究咕咚网站的请求数据的规则上了，原则来说，只要正常用户能打开的网页，无法挡住采集工具。
3.数据的展示：找了百度地图和高德地图的api接口，两个也都分别试了一下，其实咕咚网本身是使用的谷歌的，但是谷歌的接口研究起来不太方便，最后从数据展示的效果上选择了高德地图，顺便说一下，从咕咚采集的跑步数据其实是一组一组的经纬度坐标，而且是被阉割的经纬度，精确度不够，所以地图上显示的时候会有偏差，随着跑步距离的增长，数据量也比较大，以文中1700公里的跑量，生成的展示html是2.42M ，我家里的古董笔记本加载的时间比较长。
另：很久以前跟咕咚的客服打过电话，想要一个集成自己所有跑步路线的功能，貌似答应的很好，但是没发现app中有此功能（本文的由来？），当然，如果提供这个功能，一下加载这么多数据，对服务器来说不太好，但是可以迂回一下嘛，比如只生成一个月之前的？申请之后生成？个人感觉有许多解决办法，而且也能做成一种营销活动。
欢迎探讨，欢迎指教，谢谢大家，希望每一个程序员身体健康。
by：跑过16+17北马的coder