pixiv网页版(pixiv网页版游览)

NodeJS扒Pixiv咱P站的个人收藏夹经历

着重说明，非墙内向，体验代码时务必保证科学上网环境。

Pixiv

场景

咱大P站，绅士聚集地……你好我好大家好，身体越来越不好。

我这边需要把自己多年收藏的图集整理出来，然后永久保存在移动“硬”盘里，不多，就1000多张。但是，一张一张的点击，放大，再右键，实在是麻烦。所以便闲着花一小时写了个脚本，爬一下。

其实就是我会员到期了……

说明

爬P站收藏夹算是我这段时间爬的最简单的数据了……讲真，不知道是P站不怕你爬还是技术团队忽视这一块，实在是简单的头大。以上不考虑登录过程。

P站收藏夹保存本地常规方式

显示收藏夹看目标作品（接一下TID大佬的Niya一用）：

目标作品

进击进入目标作品：

目标作品页

点击图片放大看原图：

大图

然后右键：

右键

到这里，大家应该问题都不大。因为我们都是这么干的嘛……

爬取思路查询相关接口拿到cookie（不搞登录了）关键referer

对，这三个就够了，没有淘宝那些坑爹的验证与算法。当然，你用Cookie去啃淘宝也不会太麻烦。

查询相关接口

这个很简单，因为P站是PHP的SSR，直接请求页面即可。

页面为：https://www.pixiv.net/bookmark.php?rest=show&p=1

p=这个参数直接点击进来是没有的，但是后面翻页会带上，所以我们默认就写上即可。

那么很简单，这里的p相关的数字一定得有个字段记录下，那么我们就弄个page吧：

let page = 1\\n

然后就是请求这个页面了，再分析页面的各种标签了，我们当然借用superagent与cheerio了。superagent就不多说了，请求神器。cheerio可以理解就是服务端用的jQuery，老朋友了。

还有少不了的写文件与配置文件，写文件自然是fs，配置文件自己来，我喜欢如下：

配置文件

啥，Cookie和referer哪里来？看这：

获取点

cookie

referer

然后我们习惯性的记得，页面内容数量有上限的情况下，弄个参数记录当前索引。因为P站的收藏夹一个页面有20个图片，所以我们要记录下来，但是事实上，为了安全起见，这个最大数量最好是抓到数据后拿长度，这里先这么写，大家知道有这个东西即可。

let page = 1\\n , pageCurrentLength = 0\\n , pageMaxLength = 1\\n

分别是：页码、当前页内的图片数量、当前页面最大数量。

那么加上引用包，我们的准备工作就就绪了，引入如下：

const config = require(\\\’./config/index\\\’)\\nconst request = require(\\\’superagent\\\’)\\nconst fs = require(\\\’fs\\\’)\\nconst cheerio = require(\\\’cheerio\\\’)\\n

分别是：配置文件、superagent、fs、cheerio。

对了，记得npm install superagent cheerio啊。

开爬收藏页

找图片

通过调试器，我们很容易就找到图片对应的链接地址。这里随手搜索下相应class，发现刚好是20个，那么就可以简单的class来selector即可获取所有图片模块了。

之前都说了，cheerio就是服务端的jQuery，所以很容易就拿到，代码如下：

let thumbnails = $(\\\’._layout-thumbnail>img\\\’)\\n , titles = $(\\\’a>h1.title\\\’)\\n

恩，因为我们要命名图片，所以顺手把下面的title一起扣下来了，查找方式跟上面查图片木块一样一样的。

注意，这里与常规想法不同，P站简单的另一个原因。

我这里有留意看了下P站放大图片与这里缩略图的关系，然后发现，还真有关系。也因此，我节省了大批代码，不用去爬二级页面了。具体关系如下：

缩略图：https://i.pximg.net/c/150×150/img-master/img/2014/11/11/00/09/34/47020705_p0_master1200.jpg

放大图：https://i.pximg.net/img-original/img/2014/11/11/00/09/34/47020705_p0.png

相关关键词：

/c/150×150/img-master，_master1200，/img-original。

简单来说，/c/150×150/img-master换成/img-original，_master1200拿掉，就是放大图了。呼~这样就简单多了（这里有个坑，放大图后缀未必与这里一样，但是就png与jpg两种，后面有个函数专门干这个事情）。

正则搞起来：

originImgUrl = imgUrl.replace(/\\\\/c\\\\/150×150\\\\/img-master(.*?)_master1200/, \\\’/img-original$1\\\’)\\n

