国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

用純客戶端JavaScript來寫一個有趣的爬蟲

scq000 / 933人閱讀

摘要：拿寫爬蟲，聽起來貌似有些不靠譜爬蟲，大多人對于爬蟲的理解都停留在使用后端語言如寫的爬蟲。圖中顯示的那一個長條是原本不存在與原網(wǎng)站中的，而是通過油猴腳本自動載入腳本來創(chuàng)建的。最大作用是將網(wǎng)站類似于花瓣網(wǎng)中的圖片作品快速的抓取下來。

拿JavaScript寫爬蟲，聽起來貌似有些不靠譜？

爬蟲，大多人對于爬蟲的理解都停留在使用后端語言如Python寫的爬蟲。但是實際上，使用客戶端JavaScript有諸多后端爬蟲所無法擁有的優(yōu)勢：

可以方便的分享給其他人用，只要對方電腦里有瀏覽器

由于跑在客戶端，幾乎可以無視對方網(wǎng)站的反爬蟲機(jī)制

可以擁有完善的UI，無開發(fā)基礎(chǔ)的小白也可以隨意使用

這東西應(yīng)該怎么啟動？

而“客戶端JavaScript爬蟲如何運(yùn)行”問題，回答這個問題非常簡單，大致有3種運(yùn)行JavaScript的代碼：

存瀏覽器書簽，以javascript:打頭，點擊即可運(yùn)行

復(fù)制到瀏覽器console中按回車

有個瀏覽器擴(kuò)展叫做“油猴子”

這里我們主要看下第三種，油猴腳本方式運(yùn)行。

或許你聽說過油猴擴(kuò)展，他在Firefox叫做Greasemonkey在Chrome叫做Tampermonkey，你可以輕松的在瀏覽器的擴(kuò)展商店找到它。而關(guān)于其本身有何作用，一句話

按照規(guī)則，在不同的URL額外運(yùn)行一段JavaScript代碼

請參考下面的例子：

// ==UserScript==
// @name          Pxer
// @include       http://www.pixiv.net*
// ==/UserScript==
javascript:void((function() {
    
    document.documentElement.appendChild(
        document.createElement("script")
    ).src="http://pxer-app.pea3nut.org/jsonp.js?"+(+new Date);

})());

==UserScript==是油猴腳本的規(guī)則，上面的規(guī)則告訴油猴：

當(dāng)瀏覽器打開http://www.pixiv.net*的頁面時，執(zhí)行下面的腳本

而腳本的內(nèi)容則是：通過jsonp的方式向頁面引入一個js文件。

這就可以做很多事了。（不是壞事哦~）

優(yōu)勢，還是非常多的

上圖是一個二次元插畫交流站pixiv.net。圖中顯示“Pxer 7”的那一個長條是原本不存在與原網(wǎng)站中的，而是通過油猴腳本自動載入JavaScript腳本來創(chuàng)建的。

若想訪問圖中的原始鏈接可以點擊這里，可能你需要先在pixiv.net注冊一個賬號

通過油猴腳本自動載入，你可以做到：

在完全不影響原網(wǎng)站使用的情況下，利用強(qiáng)大的JavaScript向用戶提供額外的功能

再結(jié)合一開始提到的優(yōu)點：

可以給任何人使用！哪怕是無開發(fā)基礎(chǔ)的小白

不會被封殺！由真實用戶操作，封賬號、IP、驗證碼等反爬蟲策略你覺得會對客戶端爬蟲有效嗎？

利用HTML+CSS，構(gòu)建一個漂亮的UI完美融入原網(wǎng)站，簡直不能再簡單~

突然莫名的感覺很無敵有木有？

說了這么多，來個實際實現(xiàn)的例子

空說無憑，來看一個實際的客戶端JavaScript爬蟲開源項目 —— Pxer

Github：https://github.com/pea3nut/Pxer

項目官網(wǎng)：http://pxer.pea3nut.org/

Pxer是一個純客戶端JavaScript編寫的爬蟲，無需任何配置即可直接在瀏覽器端運(yùn)行。

