A file input or drop gives you File objects (a kind of Blob) with name, size, type. Read them with FileReader (readAsText, readAsDataURL) or the modern promise-based file.text()/file.arrayBuffer(). URL.createObjectURL(file) makes a preview URL — revoke it when done.
<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><input type="file" id="f"><pre id="o"></pre>
<script>document.getElementById('f').onchange=async e=>{const file=e.target.files[0];if(file)document.getElementById('o').textContent=(await file.text()).slice(0,200);};</script></body></html>