编写e-hentai站点规则遇到的问题

下午的时候，抽空写了下e-hentai的站点规则。本来应该是很简单的，因为e-hentai的页面都是一致，那就代表不需要针对不同的Page编写不同的规则，只需要编写一套规则就就可以全部页面通用了。但是编写的过程中还是遇到点小麻烦，当然最后还是解决了，写这篇文章就是为了分享下这些技巧。

编写的时候，我使用的是Google Chrome（我说的是PC版）来看源码和定位元素的，这对编写Selector是非常有好处的！

问题1：如何获取封面图片？

在获取列表页的封面时，用Google Chrome看到的源码应该是通过元素“div.it2 img”的“src”属性来获取图片链接的，结果Yealico显示不出来。为什么呢？最后才发现，e-hentai的源码并没有“img”这个元素，那为什么Google Chrome会看到img呢？因为e-hentai有写JS脚本，当鼠标移到标题上面时，就会重写源码，并设置img。通过查看源码，就会发现div.it2中包含了封面图片的相关信息，然后我们可以通过正则表达式获取到正确的图片链接。如下：

Selector: div.it2
Function: html
Regex: (//|inits?~)(.*?org)[~/]([^~]*\.jpg)[~"]
Replace: https://$2/$3

问题2：如何获取画册评分？

e-hentai的列表页面并没有直接给出每个画册的数字评分，而是通过星星来表示，而这个星星是一张图片，e-hentai通过CSS来设置图片的移位来显示对应的评分。这个通过移位显示评分的内在数学表达式，没点初中的数学基础，估计也是写不出来的。如下：

Selector: div.ir
Function: attr
Param: style
Regex: background-position:-?(\d+)px -?(\d+)px
Replace: 5-$1/16-($2-1)/40

上面这个5-$1/16-($2-1)/40表达式足足花费了我15分钟来思考。

这里有一个很重要的技巧，获取评分是可以通过数学表达式获取的。先是通过Regex获取你需要的数字信息，然后通过Replace来写出数学表达式来计算评分。我当时是非常惊讶Yealico竟然还提供了这种方式，应该是开发者当初设计规则的时候也考虑了好多网站的各种不同情况。官方网站的站点规则编写规范中关于Replacement的描述也有写到：

Of course, it can also be a mathematical expression, which is generally used to obtain a Rating.

问题3：缩略图是一整张大图的切割该如何显示？

e-hentai的缩略图是一整张大图，然后通过CSS来移位来显示的，这个跟评分的方式是一样的。那我们只能获取到一张大图，貌似没有办法直接获取到对应的图片啊。最后还是在官方网站的站点规则编写规范中找到了答案，使用repeatedThumbnail这个flag。

repeatedThumbnail
The acquired thumbnail is a large image, which is then displaced by background-position.

这个简直像魔法一样的flag，作为一名程序猿，反正我是到现在都没搞懂Yealico是如何实现自动切割这个功能的。特么的，实在是厉害。

我们只需要获取到缩略图，然后在站点规则的flags属性中写入repeatedThumbnail，Yealico就是自动正常显示缩略图了。

PS: 写站点规则，其实有个好处，就是可以更加熟悉CSS选择器和正则表达式。这两个对于平时写JS还是非常有帮助的。

阿巴基猫あばき猫