欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  后端开发

也是无聊!用vue来输出B站的随机搜索关键词图片

程序员文章站 2024-02-03 09:32:22
...
http://ciyuanai.net/icon/就是这么这个东西~ 每天上B站都能看着这些图片,挺有趣的233

本来是想写 nodejs爬虫来下载这些图片,但是通过 cheerio抓取页面的元素老是提示 undefined,看了下网页源码,嗯哼!!确实是什么东西都没有的,在往Network一看,啊哈!原来是用json来输出的啊!

想了下直接用Vue输出啊,一个 v-for的事!但是用ajaxGet了一下,发现跨域了。本想用jsonp, CORS什么的解决方案的,但是实现来好像也是挺麻烦,所以我这里就用了php的curl(哈哈!神器啊)

通过php的 curl_init来获取网页内容:

$ch = curl_init();curl_setopt($ch, CURLOPT_URL, $url);curl_setopt($ch, CURLOPT_HEADER, 0);curl_setopt($ch, CURLOPT_RETURNTRANSFER,1);curl_setopt($ch, CURLOPT_ENCODING, "application/json"); //添加此项设置json编码,否则返回乱码;curl_setopt($ch, CURLOPT_TIMEOUT, 60);$json = curl_exec($ch);curl_close($ch);print_r($json);

好了!跨域的问题解决了~

后面直接通过jq的 $.getJSON,或者 $.ajax直接获取php返回的数据即可,这里我用 vue-resource,最后用 v-for来循环输出到页面即可!这里的页面用了flex布局,很强大的布局!