網(wǎng)站安全知識(shí)看看國(guó)外怎么說(shuō)？

2022-07-23    分類： 網(wǎng)站建設(shè)

網(wǎng)站安全性：改善前端安全性且不被黑客入侵的13種方法

我們?cè)絹?lái)越依賴數(shù)字設(shè)備來(lái)管理購(gòu)物，銀行業(yè)務(wù)和整體通信。毋庸置疑，與后端開(kāi)發(fā)人員一樣，作為設(shè)計(jì)師和前端開(kāi)發(fā)人員，我們有責(zé)任幫助保護(hù)客戶免受欺詐和安全問(wèn)題的侵害。 

無(wú)論您是開(kāi)發(fā)電子商務(wù)網(wǎng)站（Shopify負(fù)責(zé)大部分風(fēng)險(xiǎn)）還是開(kāi)發(fā)其他類型的在線體驗(yàn)，您都需要注意許多陷阱。在本文中，我們采訪了七位安全專家，以了解最常見(jiàn)的前端漏洞，以及如何降低風(fēng)險(xiǎn)并避免被黑客入侵。

通過(guò)Shopify合作伙伴計(jì)劃發(fā)展您的業(yè)務(wù)

無(wú)論您提供市場(chǎng)營(yíng)銷，定制服務(wù)還是網(wǎng)站設(shè)計(jì)和開(kāi)發(fā)服務(wù)，Shopify合作伙伴計(jì)劃都將助您成功。免費(fèi)加入并獲得收益分享機(jī)會(huì)，發(fā)展業(yè)務(wù)的工具以及充滿激情的商業(yè)社區(qū)。

1.安全必須是開(kāi)發(fā)過(guò)程的一部分
最近，社區(qū)中的前端性能引起了很多關(guān)注。它使軟件工程師Benedek Gagyi意識(shí)到它與安全性有多相似。

他說(shuō)：“當(dāng)我聽(tīng)到諸如“您必須盡早將其添加到您的流程中”或“反對(duì)您的努力的最強(qiáng)大力量是開(kāi)發(fā)人員的便利性”之類的陳述時(shí)，我總是會(huì)點(diǎn)頭，因?yàn)樗鼈冊(cè)谛阅芎桶踩陨隙际侨绱恕?rdquo;解釋。“很顯然，可以在開(kāi)發(fā)生命周期的后期修復(fù)所有與安全性相關(guān)的錯(cuò)誤和漏洞，但是這要困難得多，而且成本也更高。這就是為什么添加威脅建模會(huì)話和定期進(jìn)行安全性審查對(duì)于任何更大的開(kāi)發(fā)步驟都至關(guān)重要的原因，這意味著安全性是設(shè)計(jì)使然，而不僅僅是補(bǔ)丁程序。”

Benedek指出，雖然認(rèn)知很重要，但應(yīng)該更多地討論實(shí)際的開(kāi)發(fā)人員經(jīng)驗(yàn)。 

“我期望使用庫(kù)和框架編寫的軟件中的安全性錯(cuò)誤更少，這使得編寫安全軟件變得容易。這很簡(jiǎn)單，對(duì)吧？前端世界中的一個(gè)很好的例子是，大型框架如何通過(guò)提供有風(fēng)險(xiǎn)的操作名稱（例如dangerouslySetInnerHTMLReact或bypassSecurityTrustAngular中的API ）來(lái)讓您知道是否要跨站點(diǎn)腳本（XSS）攻擊。

2.使用自動(dòng)處理安全性的現(xiàn)代框架 
JavaScript框架已成為現(xiàn)代Web開(kāi)發(fā)的重要組成部分?，F(xiàn)在，大多數(shù)站點(diǎn)似乎都圍繞React，Vue或Angular之類的框架構(gòu)建。從安全角度來(lái)看，它們提供了顯著的好處。 

