[教學]如何用語法保護網頁文章著作權__(3) 超連結偽裝術

(Pic from: 123rf.com)先來個前情提要，「上一篇」 的測試區在部分 WIN7 + IE8 會失效的情形，由於最終找到了替代方案，使得本篇內容得以繼續連載下去。

「第二篇」防盜機制的缺點在於，只能防範初階複製者，就像機車上了大鎖，一般的竊賊覺得破壞大鎖麻煩，為了節省時間就另外尋找目標了。第二篇的機制很明顯地告訴訪客，我不讓你複製全文，因此覺得麻煩的人就不會複製了。而對於中階竊賊，他覺得他時間很多，也不怕麻煩，願意把機車扛回家慢慢鋸大鎖，例如網頁另存新檔，鉅細靡遺地把 html 標籤慢慢剔除來獲取全文；或是想辦法找到瀏覽器 javascript 的開關，不斷地進行開關的動作來複製全文。雖然這麼閒的人不多，但對於不怕麻煩的閒人，有沒有機制可以防範他們呢？


一、構思防盜機制

會被中階竊賊鋸大鎖的主要原因在於──機車上了大鎖，一眼就看到有防盜機制，只要執行複製指令發現文章內容被切掉，就知道用了 javascript 這道大鎖，以下是我針對此點防範的構思：

1. 從心理學上而言，如果我們不切掉文章內容，而是允許訪客全文複製，那麼訪客還會去關掉 javascript、或是網頁另存新檔嗎？相信找不到這麼沒事找事做的人。所以，降低中階盜賊戒心的方法就是──讓其誤以為網頁沒有防盜機制，可以全文複製，這樣就成功了一半。

2. 在「上一篇」你如果有自己實作的話，假設你設定了 200 字以上不允許複製全文的話，那麼當選取的內容跨越數個段落，將會發現──複製貼上內容的段落不見了，除了版權宣告以外的字會黏在一起(成為一個段落)。這一點在上一篇是無妨，因為已經明確告訴訪客，我就是不讓你全文複製；但是在本篇就不行了，因為很明顯複製的內容有點問題，段落消失會讓中階盜賊起疑心的，本篇必須解決此問題，讓複製的段落跟原文一模一樣。

3. 最後，根據「保護網頁著作權的初階構思__（一）文章篇」，最好的防盜方法是「四、多放置超連結」，如果我們在純文字複製的內容裡面，暗藏一些很不明顯的超連結指向我們網頁，這樣子瀏覽中階盜賊網頁的訪客，看到這些超連結就知道原文出處在哪裡了。



二、設計防盜機制

根據以上的構思，我設計了以下的防盜機制：

1. 在被複製的全文內容裡，尋找所有的刮號，例如 「」、（）、[]、{}、""、() 等這些符號，把部分刮號的內容加上我們網頁的超連結，如此整篇文章乍看之下沒有任何問題，但只要有人去點刮號內的超連結，就會發現原文出處其實在我們家。

2. 如果整篇文章找不到半個刮號(應該很困難吧？)，那麼在文章中每二～四個段落，找兩個中文字 (或一個英文字) 加上超連結。

3. 在文章的內容裡面偷藏版權宣告，由於是夾雜在文字當中，位置不能突兀讓前後句不通順，也不能出現在太顯眼的位置，我會選擇放在文章中段以後，找到逗號後插入。

4. 在字數很少的情況下，偷藏版權宣告很容易被發現，因此我會設定複製一定字數以上(例如 300 字) 才啟動語法，好保護版權宣告的隱蔽性。

除了以上的機制，相信根據我的防盜構思，你也可以想出你的防盜機制出來。其實困難的是想法，作法常常不難，只要有一點 javascript 的底子，想法多半能透過程式碼實現。


三、安裝程式碼

雖然我提出了四點的機制，由於篇幅的關係，本篇選擇第 3、4 點來實作。同樣的，如果有安裝過「第一篇」或「第二篇」程式碼到範本的話，請將原本 </body> 後面的程式碼刪除。做完以上動作後，一樣找到 </body>，在它的後面一行加入以下程式碼：


以上紅字部分的參數可以自訂──

D：訪客複製時如果超過這個參數的字數，才啟動「附加原文出處」的機制。預設為 300 字，可依個人需求修改，500 或 1000 都可；如果字數設太少的話，可以自行看看複製後效果的隱蔽性是否足夠。

