Skip to content

Instantly share code, notes, and snippets.

@altafshaikh

altafshaikh/ipfs.html

Last active December 24, 2019 13:53
Show Gist options
  • Save altafshaikh/0c9281cc71c922de4e7a6e4087166aa9 to your computer and use it in GitHub Desktop.
Save altafshaikh/0c9281cc71c922de4e7a6e4087166aa9 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
ipfs.html
<!DOCTYPE html>
<html>
<head>
<title>JavaScript file upload</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script src="https://wzrd.in/standalone/buffer"></script>
<script src="https://unpkg.com/[email protected]/dist/index.js"
integrity="sha384-5bXRcW9kyxxnSMbOoHzraqa7Z0PQWIao+cgeg327zit1hz5LZCEbIMx/LWKPReuB"
crossorigin="anonymous"></script>
</head>
<script type="text/javascript">
function upload() {
const reader = new FileReader();
reader.onloadend = function() {
const ipfs = window.IpfsApi('localhost', 5001) // Connect to IPFS
const buf = buffer.Buffer(reader.result) // Convert data into buffer
ipfs.files.add(buf, (err, result) => { // Upload buffer to IPFS
if(err) {
console.error(err)
return
}
let url = `https://ipfs.io/ipfs/${result[0].hash}`
console.log(`Url --> ${url}`)
document.getElementById("url").innerHTML= url
document.getElementById("url").href= url
document.getElementById("output").src = url
})
}
const photo = document.getElementById("photo");
reader.readAsArrayBuffer(photo.files[0]); // Read Provided File
}
</script>
<body>
<form action="/">
<fieldset>
<legend>Upload photo</legend>
<input type="file" name="photo" id="photo">
<button type="button" onclick="upload()">Upload</button>
</fieldset>
</form>
</br>
</br>
<a id="url"></a>
</br>
</br>
<img id="output">
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment