JavaScript:テキストをデータ URL にしてダウンロード

以前やった URL.createObjectURL で良いと思いますが、直接作っちゃっても行けたのでメモ。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>テキストのデータURL例</title>
</head>
<body>
    <span id="dataUrlContainer"></span>

    <script>
    function convertToDataURL(text) {
        const encodedText = encodeURIComponent(text);
        return `data:text/plain;charset=utf-8,${encodedText}`;
    }

    // 使用例
    const plainText = 'Hello World!';
    const dataURL = convertToDataURL(plainText);

    // spanの中にリンクを作成
    const container = document.getElementById('dataUrlContainer');
    const link = document.createElement('a');
    link.href = dataURL;
    link.textContent = 'テキストをダウンロード';
    // ダウンロード時のファイル名
    link.download = 'message.txt';

    container.appendChild(link);
    </script>
</body>
</html>

コメント