Pxer最大作用是將pixiv.net網(wǎng)站（類似于花瓣網(wǎng)）中的圖片作品快速的抓取下來。它不是簡單的檢索img標(biāo)簽，而是通過一定的算法和Ajax請求來完成更為復(fù)雜的功能。

關(guān)于項目的詳細(xì)描述，可以參考項目官網(wǎng)和Github項目主頁

良好的jsDOC格式注釋和詳細(xì)的文檔都已經(jīng)為你準(zhǔn)備好了~~

https://github.com/pea3nut/Pxer

讓JavaScript來的更猛烈些~~

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/82335.html

相關(guān)文章

  • 前端知識精選- 收藏集 - 掘金

    摘要：這美團(tuán)點評前端無痕埋點實踐前端掘金構(gòu)建一個數(shù)據(jù)平臺，大體上包括數(shù)據(jù)采集數(shù)據(jù)上報數(shù)據(jù)存儲數(shù)據(jù)計算以及數(shù)據(jù)可視化展示等幾個重要的環(huán)節(jié)。 我認(rèn)真起來連面試官都怕（塊級作用域，事件代理） - 掘金作者 混元霹靂手-Ziksang 如果你學(xué)完這篇文章之后，你回答完面試官之后，拿一張圖告訴面試官 在于前端面試，你給面試官講一些官方名詞，我知道react,vue,angular等等，一系列牛B的框架...

    XiNGRZ 評論0 收藏0

  • 好棒的前端文章 - 收藏集 - 掘金

    摘要：你應(yīng)該知道的種設(shè)計模式前端掘金每位開發(fā)者都努力寫出可維護(hù)的易讀的可復(fù)用的代碼。繼承關(guān)系本前端書籍整理，高清前端掘金發(fā)現(xiàn)了一個下載前端書籍的地方，分享給大家。 你應(yīng)該知道的 4 種 JavaScript 設(shè)計模式 - 前端 - 掘金每位開發(fā)者都努力寫出可維護(hù)的、易讀的、可復(fù)用的代碼。隨著應(yīng)用變得越來越大，代碼的結(jié)構(gòu)也越來越重要。設(shè)計模式驗證了解決這個挑戰(zhàn)的重點——在特定環(huán)境中，對同類事物...

    Maxiye 評論0 收藏0

  • 用純 DOM 的方式結(jié)合 Puppeteer 自動生成網(wǎng)頁骨架屏

    摘要：可以通過的提供的直接控制模擬大部分用戶操作來進(jìn)行或者作為爬蟲訪問頁面來收集數(shù)據(jù)。 ??骨架屏是在頁面數(shù)據(jù)尚未加載完成前先給用戶展示出頁面的大致結(jié)構(gòu)，直到請求數(shù)據(jù)返回后再顯示真正的頁面內(nèi)容；隨著單頁應(yīng)用（ SPA ）的越來越流行，單頁應(yīng)用的用戶體驗也越來越得到前端開發(fā)者的關(guān)注；為了優(yōu)化用戶體驗，在數(shù)據(jù)到達(dá)用戶之前，往往會在頁面上加上 loading 的效果，而現(xiàn)在，越來越多的場景傾向于使...

    BlackHole1 評論0 收藏0

  • Day08 - HTML5 Canvas 實現(xiàn)彩虹畫筆繪畫板指南

    摘要：實現(xiàn)彩虹畫筆繪畫板指南作者簡介是推出的一個天挑戰(zhàn)。這部分不涉及內(nèi)容，全部由來實現(xiàn)。實現(xiàn)彩虹畫筆繪畫板效果圖項目源碼分析源碼獲取節(jié)點支持不支持彩虹效控制筆觸大小控制繪制路徑源碼分析寬高設(shè)置屬性筆觸的形狀，有圓平方三種。 Day08 - HTML5 Canvas 實現(xiàn)彩虹畫筆繪畫板指南 作者：?liyuechun 簡介：JavaScript30 是 Wes Bos 推出的一個 30 天挑...

    Ajian 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<