Pragmatic Web Security的創(chuàng)始人兼安全編碼講師Philippe De Ryck說(shuō)：“ Angular框架的轉(zhuǎn)世就是一個(gè)好的例子。” “ Angular自動(dòng)防御各種XSS攻擊媒介。它為通過(guò){{}}的簡(jiǎn)單輸出提供自動(dòng)編碼。使用時(shí)，Angular會(huì)自動(dòng)清理輸出。當(dāng)使用變量URL或CSS時(shí)，Angular還會(huì)自動(dòng)確保在這種情況下可以安全地使用這些值。” innerHTML

其他框架提供了類似的保護(hù)，但是據(jù)Philippe稱，它們的保護(hù)范圍并不廣。盡管如此，使用任何現(xiàn)代框架都可以大大減少開(kāi)發(fā)人員緩解XSS攻擊所需的風(fēng)險(xiǎn)。

您可能還會(huì)喜歡： Web安全基礎(chǔ)知識(shí)：每個(gè)開(kāi)發(fā)人員都應(yīng)該知道的內(nèi)容。

3.避免典型的XSS錯(cuò)誤
雖然在使用現(xiàn)代JavaScript框架時(shí)不那么常見(jiàn)，但是仍然可以將無(wú)意的XSS缺陷編碼到您的前端。 

數(shù)字創(chuàng)新機(jī)構(gòu)Paralla/upload/ad_content/xuanchuantu-1.jpg主任詹姆斯·霍爾（James Hall）表示：“假設(shè)我們想通過(guò)營(yíng)銷電子郵件中的用戶名來(lái)解決用戶的問(wèn)題。” “添加到查詢字符串，然后簡(jiǎn)單地將其添加到DOM，將是一種快速的方法。”?name=James

例如：

document.querySelector('.tagline').innerHTML = nameFromQueryString
James警告說(shuō)，使用如上所述的代碼意味著，任何人都可以將代碼注入您的網(wǎng)站并接管您的工作。他警告說(shuō)，僅通過(guò)將名稱更改為，攻擊者就可以設(shè)計(jì)一個(gè)URL，該URL可以使偽造的付款頁(yè)面看起來(lái)像是從您的SSL加密網(wǎng)站提供的。

4.考慮可信類型
網(wǎng)站安全：可信類型
W3C的Trusted Types。
即使采取諸如輸出編碼或清理等對(duì)策，對(duì)于面向Web的應(yīng)用程序，XSS攻擊仍然是一個(gè)主要問(wèn)題。開(kāi)源安全公司Snyk的開(kāi)發(fā)者，Node.js安全工作組成員Liran Tal警告說(shuō)，諸如Angular或React之類的現(xiàn)代前端框架并非完全不受它的影響。

Liran建議使用Google的安全專家Krzysztof Kotowicz和Mike Samuel 提倡的一種新的瀏覽器API Trusted Types，以利用內(nèi)容安全策略規(guī)范（請(qǐng)參閱下文，第12頁(yè)）來(lái)定義與敏感API一起使用的數(shù)據(jù)源模板，從而解決XSS問(wèn)題。如水槽。innerHTML

Trusted Types規(guī)范仍然需要完善，但是Liran要求開(kāi)發(fā)人員選擇加入并開(kāi)始使用此安全API。 

他說(shuō)：“幸運(yùn)的是，我們?cè)谇岸松鐓^(qū)中看到了認(rèn)可和采用的跡象。” “例如，React框架最近合并了一個(gè)拉取請(qǐng)求，以在新版本中進(jìn)一步擴(kuò)展對(duì)Trusted Types的支持。”

您可能還會(huì)喜歡： 業(yè)內(nèi)人士對(duì)Shopify所采用技術(shù)的關(guān)注。

5.考慮使用te/upload/ad_content/xuanchuantu-1.jpgtContent代替innerHTML
為了防止XSS攻擊，您可以使用DOMPurify之類的清理庫(kù)（請(qǐng)參閱下面的11下），但是前端顧問(wèn)Zell Liew建議，如果僅更改文本，則可以使用te/upload/ad_content/xuanchuantu-1.jpgtContent代替innerHTML。 

“假設(shè)您要從輸入字段中獲取文本值，然后將該文本值輸出到DOM中。這是獲取文本值的代碼：

