Pagetual

Tự động tìm các trang web được phân trang tiếp theo và chèn vào trang hiện tại để cuộn vô hạn. Hỗ trợ hàng ngàn trang web mà không cần bất kỳ quy tắc nào.

< Feedback on Pagetual

Review: Good - script works

§
Posted: 19-09-2022
Edited: 19-09-2022

請問如何設置加載特定網址.js裡的代碼,並且執行。
如https://softblog.tw/wp-content/plugins/jetpack/jetpack_vendor/automattic/jetpack-lazy-images/dist/lazy-images.js

    {
        "name": "軟體部落",
        "action": 0,
        "url": "^https?://softblog\\.tw/",
        "include": ".page-numbers",
        "nextLink": "a.next",
        "pageElement": "#blog-entries>[id^=post]",
        "rate": 3,
        "pageBar": 0
    },

設置"action": 0或1都無法顯示圖片,必須設置為2。

    {
        "name": "軟體部落",
        "action": 2,
        "url": "^https?://softblog\\.tw/",
        "include": ".page-numbers",
        "nextLink": "a.next",
        "pageElement": "#blog-entries>[id^=post]",
        "css": "inIframe:.boxed-layout #wrap .container{padding-left: 0px!important;padding-right:0px!important;}",
        "rate": 3,
        "pageBar": 0
    },

測試設置"action": 0或1的情況,只要把顯示圖片的代碼丟到F12主控台運行,就能顯示圖片。
但把整個代碼放到pageAction卻無法顯示圖片
不過"action": 1翻一頁後就卡住了

巴哈姆特的情況這樣設置就能顯示文章預覽圖
"pageAction": "Forum.B.lazyThumbnail();Forum.Common.drawNoImageCanvas();",

會發問只是想能不使用iframe模式就不用

hoothinTác giả
§
Posted: 19-09-2022
    {
        "name": "軟體部落",
        "url": "^https?://softblog\\.tw/",
        "pageElement": "article.blog-entry",
        "pageAction": "eles.forEach(ele=>{let img=ele.querySelector('img');if(img){img.src=img.dataset.lazySrc;img.srcset='';}})"
    }

這樣就可以了。

action:1無效是因爲元素沒有到視野内,可以換用waitElement來加載圖片。但具體到這個站,只需要action:0就可以了

hoothinTác giả
§
Posted: 19-09-2022

新版本(1.9.31.27)簡化了上述規則項,可以寫成這樣,兩者等價

    {
        "name": "軟體部落",
        "url": "^https?://softblog\\.tw/",
        "pageElement": "article.blog-entry",
        "lazyImgSrc": [
            "data-lazy-src",
            "srcset"
        ]
    }

歡迎把編輯好的規則項提交到github規則庫

§
Posted: 20-09-2022

軟體部落的問題解決了,直接靜態就能顯示圖片,感謝大大啊。

不過弱弱的問一句github規則庫在哪啊?

目前還有個站有問題請教您

    {
        "name": "avple.tv - 類別",
        "example": "https://avple.tv/tags/135/1/date",
        "action": 2,
        "url": "^https://avple\\.tv/tags/\\d+/\\d+/\\w+$",
        "exclude": "button[aria-label*='next'][tabindex='-1']",
        "nextLinkByUrl": [
            "(/\\d+/)(\\d+)(/\\w+)$",
            "$1{$2+1}$3"
        ],
        "pageElement": ".jss23",
        "replaceElement": ".jss15",
        "waitElement": [
            ".lazyload-wrapper>img",
            ".lazyload-wrapper>.lazyload-placeholder"
        ],
        "pageBar": 1,
        "css": "inIframe:header{display:none!important;}.jss23{margin-left:-7px;margin-right:7px;}",
        "fitWidth": false
    }

設置為"action": 1因為等不到waitElement完成卡在載入中,刪掉waitElement又無法顯示圖片,好像又不能用lazyImgSrc來解決,也找不到讓網站顯示圖片的代碼藏在哪,有能不使用"action": 2就顯示圖片的方法嗎?

我的理解是"action": 2是無限插入iframe來讀取整個網頁,感覺塞入了太多不必要的內容,想盡量避免使用,雖然很無腦又方便。
"action": 1是網頁底部插入一個iframe加載整個網頁後,只取出pageElement插入到本來的網頁,之後刪除iframe。

另外關於nextLinkByUrl,能不能再加個lastpage的設定,來判斷是否已是最後一頁,如網頁已經不包含下一頁的元素了。
測試用replaceElement替換頁碼條再搭配exclude,看能不能防止繼續翻頁,結果不行還是會繼續增加頁碼進行翻頁,只有直接跳轉到最後一頁才不會觸發翻頁,應該是exclude只會做一次判斷,翻下一頁後不會再判斷一次。

對於代碼小白nextLinkByUrl參照範例還能理解怎麼使用,但nextLinkByJs完全無法理解怎麼用,哈哈,所以當遇到頁碼是用JS沒有直接鏈接,對小白來說用nextLinkByUrl加lastPage這樣比較容易上手。

最後還有一個關於"history": 1

以小說站為例
由第一章翻到第二章預讀第三章,地址欄卻還是維持在第一章的鏈接沒有變化,瀏覽器歷史無第二章紀錄,由於預讀小說站後台紀錄閱讀到第三章,實則瀏覽器目前是閱讀第二章。
翻到第三章預讀第四章,地址欄這才顯示第二章的鏈接,瀏覽器歷史有了第二章的紀錄,由於預讀小說站後台紀錄閱讀到第四章,實則瀏覽器目前是閱讀第三章。

