ローカルストレージのセキュリティ問題を調査する: セキュリティのリスクと予防策を理解する

ローカルストレージが安全でないのはなぜですか?セキュリティ リスクと予防策を理解するには、具体的なコード例が必要です。

はじめに:
Web アプリケーションの開発と普及に伴い、ローカル ストレージ (localstorage) は、保存および管理するための重要な方法の 1 つになりました。データ。 。ただし、データの永続性と利便性において比類のない利点があるにもかかわらず、ローカルストレージのセキュリティについては非常に議論の余地があります。この記事では、ローカルストレージのセキュリティリスクを調査し、ユーザーデータを保護するための予防策の具体的なコード例をいくつか紹介します。

パート 1: セキュリティ リスク

1. XSS (クロスサイト スクリプティング攻撃)
   ローカルストレージに保存されたデータは、クライアント アプリケーションに対して透過的です。つまり、あらゆるスクリプトがアクセスしてアクセスできることを意味します。このデータを変更します。これにより、悪意のあるスクリプトの挿入と実行が行われる可能性があります。攻撃者は、悪意のあるスクリプトを挿入することで、データを盗んだり、セッションをハイジャックしたり、ユーザー エクスペリエンスを妨害したりする可能性があります。

サンプル コード:

// 恶意脚本注入示例
// 数据存储
localStorage.setItem('username', '<script>alert("XSS Attack");</script>');
// 数据恢复
document.getElementById('username').innerHTML = localStorage.getItem('username');

2. CSRF (クロスサイト リクエスト フォージェリ)
   ローカル ストレージは同じドメイン内のページ間で共有できるため、攻撃者はこれを悪用できます。この機能により、ユーザーの知らない間にクロスサイト リクエスト フォージェリ攻撃が可能になります。攻撃者は、正当なリクエストを偽造することにより、パスワードの変更やデータの削除など、機密性の高い操作を伴う一連の危険な操作を実行する可能性があります。

サンプル コード:

// CSRF攻击示例
// 伪造请求
var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://target-website.com/delete', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Authorization', 'Bearer ' + localStorage.getItem('user_token'));
xhr.send(JSON.stringify({id: '123456'}));

パート 2: 予防策

1. 入力検証とフィルタリング
   ユーザー入力データの場合、厳密な入力検証とフィルタリング悪意のあるスクリプトの挿入と実行を防ぐためのフィルタリング。

サンプル コード:

// 输入验证和过滤示例
function validateInput(input) {
  return input.replace(/<script.*?>.*?</script>/gi, '');
}
// 存储过滤后的数据
localStorage.setItem('username', validateInput('<script>alert("XSS Attack");</script>'));

2. CSRF トークン
   機密性の高い操作を含むリクエストを行う場合は、CSRF トークンを使用してリクエストの正当性を検証します。リクエストを送信する前に、リクエストのヘッダーまたは本文に CSRF トークンを埋め込み、サーバー側で検証します。

サンプルコード:

// CSRF令牌示例
// 生成令牌
var csrfToken = generateToken();
// 存储令牌
localStorage.setItem('csrf_token', csrfToken);

function generateToken() {
  // 生成随机字符串
  var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
  var token = '';
  for(var i = 0; i < 20; i++) {
    token += characters.charAt(Math.floor(Math.random() * characters.length));
  }
  return token;
}

// 发送请求时添加令牌
var xhr = new XMLHttpRequest();
xhr.open('POST', 'https://target-website.com/delete', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Authorization', 'Bearer ' + localStorage.getItem('user_token'));
xhr.setRequestHeader('X-CSRF-Token', localStorage.getItem('csrf_token'));
xhr.send(JSON.stringify({id: '123456'}));

結論:
ローカルストレージにはデータの永続性と利便性の点でかけがえのない利点がありますが、そのセキュリティについては真剣に考慮する必要があります。入力検証とフィルタリングを強化し、CSRF トークンなどの予防策を使用することで、ユーザー データのセキュリティを効果的に保護できます。 Web 開発者にとって、ユーザー情報のセキュリティを保護するために、ローカルストレージのセキュリティ リスクと予防策を理解することは非常に重要です。

以上がローカルストレージのセキュリティ問題を調査する: セキュリティのリスクと予防策を理解するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。