代表者の戯言

テキストファイルをダウンロード



javaScriptを利用してテキストファイルを作成するとしましょう。ファイル名とファイルの内容、保存先フォルダをユーザー側で指定する方法にて、下記のとおりのプログラムを作成いたしました。ぜひ参考にしてください。


******************************************************************************************************

<!DOCTYPE html>

<html lang="ja">

<head>

<meta charset="UTF-8">

<title>テキストファイル保存</title>

</head>

<body>

<p>保存するファイル名: <input id="text1" size="30"></p>

<p>内容:<br>

<textarea id="text2" rows="5" cols="40" placeholder="ここに文章を入力してください"

></textarea>

</p>

<button onclick="saveFile()">フォルダを選んで保存</button>

<script>

async function saveFile() {

const fileName = document.getElementById("text1").value.trim() || "untitled";

const content = document.getElementById("text2").value;

try {

const options = {

suggestedName: fileName + ".txt",

types: [{

description: 'Text Files',

accept: { 'text/plain': ['.txt'] }

}]

};

// ファイル保存ダイアログを表示

const handle = await window.showSaveFilePicker(options);

// 書き込みストリームを作成

const writable = await handle.createWritable();

await writable.write(content);

await writable.close();

alert("ファイルを保存しました: " + handle.name);

} catch (err) {

if (err.name !== 'AbortError') {

console.error("保存中にエラー:", err);

alert("保存に失敗しました。");

} else {

console.log("保存キャンセルされました。");

}

}

}

</script>

</body>

</html>

******************************************************************************************************
screen