const value = input.value
但是用戶可以嘗試輸入惡意代碼，例如以下代碼段：

如果使用innerHTML，則將創(chuàng)建元素并運(yùn)行onerror處理程序。這就是XSS開(kāi)始的地方。”

Zell建議te/upload/ad_content/xuanchuantu-1.jpgtContent改為使用，因?yàn)樗荒茌敵鑫谋?，并且不?huì)生成任何HTML。 

“如果不生成HTML，就無(wú)法插入JavaScript，” Zell解釋道。您會(huì)在DOM中看到，但JavaScript無(wú)法運(yùn)行。

6.分隔您的應(yīng)用程序 
Web應(yīng)用程序通常構(gòu)建為單個(gè)應(yīng)用程序，并在瀏覽器中的單個(gè)來(lái)源中部署。例如，在中運(yùn)行的應(yīng)用程序https://app.e/upload/ad_content/xuanchuantu-1.jpgample.com提供了公共部分，經(jīng)過(guò)身份驗(yàn)證的部分甚至管理員功能。但是，Philippe De Ryck警告說(shuō)，對(duì)應(yīng)用程序公共部分的成功攻擊也會(huì)自動(dòng)影響其他部分，從而可能造成重大損害。

他解釋說(shuō)：“在后端，整體應(yīng)用程序通常分為較小的組件，每個(gè)組件單獨(dú)運(yùn)行。” “我們可以將類似的模式應(yīng)用于前端應(yīng)用程序。例如，我們可以將前端應(yīng)用程序分為一個(gè)公共部分，一個(gè)經(jīng)過(guò)身份驗(yàn)證的部分和一個(gè)管理部分。通過(guò)在一個(gè)單獨(dú)的部署每個(gè)部分起源，例如，https://public.e/upload/ad_content/xuanchuantu-1.jpgample.com，https://users.e/upload/ad_content/xuanchuantu-1.jpgample.com，和https://admin.e/upload/ad_content/xuanchuantu-1.jpgample.com-我們可以確保瀏覽器彼此隔離這些應(yīng)用程序“。

Philippe相信，分區(qū)化是減少客戶端漏洞影響的關(guān)鍵。“適當(dāng)?shù)姆指魧⒎乐箲?yīng)用程序公共部分的XSS漏洞也自動(dòng)損害用戶信息。”

您可能還會(huì)喜歡： 解構(gòu)Monolith：設(shè)計(jì)可大化開(kāi)發(fā)人員生產(chǎn)力的軟件。

7.使用Google跟蹤代碼管理器時(shí)要小心
網(wǎng)站安全：谷歌標(biāo)簽管理器
在為個(gè)人和企業(yè)授予對(duì)Google跟蹤代碼管理器的訪問(wèn)權(quán)限時(shí)，您應(yīng)該非常小心。
使用Google跟蹤代碼管理器，可以輕松添加最新的跟蹤腳本，支持團(tuán)隊(duì)想要的聊天機(jī)器人以及用于用戶分析的Hotjar。 

但是James Hall指出，雖然很想允許組織中的每個(gè)人（有時(shí)甚至是外部）訪問(wèn)您的Google跟蹤代碼管理器，但您仍需要注意。

他警告說(shuō)：“如果某個(gè)Google帳戶被黑客入侵，則可以向您的網(wǎng)站添加任意JavaScript。” “復(fù)雜的攻擊可能會(huì)將您的用戶帶到偽造的付款頁(yè)面，讓他們完成訂單，將錢匯給其他人！”

8.使用第三方腳本更具選擇性
即使不損害對(duì)Google跟蹤代碼管理器的訪問(wèn)權(quán)限，您選擇添加的跟蹤腳本本身也可能會(huì)遭到黑客入侵。在基于JavaScript的Web應(yīng)用程序中使用第三方庫(kù)和開(kāi)放源代碼組件是一種常見(jiàn)的做法，但是它使您暴露出只能在一定程度上控制的漏洞。

