ajax - 如何在 Chrome 开发人员工具中捕获特定的 AJAX (XHR) 事件?
问题描述
我正在尝试从美国邮政服务的 Every Door Direct Mail 服务中获取一些信息。服务很简单。在USPS EDDM 网站上,用户输入邮政编码,例如 10030,单击搜索按钮,然后显示地图。该调用很容易在浏览器开发者控制台中捕获。这只是一个像这样的 GET 请求:
https://gis.usps.com/arcgis/rest/services/EDDM/selectZIP/GPServer/routes/execute?f=json&env:outSR=102100&ZIP=10030&Rte_Box=R&UserName=EDDM
但是,问题是试图捕获页面右侧显示的表格或文本信息。“显示表格”选项:
显示这样的输出,此时您可以单击“全选(10 条路线)”,它会在页面右侧显示类似的内容:
如何捕获这组 Javascript “按钮单击”请求?现在我只是试图捕获这些请求,以便我可以以编程方式复制它们(在 Python 中,但这在这里并不严格相关)。
解决方案
看起来您需要发出两个 GET 请求才能获取所有数据。第二个请求是获取邮政信箱总数所必需的。也许它们可以合二为一,我没有深入研究它。
https://gis.usps.com/arcgis/rest/services/EDDM/selectZIP/GPServer/routes/execute?f=json&env%3AoutSR=102100&ZIP=10030&Rte_Box=R&UserName=EDDM
https://gis.usps.com/arcgis/rest/services/EDDM/selectZIP/GPServer/boxes/execute?f=json&env%3AoutSR=102100&ZIP=10030&Rte_Box=B&UserName=EDDM&extent=%7B%22xmin%22%3A-15628202.596646052%2C%22ymin%22%3A749662.6717286934%2C%22xmax%22%3A-6235620.560966092%2C%22ymax%22%3A7070087.666571667%2C%22spatialReference%22%3A%7B%22wkid%22%3A102100%7D%7D
我知道您使用的是 Python,但由于您使用的是 Chrome DevTools,因此这里有一个 JavaScript 示例,说明如何获取交付地址的总数:
let promises = [
fetch('https://gis.usps.com/arcgis/rest/services/EDDM/selectZIP/GPServer/routes/execute?f=json&env%3AoutSR=102100&ZIP=10030&Rte_Box=R&UserName=EDDM'),
fetch('https://gis.usps.com/arcgis/rest/services/EDDM/selectZIP/GPServer/boxes/execute?f=json&env%3AoutSR=102100&ZIP=10030&Rte_Box=B&UserName=EDDM&extent=%7B%22xmin%22%3A-15628202.596646052%2C%22ymin%22%3A749662.6717286934%2C%22xmax%22%3A-6235620.560966092%2C%22ymax%22%3A7070087.666571667%2C%22spatialReference%22%3A%7B%22wkid%22%3A102100%7D%7D')
];
Promise.all(promises)
.then(async res => {
if (res[0].ok && res[1].ok) {
const first = await res[0].json();
const second = await res[1].json();
const results = [...first.results[0].value.features, ...second.results[0].value.features];
console.log("Total Residential Addresses:", results.reduce((acc, row) => acc + row.attributes.RES_CNT, 0));
console.log("Total Business Addresses:", results.reduce((acc, row) => acc + row.attributes.BUS_CNT, 0));
console.log("Total Delivery Addresses:", results.reduce((acc, row) => acc + row.attributes.TOT_CNT, 0));
}
});
更新以显示如何分别检索住宅和商业地址。
推荐阅读
- javascript - 从中获取值
onSubmit 使用 React.js 和 redux。 - php - WooCommerce - 获取产品子类别
- np - NP、NP-Complete、NP-Hard 问题
- oracle - 按近似值划分
- laravel - 如何更改 Sentinel 记住我 cookie 的生命周期?
- ruby-on-rails - 时间数据类型上的时区未按预期工作-Rails 5
- angular - 如何在 Angular 6 中测试应用程序/根组件
- java - 在 Spring Boot 2 中记录正文的最有效方法是什么?
- python - 在函数中传递一个元组
- python - 如何在 Python 中提高不平衡数据集的精度和召回率