2010-02-16 29 views
4

我需要允許我們網站上的內容嵌入到其他用戶的網站中。 該conent將收取費用,所以我需要保持它的安全,但其中一個要求是,訂閱網站只需要放下一些JavaScript到他們的頁面。我該如何給用戶提供一個javascript小部件來從我的網站安全地提取內容

它看起來像保護我們的內容的唯一方法是檢查承載我們的JavaScript匹配訂閱網站的網頁的網址。考慮到我們不知道將訪問訂閱網站的客戶端瀏覽器,是否有其他方式來做到這一點?

是否最好的方法來提供一個JavaScript包含文件,當頁面加載時填充已知頁面元素?我正在考慮使用jquery,這樣包含文件將首先在jquery中調用(檢查它是否已經加載並使用某種名稱空間保護),然後在頁面加載時填充給定的元素。

我想包括一個樣式表,以及如果可能風格的元素,但我不知道如果我可以加載這與JavaScript一起。

這聽起來像一個合理的方法嗎?還有什麼我應該考慮的嗎?

由於提前,

邁克

+0

+1歡迎堆棧溢出,邁克! – Sampson 2010-02-16 16:52:26

+0

感謝Jonathan,我在網站 – Mike 2010-02-17 11:25:57

回答

5

看起來,以確保我們的內容的唯一方法是檢查網頁的URL託管我們的JavaScript匹配訂閱網站。

嗯,但在客戶端或服務器端的代碼?

它們都有它們的缺點。用服務器端代碼做這件事是不可靠的,因爲一些瀏覽器根本不會傳遞一個Referer頭文件,並且如果你想停止緩存保存腳本的副本,防止Referer檢查發生,你必須服務使用nocache或Vary: Referer標題,這會損害性能。

另一方面,在您返回的腳本中使用客戶端檢查時,您無法確定您所運行的環境是否未被破壞。例如,如果你的包容腳本標籤是這樣的:

<script src="http://include.example.com/includescript?myid=123"></script> 

和你的服務器端腳本擡頭123爲使用域customersite.foo客戶的ID,它可能與腳本回應:

if (location.host.slice(-16)==='customersite.foo') { 
    // main body of script 
} else { 
    alert('Sorry, this site is not licensed to include content from example.com'); 
} 

看起來很簡單,除了包含站點可能用代替了總是返回customersite.foo的函數。或者腳本主體中使用的各種其他功能可能會受到懷疑。

從另一個安全上下文中包含<script>可以切換兩種方式:包含站點必須信任源站點不會在其安全上下文中執行任何錯誤操作,如竊取最終用戶密碼或用大山羊替換頁面;但同樣,源站點的代碼只是包含站點的可能惡意定製的安全上下文中的一個訪客。因此,只要一個站點包含另一個站點的腳本,雙方之間就必須存在一種信任度量;域檢查永遠不會是一個100%安全的安全機制。

我想包括一個樣式表,以及如果可能風格的元素,但我不知道如果我可以加載這個與JavaScript一起。

您當然可以將樣式表元素添加到文檔的head元素,但您需要一些強大的名稱空間以確保它不會影響其他頁面樣式。爲簡單起見,您可能更願意使用內聯樣式,並避免來自頁面主樣式表的特殊干擾。

這取決於您是否希望生成的內容成爲主機頁面的一部分(在這種情況下,您可能更願意讓包含網站自行處理它們想要的風格),還是希望它能夠保持原樣不受上下文影響(在這種情況下,您最好將自己的內容放入中)。

我想使用jQuery的,因此包括文件將在jQuery的

先打電話我會盡量避免拉扯的jQuery到宿主頁面。即使使用noconflict,也有一些方法可能會與其他不期望它存在的腳本衝突,特別是像其他框架一樣複雜的腳本。在同一頁面上運行兩個框架是奇怪錯誤的祕訣。

(如果你拿了路線,在另一方面,你會得到你自己的腳本方面一起玩,所以它不會是一個問題在那裏。)

+0

感謝您提供的信息,這給了我很多想法並澄清了一些事情。 – Mike 2010-02-17 11:10:14

+0

@bobince包含網站是否可以替換「位置」。主機「函數以及」String.slice「? – 2011-12-24 21:00:13

+1

@Murat:是的,雖然瀏覽器的怪癖可以用'location'來完成,IE中你可以替換整個'location'對象。 'Object.defineProperty'是現有'location'對象的替代屬性 – bobince 2011-12-24 21:41:58

2

您可以存儲用戶域,和本地數據庫中的一個關鍵。或者,密鑰可以是域的加密版本,以防止您需要執行數據庫查找。其中任何一個都可以確定您是否應該回應請求。

如果請求有效,您可以將數據發回給用戶。這些數據的確可以加載jQuery和其他CSS引用。

相關:

  1. How to load up CSS files using Javascript?
  2. check if jquery has been loaded, then load it if false
+1

+1上發現了一些很棒的提示。作爲一個便箋,我會一直謹慎地從第三方網站加載腳本到我的頁面,特別是如果它不在'https'之上。在不熱衷於允許第三方訪問我的頁面的DOM的過程中,它會打開潛在的MITM攻擊。大多數小部件提供商應該使用iframe來爲所有相關方提供安全性。 iframe可以是透明的,你甚至可以提供一個'get'參數來提供css文件的位置。 – 2010-02-16 16:56:22

+0

+1 @Andy。良好的信息。 – Sampson 2010-02-16 17:43:37

+0

感謝您的信息,我會進一步調查。 – Mike 2010-02-17 11:11:41

相關問題