“如果您將“每周風(fēng)味”聊天窗口小部件添加到您的站點(diǎn)，則任何有權(quán)訪問(wèn)其服務(wù)器的人現(xiàn)在都可以修改您的網(wǎng)站，” James Hall警告說(shuō)。“這發(fā)生在英國(guó)航空公司和Ticketmaster包括一個(gè)名為Feedify的推送通知庫(kù)時(shí)。”

James建議，對(duì)哪些第三方可以訪問(wèn)您的頁(yè)面有更多選擇，這也將有助于您遵守歐盟的《通用數(shù)據(jù)保護(hù)條例》（GDPR）。您所提供的信息越少，使人們?cè)谀碾[私政策中了解的信息就越少，這意味著違反GDPR的可能性就更低。 

James也建議不要考慮讓Shopify為您托管它，而不是讓其他第三方托管您的JavaScript框架。 

他說(shuō)：“與自動(dòng)熱鏈接最新版本的開(kāi)源依賴項(xiàng)相比，他們?cè)谑鼓馐苋魏卫_方面要做得更好。”

您可能還會(huì)喜歡： 應(yīng)用程序開(kāi)發(fā)人員需要了解的GDPR。

9.審核您的依賴項(xiàng)
您可能會(huì)使用許多本地構(gòu)建工具來(lái)創(chuàng)建前端，例如SCSS插件。James Hall建議確保您定期運(yùn)行npm audit以顯示易受攻擊的軟件包的列表并升級(jí)它們，以避免無(wú)意中將安全性問(wèn)題包括到內(nèi)置的JavaScript文件中。

如果使用GitHub，它現(xiàn)在將標(biāo)記易受攻擊的依賴關(guān)系，并且還有Snyk之類的替代服務(wù)，可以自動(dòng)檢查源代碼并打開(kāi)請(qǐng)求請(qǐng)求以更改版本。

最后，如果您要為無(wú)法訪問(wèn)Google跟蹤代碼管理器的客戶端構(gòu)建主題，James建議使用BuiltWith之類的工具進(jìn)行快速審核。

網(wǎng)站安全性：buildwith
BuiltWith使您能夠找出網(wǎng)站完全使用哪種工具和技術(shù)。
10.將子資源完整性用于第三方CDN托管
但是，有時(shí)您無(wú)法避免使用第三方。Snyk的Liran Tal指出，我們經(jīng)常使用外部托管的字體和CSS庫(kù)，并將它們導(dǎo)入具有內(nèi)容傳送網(wǎng)絡(luò)（CDN）的Web應(yīng)用程序中。 

他問(wèn)道：“如果有人訪問(wèn)這些庫(kù)的代碼并將其替換為自己的惡意版本，將會(huì)發(fā)生什么？” “如果網(wǎng)絡(luò)介質(zhì)被破壞或發(fā)現(xiàn)不安全，將會(huì)發(fā)生什么？攻擊者獲得對(duì)構(gòu)建服務(wù)器或CDN交付的我們自己代碼的緩存或存儲(chǔ)的訪問(wèn)權(quán)限，甚至可能損害我們自己的源代碼！”

為了幫助解決此問(wèn)題，Liran建議使用Subresource Integrity，該規(guī)范可提供網(wǎng)頁(yè)中所使用資源的完整性的證明，并傳達(dá)其內(nèi)容未被篡改。使用完整性屬性聲明資源，該屬性利用在功能上使用資源之前瀏覽器驗(yàn)證的加密哈希。

James Hall同意，并說(shuō)Subresource Integrity對(duì)于確保資產(chǎn)與您打算包含的資產(chǎn)相同非常有用。這是一個(gè)校驗(yàn)和，可確保您的腳本與以前的相同：

11. HTML編碼還不夠
WebStoating的聯(lián)合創(chuàng)始人Ilya Verbitskiy是一家?guī)椭緞?chuàng)建成功的在線業(yè)務(wù)的機(jī)構(gòu)，建議特別注意HTML編碼。 

“如果將用戶輸入的內(nèi)容放在HTML標(biāo)記（例如
或）內(nèi)，則效果很好

