大概步骤：

目标效果

二、抓取排行榜首页数据

要点
- 进入QQ音乐移动端，查找Network中的排行榜首页数据，在XHR中找到
- 使用之前写好的jsonp解析数据的方法，传入处理好的url

jsonp数据

url数据

相关代码

import jsonp from '@/common/js/jsonp'   //引入jsonp模块
import {commonParams,object} from './config'//方法js不做成defaul，vue引入时要单花括号
export function getTopList(){//自己判断截取出url前半段const urlfront = 'https://c.y.qq.com/v8/fcg-bin/fcg_myqq_toplist.fcg'//把hash做成对象,es6创建对象并赋值,//固定的hash写在变量js模块 config.js里，const thehash = Object.assign({},commonParams,{notice: 0,platform: 'h5',needNewCode: 1,uin:0,})//执行jsonp模块//console.log(jsonp(urlfront,thehash,object))return jsonp(urlfront,thehash,object)  //执行封装了jsonp的方法
}

^ rank.js定义获取数据的方法

import {getTopList} from '@/api/rank'   //引入获取数据方法的getTopList().then((res)=>{if(res.code===ERR_OK){this.topList = res.data.topList}})

^ 在组件中调用获取数据的方法

把数据应用到html中即可

项目来源：慕课网
如有建议和疑问可联系
QQ：1017386624
邮箱：1017386624@qq.com

Vue音乐--排行榜页面02_抓取首页数据相关推荐

自动抓取app数据技术方案总结
在app运营过程中,有时候我们需要了解app中的一些数据,比如:我们自己开的网店,有时候app官方提供的数据并不能满足我们的实际需求,这时就需要使用工具来自动抓取我们自己店铺中有用的数据.一般有两种实 ...
java爬取验证码图片_JAVA HttpClient实现页面信息抓取(获取图片验证码并传入cookie实现信息获取)...
JAVA HttpClient实现页面信息抓取(获取图片验证码并传入cookie实现信息获取) 发布时间:2018-05-18 16:41, 浏览次数:632 , 标签: JAVA HttpClien ...
Vue音乐--搜索页面03_热门搜索组件
大概步骤: 目标效果三.新建热门搜索关键词组件的数据获取和布局要点: QQ音乐移动端网页抓取热门搜索的关键词数据截取关键词数据数组的前10个对数据列表布局为圆角边框样式点击热门搜索关键词,关 ...
网易新闻页面信息抓取（htmlagilitypack搭配scrapysharp）
转自原文网易新闻页面信息抓取(htmlagilitypack搭配scrapysharp) 最近在弄网页爬虫这方面的,上网看到关于htmlagilitypack搭配scrapysharp的文章,于是决 ...
网易新闻页面信息抓取 -- htmlagilitypack搭配scrapysharp
网易新闻页面信息抓取 -- htmlagilitypack搭配scrapysharp 最近在弄网页爬虫这方面的,上网看到关于htmlagilitypack搭配scrapysharp的文章,于是决定试一 ...
Python 爬虫篇#笔记02# | 网页请求原理和抓取网页数据
目录一. 网页请求原理 1.1 浏览网页的过程 1.2 统一资源定位符URL 1.3 计算机域名系统DNS 1.4 分析浏览器显示完整网页的过程 1.5 客户端THHP请求格式 1.6 服务端HTT ...
抓取网页数据并解析Android
抓取网页数据并解析标签: 网页抓取jsoupAndroid 2016-03-02 13:54 1262人阅读评论(1) 收藏举报分类: Android开发(原创)(7) 版权声明:本文为博 ...
一分钟学会如何自动抓取app数据
网络爬虫比较适合搜集web页面数据,但在app当道的时代,很多app根本就没有对应的web网站,所以使用传统的网络爬虫抓取数据已不再适用.最近研究了一下解决方案,发现目前市面上的解决方案要么是java ...
cookie追加数据_集算器 SPL 抓取网页数据
[摘要] 集算器 SPL 支持抓取网页数据,根据抓取定义规则,可将网页数据下载到在本地进行统计分析.具体定义规则要求.使用详细情况,请前往乾学院:集算器 SPL 抓取网页数据! 网站上的数据源是我们进 ...

Vue音乐--排行榜页面02_抓取首页数据

大概步骤：

目标效果

二、抓取排行榜首页数据

Vue音乐--排行榜页面02_抓取首页数据相关推荐

最新文章

热门文章