Quantcast
Channel: WFU BLOG
Viewing all articles
Browse latest Browse all 784

如何讓網站不被 7headlines 用 IFRAME 內嵌框架

$
0
0
之前 +Pan Kuan曾在這個「Blogger中文社群討論串」談到這件事,雖然 WFU 曾經提出因應被 IFRAME 框架的語法,但可惜沒有測試的環境來驗證效果。直到最近無意間發現,本站的文章也受到 7headlines 的青睞,而雖然成了受害者,但有了機會可以測試破解 IFRAME 框架的語法,不啻為一個宣導「反框架惡行」的好機會。

以下先說明被框架的影響,接著大致敘述 Blogger 破解框架的原理,想直接安裝語法請跳「三、安裝破解框架程式碼」



一、網站被框架的影響


1. 著作權被消費?

其實這個主題,重灌狂人 +Briian Tsai 已經寫過,還滿詳細的,所以請直接參考這篇「如何避免你的網站被「蓋台」?(破解被Frame內嵌的網站)」 即可。

就我個人而言,網頁被 7headlines 綁架的感想是,就像是林書豪、黃色小鴨造成旋風後,大街小巷到處都是相關的週邊產品,產品上都有林書豪或小鴨的圖案,但這些產品都有取得正式授權嗎?林書豪或小鴨作者有被知會嗎?




就像上圖,我們的網頁被綁架後,拿著我們的原創內容當賣點,擺上自家 7headlines 的廣告、宣傳資訊等等,廣告點擊是他們賺,而我們根本完全不會被知會,也很難知情,我想沒有人喜歡被這般拿來消費吧?


2. Google Adsense 的影響?

網頁被框架後,如果這種情況下的 Adsense 廣告被點擊時,由於網址並非我們的網域,而是 7headlines,不曉得 Adsense 的判斷機制為何?是否會損及我們的權益?

我在 Adsense 社群詢問了這樣的問題,由於幾天來還未得到官方的答覆,如果有新的訊息,會再更新內容。



二、Blogger 破解框架的原理


如果是一般的部落格,也許只要照 Briian 提供的程式碼就能解決問題,如下:

if (top.location != location) top.location.href = location.href;

不過 Briian 自己也提了,在 WP 後台編輯文章時(他的部落格是WP),會有一些問題,因此破解框架的語法,需要有更周全的設計,請看以下分析:

1. Blogger 後台範本的畫面、「範本設計工具」的畫面、文章預覽的畫面,其實都使用了 IFRAME 框架,才能預覽網站效果。因此如果用了上面的語法,那我們不但趕走了 7headlines,自己連 Blogger 以上所提相關畫面也都進不去了,這是非常嚴重的事情。

2. 因此必須使用 js 來判斷框架的網址,當偵測到 blogger 的網址時就不破解框架,其他的網址就破解框架。

3. 但是 js 有跨域的安全性問題,意思就是說當我們網站網址為 ???.blogspot.com,而框架的網址為 blogger.com 時,js 無法讀取 blogger.com 的網址字串。這也代表很難去分辨框架的網址到底是 blogger.com 還是 7headlines。

4. 為了這一點奮戰不少時間,最後找到的解決方法為 document.referrer,從這裡可以判斷出是 blogger.com 還是 7headlines,從而解決了最大的難題。



三、安裝破解框架程式碼


以 Blogger 為例,請到後台「範本」→「編輯 HTML」→ 搜尋 </head>字串,找到後在其前一行,插入以下程式碼:

<!-- 防網頁框架 start -->
<script>
//<![CDATA[
if (top.location != location && document.referrer.search("blogger.com") < 0&& document.referrer.search("blogspot.com") < 0) {
top.location.href = location.href;
}
//]]>
</script>
<!-- 防網頁框架 end -->