imgUrl就是原来的缩略图，而originImgUrl就是我们的放大原图了，还是比较简单了嘛。

到这里（省略了常规性步骤），我们已经从收藏页获取了最多20个的图片模块，然后图片模块拿到了title以及通过正则匹配规则获取了原图路径，所以下面我们就是把图片弄下来，保存本地了。

是时候来fs了。

保存本地

核心代码：

let stream = fs.createWriteStream(`./pixiv/imgs/${imgName.replace(/\\\\//g, \\\’\\\’)}`)\\n , req = request.get(originImgUrl)\\n .set(\\\’cookie\\\’, config.cookie)\\n .set(\\\’referer\\\’, config.referer)\\nreq.pipe(stream)\\nreq.on(\\\’end\\\’, () => {\\n if(++pageCurrentLength >= pageMaxLength) restart(++page)\\n})\\n

一个pipe的事情。

关于pipe，这里不多说，有兴趣的看下Node官方，如果只是看本文主题，复制这一坨代码即可。

过程嘛，就是请求的文件按照流Stream模式写入文件，避免大文件卡内存问题。

注意点是最后那个on end，每个文件写完后我们要确定收到，然后把文件数加一，直到文件写入达到页面所有数目，进行++page翻页。至于restart函数，明显就是启动函数了，这里调用启动函数一下。具体文末的代码会有总结，源码也有。

这里梳理一下先

我们干了这么几件事。

收集整理cookie与referer来解决正常访问问题。抓取php页面，然后分析功能模块。找到缩略图与原图的规律，然后直接拿到原图的链接。请求链接，看下是否有这个图片，如果没有就换一下后缀。下载保存原图。

第一个是手动的，所以代码里面只是粘贴过来，我们不做业务处理。

第二与第三个合并一起，可以看做是功能模块，所以我们独立一个函数。

第四个，当做检测函数。

最后一个，独立一个函数。

于是我们有了三个函数，解决上述问题。

核心模块函数

restart，就是启动函数，启动干嘛，自然是访问网页然后分析相关模块。

checkLinkStatus，检查图片类型状态，确定图片正确链接，我们只要head即可，所以使用了HEAD，而不是GET。

downloadFile，下载文件啦。

其中，需要传参如下：

checkLinkStatus({ imgTitle, imgName, originImgUrl }, index)

downloadFile({imgName, originImgUrl })

这里有优化点，不过我不打算弄了……等猴年马月维护吧。

checkLinkStatus使用的是HEAD，因为有没有这个文件，HEAD获取的报文头就已经知道了，没必要获取http请求的报文体了，也是为了加速。

至此，我们主逻辑全部完成，下面就是核心源码了。

核心源码

头条排版坑爹，先图片再代码（辣眼睛）：

top

middle

bottom

排版无敌的代码来了，下面有源码……

