ChatGPTにWEBアプリを作らせてみた
CSVファイルの文字化けを直すWEBアプリを作らせてみました
CSVファイルをGoogleスプレッドシートで編集しようとしたとき文字が化けて読めませんでした。文字化けを直すにはCSVをGoogleスプレッドシート形式に変換すれば読めるのですが、CSVのままにしたい。そうするには文字コードを変換しないと読めないようです。
私のChromeBookでは簡単に変換できないので変換アプリをChatGPTに作ってもらいました。
結果が下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CSVファイルの文字コード変換</title>
</head>
<body>
<input type="file" id="input-file">
<button id="convert-button">変換</button>
<script>
const inputElement = document.getElementById('input-file');
const convertButton = document.getElementById('convert-button');
function decodeShiftJis(bytes) {
const decoder = new TextDecoder('shift_jis');
return decoder.decode(bytes);
}
function encodeUtf8(string) {
const encoder = new TextEncoder();
return encoder.encode(string);
}
convertButton.addEventListener('click', () => {
const file = inputElement.files[0];
const reader = new FileReader();
reader.onload = () => {
const inputBytes = new Uint8Array(reader.result);
const inputText = decodeShiftJis(inputBytes);
const outputBytes = encodeUtf8(inputText);
const outputBlob = new Blob([outputBytes], {type: 'text/csv;charset=UTF-8'});
const outputUrl = URL.createObjectURL(outputBlob);
const outputLink = document.createElement('a');
outputLink.href = outputUrl;
outputLink.download = 'output.csv';
document.body.appendChild(outputLink);
outputLink.click();
document.body.removeChild(outputLink);
URL.revokeObjectURL(outputUrl);
};
reader.readAsArrayBuffer(file);
});
</script>
</body>
</html>
少しだけ変更した完成品がこちら
ファイルを選択して変換ボタンを押すだけ。簡単ですがこれで十分
完成品リンクはこちら
ふーん、って感じでした。
ChatGPTでプログラム組めるけど、正しく動作しているかは自分で確かめないとね
この記事が気に入ったらサポートをしてみませんか？