2015-07-22 60 views
1

的我經歷的PhoneCat教程AngularJS。一切都解釋的非常好,所以我正沿着以下,直到我打step 6在哪個環節被動態地從角公式產生:安全角度表達

http://localhost:8000/app/{{phone.imageUrl}} 

雖然教程指出ngSrc被阻止瀏覽器發出HTTP請求無效位置(編輯:顯然,本教程意味着瀏覽器只會在表達式得到評估後纔會調用鏈接。請參閱提供的鏈接中的「實驗」部分。),我現在想知道角表達式的安全性如何。由於phone.imageUrl是外部加載的,理論上可能包含惡意內容,我想了解爲什麼這對我的web應用程序無關緊要。

顯然表達的內容被轉義以某種方式,所以包括在你的代碼下面將只打印出一些文字:

<img ng-src="{{""><script>alert('UNSAFE!')</script>"}}"> 

,但我想知道是否有一些「規則」是您需要注意保持Web應用程序的安全。例如,通過編譯上述代碼

var template = "<img ng-src="{{""><script>alert('UNSAFE!')</script>"}}">"; 
var something = $compile(template); 

結果在加載DOM時執行腳本?當你無法確保角度表達式包含預期內容時,是否有「你不應該在你的web應用程序中做的事情」?

+0

「外部加載」是指什麼? – Bergi

+0

您的js/html代碼包含兩個部分 - 一個來自服務器,另一個來自用戶輸入。我不明白在這裏可能不安全。 –

+0

@Bergi在教程中,它是從本地.json文件(通過本地網絡服務器提供的)加載的。但是,它可以很容易地生成尚未驗證的未知Web服務器的內容或響應。表達式甚至可以評估由用戶輸入填充的變量,所以我只是想知道如果沒有任何驗證,使用它們實際上是安全的。 –

回答

1

據我所知角總能逃脫的,除非你告訴它不這樣做勢必元素的任何數據。

你在另一方面例子的工作方式不同 - 也許你是一個有點不確定是如何工作的角度:

var template = "<img ng-src="{{userInput}}">"; 
var something = $compile(template)({userInput: "\"><script>alert('UNSAFE!')</script>\""}); 

所以模板,你有完全的控制,得到的第一個編輯,然後表達綁定到它完全逃脫(沒有HTML允許)。

我可能會不先消毒它編譯外部代碼($compile(userinput)) - 但是這意味着你可能會做錯事。如果您使用正確的方式編碼,則只能在某些邊緣情況下使用$compile。否則,您可能會保持冷靜,因爲角度會照顧不安全的輸入。

如果您需要綁定的HTML模板,那麼你可以包括ngSanitize。否則,angular將不會讓你綁定不安全的html,除非你告訴$sce service信任它。

最後,我就不會擔心約束力的來源不可靠的數據,以我的模板。