。它也適用于HTML屬性中使用的數(shù)據(jù)。但是，當(dāng)您在標(biāo)記內(nèi)，URL內(nèi)或事件處理程序（如onclick或）中呈現(xiàn)用戶輸入時(shí)，HTML編碼將無(wú)濟(jì)于事onerror。”


Ilya指出，例如，以下代碼段很危險(xiǎn)： 

Sample Link

這很危險(xiǎn)，因?yàn)? Model.UserInput可能是alert(document.location)或： 

eval(String.fromCharCode(105,102,40,33,119,105,110,100,111,119,46,120,41,123,97,108,101,114,116,40,100,111,99,117,109,101,110,116,46,108,111,99,97,116,105,111,110,41,59,119,105,110,100,111,119,46,120,61,49,59,125))
另一個(gè)危險(xiǎn)代碼可能如下所示：

Sample Link

在這種情況下，Model.UserLink可能是： 

javascript:eval(String.fromCharCode(105,102,40,33,119,105,110,100,111,119,46,120,41,123,97,108,101,114,116,40,100,111,99,117,109,101,110,116,46,108,111,99,97,116,105,111,110,41,59,119,105,110,100,111,119,46,120,61,49,59,125))
這將給用戶帶來(lái)麻煩，因?yàn)橐坏┯脩魡螕裟_本，腳本將被執(zhí)行。

Ilya承認(rèn)：“編寫所有編碼器以防止XSS并非易事，”。“首先，該庫(kù)應(yīng)支持不同的執(zhí)行上下文。它必須了解瀏覽器支持的不同編碼，并且必須意識(shí)到必須過(guò)濾掉的潛在危險(xiǎn)HTML屬性。”

Ilya建議使用已經(jīng)實(shí)現(xiàn)了推薦的XSS保護(hù)技術(shù)并且免費(fèi)提供的庫(kù)：

DOMPurify：易于使用，因?yàn)樗挥幸环N方法可以清理用戶的輸入。它的默認(rèn)策略已被多個(gè)用戶證明，帶有自定義規(guī)則的選項(xiàng)，并支持HTML5，SVG和MathML。
secure-filters：Salesforce的此庫(kù)提供清理HTML，JavaScript，內(nèi)聯(lián)CSS樣式和其他上下文的方法。如果您想在其他地方使用用戶輸入，例如生成CSS或JavaScript，則特別有用。
12.實(shí)施內(nèi)容安全策略
網(wǎng)站安全：內(nèi)容安全政策
內(nèi)容安全策略（CSP）。
“分層安全性”或“分層防御”是網(wǎng)絡(luò)安全領(lǐng)域中眾所周知的方法，描述了結(jié)合多種安全控制措施來(lái)保護(hù)數(shù)據(jù)的做法。Ilya Verbitskiy說(shuō)，它也適用于前端安全性。他建議：“即使該站點(diǎn)因XSS漏洞而受到損害，我們也必須將用戶損失降至最低。”

“ XSS攻擊的通常結(jié)果是將腳本注入到易受攻擊的網(wǎng)頁(yè)中，” Ilya解釋說(shuō)。“腳本要么從本地存儲(chǔ)和會(huì)話存儲(chǔ)中竊取用戶的cookie和數(shù)據(jù)，要么注入鍵盤記錄器，甚至進(jìn)行加密貨幣挖掘。大多數(shù)攻擊都需要在黑客的服務(wù)器和受害者之間進(jìn)行通信的渠道。通信渠道可以是AJAX呼叫，標(biāo)簽，iframe或網(wǎng)絡(luò)套接字。您的目標(biāo)應(yīng)該是打破溝通渠道。”

所有現(xiàn)代瀏覽器都已經(jīng)實(shí)現(xiàn)了以下解決方案：內(nèi)容安全策略（CSP），這是一種附加的安全層，有助于檢測(cè)和緩解某些類型的攻擊，包括XSS和數(shù)據(jù)注入攻擊。要啟用CSP，您需要配置Web服務(wù)器以返回Content-Security-PolicyHTTP標(biāo)頭，該標(biāo)頭通過(guò)聲明允許加載哪些資源來(lái)幫助緩解XSS風(fēng)險(xiǎn)。例如： 

