Save content directly from browser
Tags: blob, filesaver, save
Published: 2020-05-07 22:27:06

Sometimes you want to save content, a text for example directly from the browser, without talking to a server.

Here I use the nice library [FileSaver](https://github.com/eligrey/FileSaver.js/)

```html
<textarea id="notes" style="width:300px; height: 100px;">
Content
</textarea>
<br />
<button onclick="saveContent()">
  Save
</button>

<script>
  function saveContent () {
    let data = notes.value
    var blob = new Blob([data], {type: "text/plain;charset=utf-8"});
    var name = prompt("Save file under")
      if (name != "" ) {
        saveAs(blob, name)         
      }
}
</script>
```

You can test it here [SaveContent](https://flems.io/#0=N4IgtglgJlA2CmIBcA2FA6ALAdgDQgGd4EBjAF3imRHQAsyxYR8AzCBA5AbVADsBDMIiQ16jZiBIB7XhVnUAPBQAeZfgCd4-AATQAvAB0QvKRQJHtBMgE8EhkAHdoZWkgDMABg8AHZQG5tWngIAHN6JG0ARi9fPyMAPgNeAGEZOTIkhQB6FTVNfkTeBQAjdW0swqTM4oBXMjIZbRkSWAgSAGt7An4AN3hU2XhZAAoASgSk7W0AZV74TKza+plKooISdQhvMkKplhrecghG7r6B9O0x7WBJqe0EMm0ofjVtPW0TM3Qe-lga+d4d20PzKxVgUmKbw+8Ac2gAQuDisMuM81ABdXDXGzeeARIy5LLeWD8CC8PwkWgaIhkPR1FgAWgAHEYAL6jOKAu4gj6CeBQ7zqKRgbbDIyzPraNgIbQHKDwdRGcacoEQFiXARCbQAQneRgso2utyBU1O8AAggRhmCIZiNfADca7ka7iykq6ill1pttvEJERSGRjrxOCJIgBOJBh+keJAeEAs3B8XnUdAAK04+Gkg3kIiyACotdoAGLseDi+Vp8yAvNTM2WOYWq4lhDlsoQYUIISyF5B9CTGvaABMHkimGjkXpg8w-f7Uzh1m0AFFWtoAOKaayY+hkbxILJZYihDfoaRgWfaAAybSGRAiAA1IpEsgBZACSABVz1NpvA+RfX8ki4AHLTIu6BgFA-ZZFUvD5iEiK-JYxBqnm0GwXm6atLI2jFBAZBOLe2hkOo-yYqScqyBEmCYsSyilFo7QRMRpH3PwyinmA-BMSR8CYgQnHqPU-DFAQ3EsUSNQEBJolETx2ioTB+aFgAAgQUg1OoJB8tuu77t4GmwOgh4hMep5ZCEeG0DUxRZM2ZZzOolaLIiWScVY8q2aWraVvJaFJNypoWlCgVVlM+7aK+i5RB4ADU6o9hKIVKlMAA+KWXNi8BSGqAg9KELxSGUOq6iAsrwGwvCUBYABk1XOlMuX5Q0jlgAQ5YAPLqO1OK8AiELaLVPJ5SEBUtW1cydd1Qx9cU6C4bwUDDI1I3NaMyXlFkS59Oo1gyHyxBELcaWXPshyBjIwx5TCBo3LwBgZKVRCWMRbQPRy93hZF2gKNEugENo8DKESbR4bAC4HAQNTeN4hUUJBd2BmqwyZdlQ1NYV2p6CVZUVVVIADXVCNAi+0xfVwE5hmiBgGOgWToGYZBLb06OOZJ8pmiEQxkGthoI-dmhkBpZJVGQ7r3SCIv3VMUBSCQUJXQ46AyyQNRdhkfOPBtTS8GD2ic48ACqABKF7aA4QSApVWkEN0O26ICJD8E9M1wjU7Byo56aBE7vAAOSPFI22bDAQy6I81jwOr933Zi+sAPrG6b7ynUcF03ZLGTEZHQvAhAMLoIn2jHQr6AOPAxTtHhhfF3nDjvZnYuZ5ihfvCX1fpSXZcV1XJtFx3tcZ3xcxx1h7RQsrJ75BQy7wGrIGiiAOl7lkDir6XbjoIVIRZOGYZhlkyhiLARiYkY-CKoP2iO7wcds3Hpoj6SY-vFqJeAxQ6gCLAAASUhWAT2gjAywcDrKQ-BIL41JPWPoj9eDtEvi0Noz9JQHFTrwJaUg5Tpw1uLDQAM+jYXeBPDYWhp4EMZkYZ86kiCLnIeYEA7IM73XgOQ9ApI8JULZrQrmoocGZyMIgjoJ9ZIsRYL8IgmIFaYg8NI2R2gZHyKYU3SU4jeIqNgBI9RmixEaLUQo3gNRYDHz4YwvhJg5RKwgFJF4FJuEjBYVzUx0dRaXy7pXMgcdNAAEc44sH+q3Wupdy7uKNvALx-wrB2WmNYdyZ4NaYm8b4-xud87eIiWQKJMSKBgD7mbYJeFPFhKSbkkuYApAAC9QnhPgJEryWTZ6XxcIKBwcd1JkAINAPkydUHnXQYDbBzj7qXUCdSV8YAhBQAgC8PkNd87UnfO2LKdRRjDBTr0q4t1BmZyaVIWEgN67OITPIpxDdL4sEKlpe+cxhIIDjplKEZ9oatEdr0rIssKBkHpFYfIZ4QBnIIHHSAN8OnlK6Yo+JTxiCRyDHHap-woRcCphCgUssakArlA8GFcKwVrKDBspR3IIDjyhb02F-x-joAQLwEILgDmZ3NqWS4EB6T0gGfwzO3IpRgoxdCmQZL4D-C4BANEdLnGqgytYHEqMuVvCxoAwgL1qWKmuFrGVVjtD8EBBCVM8ByDaETko5xid0CaB6FIdo8B2rFB1eQROqzSwnK2SyAGuiVXhTVf9HQdlDWZy5Sa2egd4BjFFacvhjdnE8tJdiylQwaW0ChB4AI4UWhaDKNijO4ayCYkmdYsgFIoS4ouly006hMQONkHcyVNSy3kLZc48tHjMrJMRSeZoLxhgNsrTiAgjqOV4KJe8TtTaY3UtpUohl0phjMtZbzLZuCyitHcpVMoydSwlq4EYGQFg4pDqrQQIVaIRU+vFcjKtqNF1yHlLKkqha7oMNney5xxEFybMfeyi9QwKyOyMfajgDka1c1ycWhyvanVXxsfGjtyg61vvujslpbSOlyig6B9lmbDlKMzZmzEUSHIFp6Xi60xRbS8hgx9TaJZ1D-2fRqpWuzQHgMxC4UOXdJRrvqWAJjFsmjWt1YbE2VYtkSz4VLNjf7tpQhcFYn1TGq1QiI-TKtMmcKIjjhSTVnMoAFtUcp7VfHb7qGMXOrNRENDxwVsp+OenyAGdgPhs6eKyPsu5NZjxBkoTxztaMSepDLW8dtSbK0iJUMRpJVi8l8B0D6QILQYYrnbMhczgLHO8WDIhvuuh5RObvAQbjr8Oz3SHNpwfcZ7LEHf01P-fKhwmwGYaEeCikyaKza1b5DVvCv4FpGHQFJVoFD8aKkS5l8j2sNW8AXMWmJAN1CCio9oU18pHgNGgaSEIZtLI8Ztfxi8gm32Yj8XHeUs37NoPxSJzO4UZZ+0eCQ6Z2gymaE23x-VAmiKUktr+OU8NjP3RPURtT73NO5K1KlwzTmtmg4K3rSOrT-NucM0FiEiWMs+t+0jPI5na7g-ZRjmHJdwQvN7LQTQap3iQ-Sw3F1T1X0-fwuRXZm8epxbh7Z0+IA45gk1fAhhFOUfnfusB7a-rwHWGmGoCgBa10OXQAAEXakBRcvOyBlbzbQPLP6hvKeErDG5OKCNFtQdj-m2dP4oKK+go3mcT2C4rPkKAovxd8mKmJyrQu5cK8t845LpuU7oH4E86wyNaBWMxGZ1WXMe1K757TlkFPhsmduxQOOqo46fF8epBaUJgCJ9xCItRgMWiSQgH0CIOiiDx74s8gEWyQ028cnbh3d3V3iYrK+ICH4Q0nq1HabHdoHkgGAQxiBIbMsnuvrfIgVyYGj2x5DjzMPIeI+KIl8KRYiySgxmaBagpoDe09TyKwC4RrqGKPwTmV8pBGL40Ge7ur3tWLicZ8KLgXhESFp6oxT3yD-Rf48DQfJPhtB9JHtUxegnYNgthHhSRltfY5RwErUttfYfVn9g9-ohBNV-oAADZWTAsbLTTAh+UeXA--GUAxboMEPkTVLTSqSgIiKQHCPkTQHPb7N9cKTAhWXA9VSSXXN7dSMIJAH1ZWeWQJZWcPWQCnQgp+ceWWHzaZGeOeaYBeJefcVeRWBwDeLeHePefeQ+BgY+ZgeVc+HnH1SQuBOgEnKEcnEw4eUeOjEBcEcBKEO0CnbkBtaQkgWQshHhShaheAOxdpRUCnBtNhXgDhXw-w3hWnARZ5bnJjHifbVRSRWuORBRVI6RVHEzMvNRLIhI3RXIzRfRQxIzN9RLUw9oSxXNWxchDtWtCnOvYXe3MXJvF3EtWXeXRXQQqxHLVXdXWAYNH1b3YWMNJRcKBA57KgvJSESbWJF7Hbb2CUHQFFCgnJU4Vbe2NcKQKQeCPkZIYnIUNrC2EYzaBWWgqBHQNQYjSweg18DfTSPkU0dbFwDVJ5NoHsGQN5cgSOL5LOQQI4wIeoXSLIaQCxEITY7Y1tMAQkIEvYyAVWLIKxSGGpLIOUNQdgAAfn0DDEfAAFZmQ+ET0S4KRBRNRBp7lSS5Nndzk7ip8tAKCu17QSt2UCAq95NEQesWTjoFM3E8Jpgq8KciNgoq8Tx8sl85EFMQVsiLl4AaTdd6TEt-t1NqVaD3hmJ4AR8-jphSQtIIpwNrsGDLANI+Rf83s+QQgIkiAtMJkpkiI5MnBP8XoQhOYygdBB8HCWDnFwooEAB1cuAAaTwkxBuP9x6i0zsKHzoJNJdztD7D4XCh0lEn3FqBCAICCW7jIE3nUG3hi12Q5xqBCBPAsgxKgD0BQGxMwEwA8CURPW5I8UST8QAT72dyAXozdOVRp3ZT7xihKjDNbJAHVPxPRzkyxmTilJlLpPuWOhrMKR8T8Wx1xw8QVmEJhH7K2S7zrJ7UZOcQOyO0Kn6PO0GJXPZQOyBXvggFBW0C7JUwhB6zPLVKUXXOGXznfEXGfAAAV2ojYzQjYABNfbAFE8iU0PYoHXCg1ZfXdBWczc31FMwUUwdAfWGXCAJg5qQPIwU0CBTEHPZPFgVPUwdPWUICkChAMC83YYSZdQS3AKOYE7dZT3ZXJC+CyOOyJmIQTCqeaUlPNPc5AijVYCwSXXEi07LlOigXUsTw+AL01rdQYYbXfi0C29YYdrD+ES+lKSzeXgJSzrLTQrU7BtFSp9MzPHQJAnN43gcw8qSXBAemKQLzKPN9SNcLAVSLaLWLYSuyrZeohvJoiXZvV3Csd3Do-nWDeiyo1yqXbaNnTSoYDC-BRxdyhueK+6TSxyPaGbDGHS2iqCqIsgVwtKldFrDrRyHc9QRKq3JGYq1tOUTGQdPK9AM0OED898OORcI2I2fSo8gFYqvc7Kp1DIp1UqowTSqwerIAwUJrG2AqiXWSh6HrYGfreVbzKkxcfgCkQS9ZPSrK4KpKqSjdEALdfGHdchNESyvy9QXa-ai82K2QI9IKp1ZHN9ZK0uVrJfe6jy8KisaamixzTa2nR66a7qrat9TyrQRox3E61ogK0q2PPqo896+vEGxvHylo6XL0o2D8NvVceKtkP8w7PK160WUYHG4q+66GoK8ixijJUsFitRbPdi0vVRI5aagShS4Sn6i7TaSNPkNVNUPCDVWABvAGZQKxAI26sgP1TQMpPoAG2nU0aWt9bG3ioioNBS-pNmtHS4QGSqrpOVTWoCdqJqosdqA2ICGXZq1qlS2W-G51A6Pkds2nbcvKuW4zePDLNaOPQmyUTqvGkfD2h22bXtbDYsaYOOFFZbd4XDIXUO0wJTCFEKL6i6IjEjIQJzQY6EWECO+UUUnkZOulRueuIsYOqOv3Pix4DK769szlOGyTVAulYGkXbynFOGtohXOlFXVauvNnaawIkWUm+6AukOwUBoBoxGsFfuoutvD8BNfOwuweqQdAVG9GoCVcKESIaege0wOegKqEQcd6BGMe2eoyPKt4EWfeje9SoavIUuk+mes+mQRrTQCawwPem+oemQTS4+5+9e1+gQEuj+vul+ue1K47J+-+r+wBjS1raKv+zOAxIxXe8WQJcBKAfwq8JdTOowA4XszEFFa2dFMLPlbFfI+0euEKdATBsBbSs3U7GDHBtFOOByghiLOWkuCWwNFB4Wz9aSjBofYRWhm2eh-Bm+QhrRYhnu+uVOkKDkFkSIzWG0qVNUf0NUJs0qBacqUkPGABRRkWY6FGNUJwBaXZaq+VHGdRiBABfR4BbR9KKTFMrMdIJIN2pINgxRzg-6ExyqLTKBSjcqKQZQW47QLfKAHfLTOxwDL0SAi-QYVQJxzaCdPkTAmx1xj4AgACNILmIsdQXkZ8NFM-eAZ8TVXJhUWCWJjbTVDVeoTYJYeJ0J2QXA406QGbGpGGBaH-eg5jdbAxhwGCE9XR+7TBQxJ3OVbhuUXGCBA0MpKAAZoyIGWGZJSRv0KFNBEMEAbAdweMRMYwZMEQE8G2CQGpsgageMNEFkIAA)