The Interplanetary FileSystem (IPFS) is sometimes complicated to understand.

With this example we will try to start an IPFS Server. Follow these instructions: How to install Embark by Status in MacOS (Ethereum Dapp development)

Run: ipfs daemon to start the Service

Captura de pantalla 2019-04-29 a las 19.18.30.png

You can open another terminal window and run: ipfs swarm peers to see the nodes connections

Captura de pantalla 2019-04-29 a las 19.24.37.png

Once the server is up and running, you can try to add a website in the server with a simple HTML page.

The Javascript code:

Captura de pantalla 2019-04-29 a las 19.51.19.png

var ipfs = window.IpfsApi('', '80')

function processFile(evt) {

var file =[0];
reader = new FileReader();

reader.onload = function(e) {
var data =;

const Buffer = window.IpfsApi().Buffer;

const buf = Buffer.from(data) // Convert data into buffer
const files = [{
path: '/Reports/',

content: buf

ipfs.files.add(files, function(err, files) {
// 'files' will be an array of objects containing paths and the multihashes of the files added
if (err) {
} else {
document.getElementById('output').innerHTML = "<b>" + files[0].hash + "</b>
<a target='new' href='"+files&#91;0&#93;.hash+"'>Link to Global IPFS "+files[0].path+"
" + "<a target='new' href='"+files&#91;0&#93;.hash+"'>Link to IPFS Server "+files[0].path+"";


const log = (line) = {

Remember, this code uses these Javascript libraries:

You can try and test:

Basically is push a file, WAIT a moment, and after some little time requested, the file will appear in the IPFS network. Example:

Captura de pantalla 2019-04-29 a las 19.18.19.png

Captura de pantalla 2019-04-29 a las 19.25.19.png




Posted by:.

3 replies on “HTML and Javascript code to load a file in your IPFS Server

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s