Content-Security-Policy: default-src 'self'; child-src child-src 'none'; img-src https://cdn.e/upload/ad_content/xuanchuantu-1.jpgample.com 'self'; object-src 'none'
如果您的網(wǎng)站的網(wǎng)址是https://e/upload/ad_content/xuanchuantu-1.jpgample.com，CSP塊的使用，以及標(biāo)簽，以及框架和網(wǎng)絡(luò)工作者。該瀏覽器將只加載圖像https://e/upload/ad_content/xuanchuantu-1.jpgample.com和https://cdn.e/upload/ad_content/xuanchuantu-1.jpgample.com。所有其他資源（例如腳本和樣式表）都必須托管在上https://e/upload/ad_content/xuanchuantu-1.jpgample.com。

另外，您可以使用HTML頁(yè)面中的標(biāo)記定義策略：

內(nèi)容安全策略提供了許多指令，可幫助您定義最適合您的項(xiàng)目的策略。一些使用最廣泛的指令包括default-src，child-src，script-src，style-src，img-src，connect-src等。Ilya建議確保始終將default-src定義為后備忘記了指令。

您可能還會(huì)喜歡： 2019年的移動(dòng)設(shè)計(jì)趨勢(shì)。

13.注意要暴露的東西
最后，請(qǐng)務(wù)必牢記要在代碼中暴露給前端的數(shù)據(jù)。 

“在某些情況下，在產(chǎn)品頁(yè)面上使用產(chǎn)品JSON可能會(huì)有所幫助，但這也意味著您正在向前端顯示應(yīng)該是私人商人的數(shù)據(jù)，” Taproom Agency創(chuàng)始人Kelly Vaughn警告說(shuō)。“一種好的做法是將這種數(shù)據(jù)存儲(chǔ)在一個(gè)元字段中，因?yàn)楸仨毷謩?dòng)賦予每個(gè)的元字段以允許通過(guò)API讀取的權(quán)限。”

而且，如果您使用源代碼控制進(jìn)行主題開(kāi)發(fā)（例如GitHub），請(qǐng)始終隱藏API密鑰，Kelly建議。使config.yml或.env文件在GitHub上可用，任何人都可以訪問(wèn)商店的主題（以及通過(guò)私有應(yīng)用程序允許的任何其他權(quán)限）。也僅允許訪問(wèn)您真正為應(yīng)用程序所需的功能。如果您僅使用私有應(yīng)用程序來(lái)構(gòu)建或更改主題，則應(yīng)禁止所有訪問(wèn)權(quán)限（讀寫主題除外）。

安全促進(jìn)信任
安全比以往任何時(shí)候都重要。無(wú)論是大型公司還是小型站點(diǎn)，任何人都可能發(fā)生違反行為。我們需要注意不要泄露客戶數(shù)據(jù)，并且需要了解部署網(wǎng)站或應(yīng)用程序時(shí)可能發(fā)生的許多攻擊以及可能發(fā)生的錯(cuò)誤?，F(xiàn)代JavaScript框架承擔(dān)了很多風(fēng)險(xiǎn)，但不能完全依靠它們。

客戶期望他們的在線體驗(yàn)是安全的，并且他們提供的任何信息都不會(huì)被他們所期望的方式竊取或使用?？蛻舴催^(guò)來(lái)希望您保護(hù)他們的站點(diǎn)，他們的數(shù)據(jù)和他們的客戶。按照各種方法自己保護(hù)站點(diǎn)安全并減少本文中探討的漏洞，您將贏得信任并向您的客戶表明您非常重視安全性。

文章題目：網(wǎng)站安全知識(shí)看看國(guó)外怎么說(shuō)？
當(dāng)前路徑：http://www.muchs.cn/news8/181658.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供搜索引擎優(yōu)化、品牌網(wǎng)站建設(shè)、云服務(wù)器、網(wǎng)站營(yíng)銷、App開(kāi)發(fā)、微信公眾號(hào)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)

成都網(wǎng)站建設(shè)