以上程式碼代表的含意為,「除了 blogger.comblogspot.com這兩個網域,只要網址被 IFRAME 框架,一律強制轉回原網址」。請根據以下三種情境,來調整程式碼:


1. 禁止所有框架網址(非 Blogger、WP 的部落格)

如果不是 Blogger、WP 這類平台,後台編輯畫面不會使用框架的話,那麼可以刪除所有有顏色的字串,代表「只要任何被框架的情況,一律轉址回原網址」。非 Blogger、WP 的部落格,通常程式碼放在可以執行 js 的地方即可。


2. 允許特定框架網址(Blogger、WP 平台)

例如 Blogger 的後台範本為類似下面的網址:

  • http://www.blogger.com/blogger.g?blogID=????

由於 Blogger 後台會使用框架來預覽網站畫面,因此我們網站必須允許讓 "www.blogger.com" 這個網域框架。

另外也許是「Blogger 無預警轉換區域網址」的影響,後台文章預覽畫面的網域為 ???.blogspot.com,與目前台灣會顯示的區域網址 ???.blogspot.tw不同,會視為不同網域,因此額外也需要允許讓 "blogspot.com" 這個網域框架。

所以在 Blogger 平台,程式碼當中必須包含所有有顏色的程式碼。如果 Blogger 使用自訂網域的話,那麼紅字 "blogspot.com" 請自行置換為自己的網域。

如果是 WP,只需允許一個網域框架的話,請將紅字 "blogger.com" 置換為允許的網域,然後將後面的綠色、紅色組合字串刪除。


3. 允許多個框架網址

如果允許多個網域對我們網站框架,請依照「藍色、紅色組合字串」的規律,來增加或修改允許的網域字串即可,例如以下:

if (top.location != location && document.referrer.search("blogger.com") < 0 && document.referrer.search("wordpress.com") < 0 && document.referrer.search("example.com") < 0)


四、如何知道網站是否被 7headlines 框架?


拜 Google 大神的強力搜索功能,讓這件事異常簡單,以 WFU BLOG 為例,想知道我的哪些文章被 7headlines 框架,只要在 Google 搜尋引擎輸入以下字串即可:

wfu blog site:www.7headlines.com

以上 "wfu blog" 字串請換成自己的網站名稱即可,現在就動手查查看網站是否被 7headlines 佔了便宜吧!我的搜尋結果類似下圖:





五、使用 IFRAME 框架在法律上的責任


感謝 +Ben Yu 提供的訊息,根據這篇「使用網頁框架iframe方法內嵌其他網站的的網頁,這算侵犯嗎??」,律師的回答如下:

就技術面而言,若可讓使用者知道是屬於其他人的網頁,則屬於網路超連結應用的一環,不涉及對他人著作的重製或公開傳輸,所以,解釋上不會構成侵害他人的著作財產權。不過,若是屬於競爭對手網頁的利用,則可能屬於不公平競爭行為,而有違反公平交易法的問題。

從以上解釋,看來少數情況才會違反公平交易法,不過 WFU 仍不清楚什麼情況下可對 7headlines 這種框架行徑提告。

而若認為 7headlines 侵權時,可先參考這篇「保存部落格盜文、盜圖證據的工具__archive.is 應用」保存證據,再進行法律程序。



六、小結


WFU BLOG 只是個小小網站,對於這樣的事情,影響力不足時就算想抗議,也很難起什麼帶頭作用。相信被 7headlines 框架的大網站更多,如果有大型部落格來帶頭評判這樣的事,絕對可以消彌這種利用 IFRAME 框架得利的手段。

如果你的網站也是受害者,在這一類的框架網站停止這種行為之前,歡迎你在自己的部落格寫文章揭露這樣的事情,本文的程式碼請隨意取用、隨意引用,讓更多網站知道本文的程式碼,讓框架網站失去作用,這是我們小網站能夠自保、及為網路盡一份力量的方法!

Viewing all articles
Browse latest Browse all 784

Trending Articles