整個感覺就有點怪怪的慢了一拍,不該是翻到第三章,地址欄就顯示第三章的鏈接,瀏覽器歷史寫入第三章的紀錄這樣嗎?
如果本來就這樣設計,能不能增加"history": 2,翻到了哪一頁,地址欄地址和瀏覽器歷史是同步的。

hoothinTác giả
§
Posted: 20-09-2022

好建議!我加入待辦列表了。明天試著優化一下你提到的幾點。

插句題外話,你有興趣幫我試用下這個類似同文堂的脚本,順便給些吐槽和改進意見嗎?

hoothinTác giả
§
Posted: 21-09-2022
    {
        "name": "avple.tv",
        "author": "tony0809",
        "example": "https://avple.tv/tags/135/1/date",
        "url": "^https://avple\\.tv/tags/\\d+/\\d+/\\w+$",
        "action": 1,
        "nextLinkByUrl": [
            "(/\\d+/)(\\d+)(/\\w+)$",
            "$1{$2+1}$3",
            "[aria-label='Go to next page']:not(.Mui-disabled)"
        ],
        "pageElement": ".jss23",
        "replaceElement": ".jss15",
        "waitElement": [
            ".lazyload-wrapper>img",
            ".lazyload-wrapper>.lazyload-placeholder"
        ],
        "pageBar": 1,
        "history": 2,
        "css": "inIframe:header{display:none!important;}.jss23{margin-left:-7px;margin-right:7px;}"
    }

更新了以下幾點

  1. nextLinkByUrl 第三項為必須存在的元素,第四項為必須不存在的元素,可以作爲停止條件
  2. waitElement 現在可以兼容這種使用 material-ui 寫的站了
  3. history: 2 為插入立即寫入歷史
§
Posted: 22-09-2022

新版本確實能使其顯示圖片了,但並非100%成功,翻頁有約30%機率或更高機率沒有顯示圖片,因為有些元素還是沒有變換完成。

代碼小白嘗試了好久...
觀察有顯示圖片和沒有顯示圖片,元素到底差在哪裡。
一開始img的class是jss29,span的class是jss28。需等待變成img.jss28才會顯示圖片,span.jss28變成span.jss29,才會清除span的佔位。
網頁有個css是.jss29{display:none;}

之後waitElement改成這樣,依然有5%的機率沒有顯示圖片,會有漏網之魚。

"waitElement": [
".lazyload-wrapper>img.jss28",
".lazyload-placeholder,span.jss28"
],

最後改成這樣再加上pageAction和css,總算是100%顯示圖片了,也不會有多餘的佔位。

"waitElement": [
".lazyload-wrapper>img",
".lazyload-placeholder"
],
"pageAction": "[].forEach.call(eles, ele=>{[].forEach.call(ele.querySelectorAll('img.jss29'), img=>{img.setAttribute('class','jss28')})})",
"css": ".lazyload-wrapper+span.jss28{display:none!important;}"

弄好的完整規則

    {
        "name": "avple.tv - 類別",
        "author": "tony0809",
        "example": "https://avple.tv/tags/135/1/date",
        "url": "^https://avple\\.tv/tags/\\d+/\\d+/\\w+$",
        "action": 1,
        "nextLinkByUrl": [
            "(/\\d+/)(\\d+)(/\\w+)$",
            "$1{$2+1}$3",
            "[aria-label='Go to next page']:not(.Mui-disabled)"
        ],
        "pageElement": ".jss23",
        "replaceElement": ".jss15",
        "waitElement": [
            ".lazyload-wrapper>img",
            ".lazyload-placeholder"
        ],
        "pageAction": "[].forEach.call(eles, ele=>{[].forEach.call(ele.querySelectorAll('img.jss29'), img=>{img.setAttribute('class','jss28')})})",
        "css": ".lazyload-wrapper+span.jss28{display:none!important;}",
        "pageBar": 1
    },
    {
        "name": "avple.tv - 搜索",
        "author": "tony0809",
        "example": "https://avple.tv/search?key=FC2PPV&page=1&sort=date",
        "action": 1,
        "url": "^https://avple\\.tv/search\\?key=",
        "nextLinkByUrl": [
            "(&page=)(\\d+)(&.+)$",
            "$1{$2+1}$3",
            "[aria-label='Go to next page']:not(.Mui-disabled)"
        ],
        "pageElement": ".jss23",
        "replaceElement": ".jss15",
        "waitElement": [
            ".lazyload-wrapper>img",
            ".lazyload-placeholder"
        ],
        "pageAction": "[].forEach.call(eles, ele=>{[].forEach.call(ele.querySelectorAll('img.jss29'), img=>{img.setAttribute('class','jss28')})})",
        "css": ".lazyload-wrapper+span.jss28{display:none!important;}",
        "pageBar": 1
    },

話說昨天看規則才發現,這個站的架構跟NETFLAV是一樣的,看了一下內建規則nextLink填a[aria-current='true']+a,居然就能獲取下一頁的鏈接,好神奇啊!
想說avple.tv也這樣寫行不行,//li[(button/@aria-current='true')]/following-sibling::li/button和[aria-label='Go to next page'],不過最多成功翻一頁後就卡住了,哈哈。

感謝大大辛苦更新了,腳本真的超好用!

Post reply

Đăng nhập để bình luận