const config = require(\\\’./config/index\\\’)\\nconst request = require(\\\’superagent\\\’)\\nconst fs = require(\\\’fs\\\’)\\nconst cheerio = require(\\\’cheerio\\\’)\\n// start page\\nlet page = 1\\n , pageCurrentLength = 0\\n , pageMaxLength = 1\\nfunction restart() {\\n pageCurrentLength = 0\\n // debugger\\n // if(page > 2) return\\n request\\n .get(`https://www.pixiv.net/bookmark.php?rest=show&p=${page}`)\\n .set(\\\’cookie\\\’, config.cookie)\\n .set(\\\’referer\\\’, config.referer)\\n .end((err, res) => {\\n if(err) {\\n console.log(err)\\n }\\n const result = res.text\\n $ = cheerio.load(result)\\n let thumbnails = $(\\\’._layout-thumbnail>img\\\’)\\n , titles = $(\\\’a>h1.title\\\’)\\n // max length base on thumbnails length\\n pageMaxLength = thumbnails.length\\n Array.from(thumbnails).forEach(async (thumbnail, index) => {\\n // debugger\\n // if(index) return\\n let imgUrl = thumbnail.attribs[\\\’data-src\\\’]\\n , imgFix = imgUrl.match(/\\\\.\\\\w+$/)[0]\\n , imgTitle = titles[index].attribs.title\\n , imgName = imgTitle + imgFix\\n // normal rule with scale img and origin img.\\n , originImgUrl = imgUrl.replace(/\\\\/c\\\\/150×150\\\\/img-master(.*?)_master1200/, \\\’/img-original$1\\\’)\\n checkLinkStatus({ imgTitle, imgName, originImgUrl }, index)\\n })\\n })\\n}\\nfunction checkLinkStatus({ imgTitle, imgName, originImgUrl }, index) {\\n request.head(originImgUrl)\\n .set(\\\’cookie\\\’, config.cookie)\\n .set(\\\’referer\\\’, config.referer)\\n .end((err, res) => {\\n // img\\\’s suffix maybe wrong. then should change to another one.(png and jpg)\\n if(err) {\\n let originImgUrlFix = originImgUrl.match(/\\\\.\\\\w+$/)[0]\\n , png = \\\’.png\\\’\\n , jpg = \\\’.jpg\\\’\\n if(originImgUrlFix === png) {\\n imgName = imgTitle + jpg\\n originImgUrl = originImgUrl.replace(/\\\\.\\\\w+$/, jpg)\\n }\\n else {\\n imgName = imgTitle + png\\n originImgUrl = originImgUrl.replace(/\\\\.\\\\w+$/, png)\\n }\\n }\\n setTimeout(downloadFile.bind(null, { imgTitle, imgName, originImgUrl }), config.timeout * index);\\n })\\n}\\nfunction downloadFile({ imgTitle, imgName, originImgUrl }) {\\n // ignore \\\’/\\\’ error\\n let stream = fs.createWriteStream(`./pixiv_col/imgs/${imgName.replace(/\\\\//g, \\\’\\\’)}`)\\n , req = request.get(originImgUrl)\\n .set(\\\’cookie\\\’, config.cookie)\\n .set(\\\’referer\\\’, config.referer)\\n req.pipe(stream)\\n req.on(\\\’end\\\’, () => {\\n if(++pageCurrentLength >= pageMaxLength) restart(++page)\\n })\\n}\\nrestart()\\n

上面都已经说明了，这里就不再带上过多注释了，没错，就是懒……

至于config，两种方案，一来看上面截图自己写一个，二来GitHub源码拉下来，自己改一下。

源码

GitHub：https://github.com/ZweiZhao/Spider

如需要，建议使用dev分支，代码最新。

拉取后，cd Spider然后npm i，最后npm run pc即可运行。

不要忘了，运行前去弄一下Cookie！！！

不要忘了，运行前去弄一下Cookie！！！

不要忘了，运行前去弄一下Cookie！！！

效果

效果

兄弟们，我先去伤身体了。

后浪们，你要网站不要？这几个画师常去的网站不收藏一下嘛

推荐几个插画师常去的网站，供小伙伴们参考围观。各位有推荐的网站，可以留言哦！国内的微博、LOFTER、豆瓣、需要翻墙的FB、INS就不多说啦。个人体验是，微博偏向于作品展示和个人生活，LOFTER和豆瓣作品展示比较多；INS上经常能遇见大师，FB上除了作品之外，有更多的心得分享和视频。

Behance

网址：https://www.behance.net/

设计社区，被Adobe以1.5亿美元收购。一个没有产品经理，产品完全由设计师设计的网站。个人非常喜欢，Behance上常驻的有设计师、插画师、品牌工作室，除了插画作品之外，还有许多设计作品，非常有意思。

pixiv

网址：http://www.pixiv.net/

俗称p站，霓虹国出产，二次元聚集地，也有许多中国画手进驻。p站有漫画、小说和插画，最热的是插画部分，也有自己的聊天室和博客。在p上刷图很开心，大部分作者会上传分辨率很高的大图。但是要精准的找到一位画师，目前过滤功能是需要付费的…

涂鸦王国

网址：http://www.poocg.com/works/new

老牌专业插画网站，好多年了，许多知名插画师都在这里，新手一样可以来展示你的作品。

pinterest

网址：https://www.pinterest.com/

花瓣网的原型…pinterest资源很多，你能搜到许多外国设计师、插画师的作品，然后跟到他的个人官网上去。

Esty

网址：https://www.etsy.com/

一个购物网站，主要销售的是手工艺品，类似淘宝，豆瓣东西板块有点这个味道，但esty更专业和集中。在这里你能买到插画师的各种作品，非常有趣，一个变现的好地方。

站酷

http://www.zcool.com.cn/

不得不提的站酷，设计师和插画师云集，互动很棒，很开放。在站酷，你可以在文章板块找到前辈们的经验谈，作品区涵盖面很广，也有插画师分享的过程图，总之，就是棒棒哒！很久之前曾在站酷上看过Parco写的“聊聊非科班怎么入行”，虽然不是设计师，但是很受触动，推荐大家围观~

