javascript
有了 Docker，用 JavaScript 框架开发的 Web 站点也能很好地支持网络爬虫的内容抓取...
?
點(diǎn)這里
?
閱讀目錄
- 用 AngularJS（以及其它 JavaScript 框架）開(kāi)發(fā)的 Web 站點(diǎn)不支持爬蟲的抓取
- 解決方案
- 為什么公開(kāi)我們的解決方案
- 實(shí)現(xiàn)
- AngularJS 服務(wù)
- 結(jié)論
Prerender 服務(wù)能夠?yàn)榫W(wǎng)絡(luò)爬蟲提供預(yù)先渲染的動(dòng)態(tài)頁(yè)面內(nèi)容，解決了用 JavaScript 框架構(gòu)建的 Web 站點(diǎn)不支持爬蟲抓取的問(wèn)題。本文詳細(xì)描述了一種解決方案，尤其是提供了集成 Prerender 服務(wù)的 Docker 容器鏡像。?
如果你正在使用 AngularJS 構(gòu)建一個(gè)面向大眾消費(fèi)者的應(yīng)用，你肯定希望用戶能把它分享到社交媒體上。對(duì)于特定的應(yīng)用而言，豐富的社交分享差不多是最重要的營(yíng)銷渠道。所謂「豐富的社交分享」，是指像下面這樣的分享：?
可以看到， Facebook, Twitter 等社交站點(diǎn)能夠獲取非常豐富的內(nèi)容，不僅限于網(wǎng)頁(yè)標(biāo)題和圖片。為什么可以做到這一點(diǎn)？因?yàn)樵诰W(wǎng)頁(yè) HTML 文檔的head部分包含了有特別含義的元數(shù)據(jù)標(biāo)記。像 Facebook 以及 Pinterest 和 Google+ 等社交站點(diǎn)能讀取遵循?開(kāi)放圖協(xié)議標(biāo)準(zhǔn)的元數(shù)據(jù)，例如，?
Twitter 也支持類似的機(jī)制，不過(guò)它用的元數(shù)據(jù)屬性前綴是twitter:，而不是og:。?
當(dāng)用戶在社交站點(diǎn)上分享一個(gè) URL 時(shí)，社交站點(diǎn)會(huì)啟動(dòng)一個(gè)網(wǎng)絡(luò)爬蟲去抓取該頁(yè)面的內(nèi)容。網(wǎng)絡(luò)爬蟲首先在網(wǎng)頁(yè)源文檔中找出各種元數(shù)據(jù)標(biāo)記，然后才會(huì)查看常規(guī) HTML 元素的內(nèi)容，例如，<head>標(biāo)記和網(wǎng)頁(yè)中的圖像等。?
用 AngularJS（以及其它 JavaScript 框架）開(kāi)發(fā)的 Web 站點(diǎn)不支持爬蟲的抓取
我已經(jīng)在?Earlyclaim?站點(diǎn)的網(wǎng)頁(yè)中添加了所有必需的遵循開(kāi)放圖協(xié)議標(biāo)準(zhǔn)的元數(shù)據(jù)標(biāo)記。但是，當(dāng)我把 Earlyclaim 站點(diǎn)的一個(gè)鏈接分享到 Facebook 時(shí)，顯示的結(jié)果卻是非常令人失望的：?
導(dǎo)致如此糟糕的結(jié)果的原因很簡(jiǎn)單：?抓取網(wǎng)頁(yè)時(shí)，網(wǎng)絡(luò)爬蟲并不會(huì)執(zhí)行網(wǎng)頁(yè)中的 JavaScript 代碼。因此，爬蟲抓取到的內(nèi)容是這樣的：?
?
回到頂部解決方案
解決方案的基本思想是：應(yīng)用一種在服務(wù)器端執(zhí)行的用戶代理探測(cè)方法，識(shí)別出當(dāng)前請(qǐng)求來(lái)自于社交站點(diǎn)的爬蟲；此時(shí)，服務(wù)器不會(huì)像 處理瀏覽器請(qǐng)求那樣返回一個(gè) AngularJS 模板文件，而是重定向到一個(gè)服務(wù)器端生成的頁(yè)面，頁(yè)面中包含了希望提供的元數(shù)據(jù)標(biāo)記以及正確填寫的信息。?
經(jīng)過(guò) Google 搜索，以及與其它創(chuàng)業(yè)公司?startypchile?的技術(shù)人員的討論，我們發(fā)現(xiàn)了?prerender.io?服務(wù)，它能夠預(yù)先渲染好動(dòng)態(tài)頁(yè)面的內(nèi)容。這為問(wèn)題的解決奠定了良好的開(kāi)端。?
Prerender 的開(kāi)發(fā)者提供了很多?中間件， 還把?prerender 引擎開(kāi)源，因?yàn)樗麄冋J(rèn)為?
當(dāng)然，如果你愿意，也可以付費(fèi)使用他們提供的 Prerender 托管服務(wù)。?
支撐?Earlyclaim?的基礎(chǔ)設(shè)施是以?Docker?為基礎(chǔ)構(gòu)建的。為了集成 Prerender 服務(wù)，我們首先在 Docker Hub 中找出相關(guān)的幾個(gè)容器鏡像，然后進(jìn)行試用，結(jié)果難以令人感到滿意。?
我們的需求包括：?
- 完全可定制的環(huán)境（通過(guò)?Kitematic?）；
- 能夠使用?Redis?作為緩存數(shù)據(jù)庫(kù)；
- 立即可用的 Prerender 容器。
這些也是我們自行構(gòu)建容器鏡像的原因！?
?
回到頂部為什么公開(kāi)我們的解決方案
首先，我們信仰「協(xié)同智能」：?
- 摘自?維基百科
我們的解決方案是建立在開(kāi)源的?prerender.io 引擎?的基礎(chǔ)之上：沒(méi)有它，就不會(huì)有我們的解決方案。 Prerender 團(tuán)隊(duì)太棒了。?
其次，同樣重要的是，在與很多創(chuàng)業(yè)公司的開(kāi)發(fā)者交流之后，我們了解到：他們很多人都在使用 AngularJS 或者其它框架構(gòu)建 Web 應(yīng)用，也需要解決搜索引擎優(yōu)化/豐富的社交分享問(wèn)題。然而，由于不知道解決方法，或者感覺(jué)解決起來(lái)太耗費(fèi)時(shí)間，或許會(huì)影響更為重要的產(chǎn)品發(fā)布時(shí)間，他們暫 時(shí)擱置這個(gè)問(wèn)題，留待以后解決。還有些開(kāi)發(fā)者甚至沒(méi)有意識(shí)到有這個(gè)問(wèn)題，當(dāng)從我們這里聽(tīng)說(shuō)了之后，他們請(qǐng)求我們把解決方案分享出來(lái)。?
我們相信這個(gè)方案能夠加速整個(gè)開(kāi)發(fā)進(jìn)程，因?yàn)樗鉀Q了一個(gè)普遍的問(wèn)題。很高興能夠分享這個(gè)方案。?
實(shí)現(xiàn)
如果技術(shù)人員想把我們構(gòu)建的容器鏡像添加到自己的基礎(chǔ)設(shè)施中，請(qǐng)參考 Docker Hub 上的文檔：https://registry.hub.docker.co ... edis/?
回到頂部AngularJS 服務(wù)
如果是 AngularJS 應(yīng)用，首先實(shí)現(xiàn)下面的代碼：?
'use?strict'; !(function?(window,?document,?undefined)?{ var?getModule?=?function?(angular)?{ return?angular.module('seo',?[]).run(['$rootScope',function?($rootScope)?{$rootScope.htmlReady?=?function?()?{$rootScope.$evalAsync(function?()?{?//?fire?after?$digestsetTimeout(function?()?{?//?fire?after?DOM?renderingif?(typeof?window.callPhantom?===?'function')?{window.callPhantom();}},?0);});};}]); }; if?(typeof?define?===?'function'?&&?define.amd)?{ define(['angular'],?getModule); }?else?{ getModule(angular); } })(window,?document);
然后通過(guò)angular.module('youApp', ['seo'])調(diào)用。?
結(jié)論
如果你使用我們的容器，覺(jué)得還不錯(cuò)，請(qǐng)一定告知我們（?@Earlyclaim）。?
如果你覺(jué)得有人會(huì)對(duì)此感興趣，請(qǐng)轉(zhuǎn)發(fā)給他們（點(diǎn)擊社交分享按鈕）！?
任何建議，請(qǐng)發(fā)推特并通知?@Earlyclaim?：非常期待您的觀點(diǎn)和文字！?
任何代碼改進(jìn)，請(qǐng)通過(guò)?GitHub?推送合并請(qǐng)求！?
順便說(shuō)一句，我們熱愛(ài)創(chuàng)業(yè)公司，我們熱愛(ài)開(kāi)發(fā)者，我們熱愛(ài)社區(qū)！?開(kāi)放生態(tài)系統(tǒng)萬(wàn)歲！?
原文：Get your Javascript website perfectly crawled with Docker?（翻譯：柳泉波 校對(duì)：佚名）?
來(lái)自：http://dockerone.com/article/279
轉(zhuǎn)載于:https://www.cnblogs.com/RTdo/p/4401575.html
總結(jié)
以上是生活随笔為你收集整理的有了 Docker，用 JavaScript 框架开发的 Web 站点也能很好地支持网络爬虫的内容抓取...的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 【原创】Kakfa metrics包源代
- 下一篇： JS中eval处理JSON数据 为什么要