TL;DR: 次の 5 つの重要なテクニックで Web アプリを安全に保ちます: 入力の検証とサニタイズ、コンテンツ セキュリティ ポリシーの実装、サブリソースの整合性の使用、安全な JavaScript 慣行の遵守、定期的なセキュリティ監査の実施。 Web アプリを不正な JavaScript の実行から保護し、ユーザーを保護します。
2024 年初頭、WP Statistics、WP Meta SEO、LiteSpeed Cache などの人気の WordPress プラグインのストアド クロスサイト スクリプティング (XSS) の脆弱性を悪用した一連のサイバー攻撃が発生しました。これらの攻撃により、攻撃者は悪意のある JavaScript を挿入し、500 万を超えるアクティブなインストールを侵害することができました。
ご覧のとおり、これらの攻撃は今日の Web アプリケーションにとってかなりの脅威です。データ漏洩、個人情報の盗難、そして最終的には顧客の信頼の喪失につながる可能性があります。 HackerOne Research によると、XSS 攻撃は 2020 年に報告されたすべてのセキュリティ脅威の 23% を占め、最も頻繁に発生しました。
この記事では、不正な JavaScript の実行からアプリを保護する 5 つのテクニックについて説明します。
これには主に、ユーザーの入力が予期された形式であるかどうかの検証が含まれます。たとえば、電子メール テキスト フィールドのデータは有効な電子メール アドレスである必要があり、ユーザー名テキスト フィールドのデータは予期されるユーザー名の構造に従っている必要があります。
サニタイズは、XSS や SQL インジェクションなどの攻撃に使用される可能性のある悪意のあるデータを除去することで、この入力をクリーンアップします。これら 2 つは、あらゆる Web アプリにとって重要なセキュリティ対策であり、ユーザーが入力する可能性のある悪意のあるデータに対する防御の第一線として機能します。
入力検証とサニタイズを実装する方法HTML 5 を使用した基本的なクライアント側検証の次のコード例を参照してください。
リーリー
b.サーバー側の検証
Node.js と Express を使用した基本的なサーバー側検証の次のコード例を参照してください。
リーリー
c.消毒
リーリー
2. コンテンツセキュリティポリシー(CSP)
もっと簡単に言うと、CSP を Web アプリのバウンサーと考えてください。スクリプトの出所をチェックし、信頼できるソースからのスクリプトのみを許可し、不正なスクリプトを排除します。
CSPの実装方法
主要なディレクティブには以下が含まれます:
リーリー
Nginx
リーリー
メタタグを介して CSP を追加する方法
This security feature helps browsers check if the resources obtained from a third party (for instance, a CDN) have been modified. It allows you to provide a cryptographic hash for these resources. When the browser gets the resource, it compares its hash to the given hash. If the hash does not match, the resources will not be loaded, thereby protecting your app from malicious modifications. Implementing SRI involves adding a cryptographic hash to the integrity attribute of your or tags. Here’s a step-by-step guide to setting up SRI: You must generate a hash for the resource you want to include in your webpage. This can be done using a tool or online service like the Subresource Integrity Generator tool. Once you have the hash, add it to the integrity attribute of the or < link><head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; img-src *"">
</head>
3. Sub-resource integrity (SRI)
How to implement SRI
Step 1: Generating the hash
Step 2: Adding the hash to your resource
Refer to the following code example.
<script src="https://example.com/script.js" integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxqAtD6x48V2aB1xzA7e2h53sF2aAuM" crossorigin="anonymous"></script>
In this example, the integrity attribute contains the hash, and the crossorigin=”anonymous” attribute ensures the resource is fetched with CORS (cross-origin resource sharing).
You can use SRI for stylesheets, as well.
<link rel="stylesheet" href="https://example.com/styles.css" integrity="sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxqAtD6x48V2aB1xzA7e2h53sF2aAuM" crossorigin="anonymous">
Secure JavaScript coding practices are crucial for developing web apps robust against various attacks, XSS, and other malicious exploits. By following these best practices, developers can ensure their code is secure, maintainable, and less vulnerable to unauthorized execution.
The eval() function is a significant security risk, as it executes a string of code, potentially allowing attackers to inject malicious scripts. Always avoid using eval() and similar functions like setTimeout(string) and setInterval(string).
Why these functions are dangerous:
Enabling strict mode in JavaScript helps catch common coding mistakes and unsafe actions, such as assigning values to undeclared variables. This improves the security and stability of your code. To enable strict mode, add “use strict”; at the beginning of a script or a function.
"use strict"; function safeFunction() { // Code in strict mode. let secureVariable = "Secure"; console.log(secureVariable); } safeFunction();
Refer to the following code example.
"use strict"; // Eliminates this coercion. function showThis() { console.log(this); // In non-strict mode, this would be the global object; in strict mode, it's undefined. } showThis(); // Disallows duplicate property names or parameter values. // This will throw an error in strict mode. const obj = { prop: 1, prop: 2 }; // Prevents the use of with statement. // This will throw an error in strict mode. with (Math) { let x = cos(3.14); }
Inline JavaScript can be significantly vulnerable to XSS attacks because it allows attackers to inject malicious scripts directly into your HTML. Instead, use external scripts to ensure all JavaScript is properly vetted and sanitized.
Avoid inline JavaScript because of:
Refer to the following code example.
<!-- Insecure Inline JavaScript --> <!-- <button onclick="alert('Clicked!')">Click Me</button> --> <!-- Secure External JavaScript --> <button id="secureButton">Click Me</button> <script> document.getElementById('secureButton').addEventListener('click', function() { alert('Clicked!'); }); </script>
Regular audits are essential for maintaining the integrity and security of web apps. By continuously assessing your app’s security, you can identify and fix vulnerabilities that could be exploited to execute unauthorized JavaScript or other malicious actions.
Gunakan alatan seperti OWASP ZAP atau Burp Suite untuk mengimbas kelemahan yang diketahui. Imbasan automatik menyediakan cara cepat untuk mengenal pasti isu keselamatan biasa.
Semak semula pangkalan kod anda secara manual untuk mengetahui isu yang mungkin terlepas oleh alatan automatik. Adalah lebih baik untuk menggunakan pembangun berpengalaman dan pakar keselamatan untuk ini.
Upah penguji penembusan untuk mensimulasikan serangan pada apl anda, mendedahkan kelemahan yang mungkin tidak dapat dikesan oleh kaedah lain.
Pastikan kebergantungan anda dikemas kini untuk membetulkan kelemahan yang diketahui dalam perpustakaan dan rangka kerja. Gunakan pengurus pakej seperti NPM atau pip untuk mengurus kemas kini.
Latih pasukan pembangunan anda secara berterusan tentang amalan keselamatan terkini dan kelemahan biasa. Ini akan memastikan pasukan anda dilengkapi untuk menulis kod selamat.
Terima kasih kerana membaca artikel ini. Kami berharap 5 teknik ini meningkatkan pertahanan apl anda terhadap pelaksanaan JavaScript yang tidak dibenarkan. Dengan melaksanakan strategi ini, anda boleh mengurangkan risiko serangan dan memastikan apl web yang lebih selamat dan selamat untuk pengguna anda. Ingat, kekal proaktif dan berwaspada dalam langkah keselamatan anda adalah kunci untuk melindungi aset digital anda.
Pustaka kawalan UI JavaScript Syncfusion ialah satu-satunya suite yang anda perlukan untuk membina apl kerana ia mengandungi lebih 85 komponen UI berprestasi tinggi, ringan, modular dan responsif dalam satu pakej.
Untuk pelanggan semasa, versi terbaru Essential Studio tersedia daripada halaman Lesen dan Muat Turun. Jika anda bukan pelanggan Syncfusion, anda sentiasa boleh memuat turun penilaian percuma kami untuk melihat semua kawalan kami.
Anda juga boleh menghubungi kami melalui forum sokongan, portal sokongan atau portal maklum balas kami. Kami sentiasa berbesar hati untuk membantu anda!
Atas ialah kandungan terperinci Teknik teratas untuk Melindungi Apl Web daripada Perlaksanaan JavaScript Tanpa Kebenaran. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!