E：附加版權的字串，可自行修改。

F：附加版權超連結的文字，通常設為自己的部落格名稱。

其實如果按照 E、F 的原始設定，我覺得自己的部落格名稱容易被認出來，而被中階盜賊察覺，建議可以改為類似以下文字──

E：更多範例請參考─

F：此網頁

這樣的改法藏在眾多文字之中，既不易被複製者發覺，訪客也容易去按。本篇的「五、複製效果測試」就是採用這樣的字串。

以下跟「上一篇」的設定一模一樣──

G：允許自己複製的第一個暗碼，87 代表按下 w 鍵。

H：允許自己複製的第二個暗碼，70 代表按下 f 鍵。

G～H 的意思是，按下複製之前，只要依序按下 w 及 f 鍵，按的速度沒有限制，就可解開附加版權的機關，能夠進行全文複製。「這個網頁」的後半部可以查詢每個鍵的鍵值，把想要更改的鍵值依序填入 G 行及 H 行即可，請注意大小寫的鍵值不同。

接下來是各部分的程式碼說明，不瞭解程式碼可跳過，直接看「五、複製效果測試」。


四、程式碼說明

流程與架構基本上與「上一篇」是一模一樣的，因此只針對不同處說明──

AD：附加版權的格式更改，把 <br/> 的換行語法全去掉，才能有效隱藏在文字之中不被察覺。

AM：複製的字數超過預設值、或是沒有按過允許複製的密技鍵，就對複製的內容動手腳。

AN～AP：上一篇的作法是將選取內容 window.getSelection() 轉換成字串的格式再加工，但轉換成字串時 html 標籤 (如 <br/>、<p/>) 會不見，這就是段落會消失的原因。為了保存 html 標籤，參考了「此網頁」的語法，得以對選取內容的 innerHTML 進行加工。

Q：選取的內容丟到 addLink 函數處理。

R：插入版權宣告的位置大約為全文的 2/3 處，這裡也可改為自己想要放的位置，例如 4/5。

S～T：從複製內容的 2/3 處一直到結束，尋找全形逗號 "，"(也就是 charCodeAt 為 65292) 或半形逗號 "," (也就是 charCodeAt 為 44)。如果你整篇文章都不使用逗號，而是用空格讓句子分斷的話，請自行找一下空格的 charCodeAt 值，再修改這裡的程式碼。

U～V：找到全形逗號時，在逗號後面加上版權宣告的超連結，句末補上全形逗號，把偽裝做完整。

W：若找到半形逗號時，在逗號後面加上版權宣告的超連結，句末補上半形逗號，保持偽裝一致性。

AZ：這裡是 IE 部分把選取區的 innerHTML 做加工的改法。

以下部分同「上一篇」，因此不再贅述。


五、複製效果測試

由於本篇測試效果的字數需求比較多，在本文用測試區的話效果會比較差，建議前往測試網頁進行以下步驟測試：

點此看測試網頁

1. 選取超過 300 字，字數越多越好，跨越多個段落。
2. 複製後開一篇新文章貼上，存檔。
3. 尋找 "更多範例請參考─此網頁" 字串，這就是超連結隱身之處，你覺得會不會很顯眼或突兀呢？當然，這個字串是可以自訂的，也可以更改語法多放幾個地方。
4. 如果用滑鼠選取超過 300 個字元後，依序按下 w 及 f 鍵 (注意是小寫) 再進行複製，則不會附加隱藏超連結。


六、"阻止全文轉載" 與 "超連結偽裝術" 比較

這兩種防盜機制孰優孰劣，我個人的看法倒是覺得很難分別。「阻止全文轉載」可以防初階盜賊，不能防中階有技術的盜賊；「超連結偽裝術」可以防各種等級的盜賊，但無法防 "再次細心檢查文章內容" 的盜賊。那麼究竟是中階盜賊的數量比較多呢？還是會細心檢查文章內容的盜賊多呢？我沒做過市調，所以沒有答案。

然而，本篇為倚天劍的進階招法，高等劍術還在鍛鍊中，最終篇倚天、屠龍相互搭配，應該有機會一統江湖。神器要使得好，基本功不可少，接下來必須循序漸進，先補足一些其他基本功的內容，最終篇得再等等。

著作權保護系列文章：