视觉中国设计师区

http://www.shijue.me/

视觉中国，主页君个人很喜欢的网站之一。专业的设计师/插画师平台，并且引入了各项大赛。视觉中国还收购了全球第二大高端视觉内容版权服务供应商Corbis Images的全部资产，目测还有大轮扩张。

WEBTOON

http://www.webtoons.com/zh-hans/top

被无限挑战安利的…这是一个韩国的漫画网，怎么说呢，画风，真的很有个人风格。有中文版（这里面的驻站作家，在国内大家应该最熟悉赵石了吧？）结果安利完我也没有找到无敌pink…

BauBauHaus

http://www.baubauhaus.com/

综合了插画、摄影、时尚以及艺术相关作品的综合照片流式网站。打开速度很慢…

grafolio

http://www.grafolio.com/main.grfl

韩国的插画师网站，奈何打开速度真的很慢…+1

———————————————-下面是很赞的插画师个人网站推荐——————————————–

sakiroo

http://sakiroo.com/

韩国网站，插画师sakiroo（据说中午名是崔相贤？）的站点，高产，而且插画人设特别有意思。

n8w

http://www.n8w.com/

n8w，Nate Williams的个人网站，他是一位插画师，同时也是一名导演，在他的个站你可以看到许多插画衍生的周边产品。如果你想做发展自己的IP，不妨看看Nate Williams的个站。

既然说到了插画师，下回来聊聊插画师的个站吧~以及，再次呼吁市场尊重原创，以及，画师们，注意保护好自己的版权呀！

CARGO

网址：http://cargocollective.com/

一个个人发布平台，帮助作者提高曝光度。有许多设计作品、摄影和插画作品。

illustrationage

地址：https://illustrationage.com/

功能性网站，提供插画展示、在线教程（付费课程但并不贵）、图书售卖等一系列的功能，以及有许多作者官网及通信地址。超级nice~

directory of illustration

地址：http://www.directoryofillustration.com/

正如网站的名字，插画目录，在照片流之外，目录页中按插画师姓氏收录着作品。

CIA BLOG

地址：http://www.centralillustration.com/blog/

一个聚集着很多知名插画师的博客，能够给你带来许多灵感。

ELECTROCOMICS

地址：http://electrocomics.com/english/strips_engl.htm

一个欧洲漫画分享网站，很有意思，前提是，你要会一些英语（不，应该说要还不错才行）

CHRIS SILAS NEAL

地址：http://csneal.com/

插画师CHRIS SILAS NEAL的个人网站，很棒，官网上还有他的视频~（就是打开的网速非常慢）

CHRIS SILAS NEAL

地址：http://www.book-by-its-cover.com/

关于艺术家的笔记，同上条，你要会一些英语（不，应该说要还不错才行）

PAPERCRAVE

地址：http://papercrave.com/

个人很喜欢，是一个关于纸艺的网站。一个字，美！

大家如果有对板绘学习的疑问，想要了解的作品，或者有原创的作品想分享，欢迎评论或者私信联系哟~

（注：文章图片均来自网络，侵删）

关于P站作品id的使用方法与进入方法

P站怎么进？

10月18之前除移动网以外是可以正常访问的，国区dns污染之后对于电脑网页端只需要更改本地hosts文件

找到hosts，改为txt文件用记事本打开hosts，在最下面复制下面两行保存，再删掉.txt就行了。

210.129.120.41 www.pixiv.net accounts.pixiv.net

210.140.131.144 source.pixiv.net imgaz.pixiv.net

手机app或者网页端

可以通过root来更改hosts文件访问

更简单的方式: 用app，更换ip地址正常访问P站客户端

只需要下载一个能够更改dns的APP输入可以正常访问的地址就可以了。

神秘代码：1dFpPDqp grxr

superdns签到七天能用vip专线

puredns正常使用

作品id怎么用？

每一张作品都有一张作品数字id，拥有作品id之后

在=符号后面加上或更改数字作品id就能找到原图，点击图片放大到原始分辨率，就可以保存到原画。

https://www.pixiv.net/member_illust.php?mode=medium&illust_id=66032301

每个画师也都有自己的id，可以去关注

https://www.pixiv.net/member.php?id=1432050

同样是在=符号后面加上或更改数字id

注意画师id与作品id网址是不一样的，不能通用。

手机客户端上的P站官方APP是不能使用id搜索作品或画师的

推荐大家去下载第三方的P站客户端，一个新世界的大门哦。