Filestorage JS

  • A JS Library for decentralized storage in SKALE Network.

  • Flexible upgradeable scheme.

  • Uses special storage layer provisioned on each node of a SKALE Chain.

Overview

Storing files on the blockchain is possible within the SKALE Network. You can use SKALE to host your text, image, HTML, and other file formats through the Filestorage.js NPM package.

See the file storage demo on Github.

Installation

$ npm install @skalenetwork/filestorage.js@~1.0.1

Usage

Once installed, you can instantiate the client by passing a SKALE endpoint into the constructor.

  • Javascript

  • HTML

In Javascript, you should import filestorage.js from the npm package:

const Filestorage = require('@skalenetwork/filestorage.js');
const Web3 = require('web3');

const web3Provider = new Web3.providers.HttpProvider('----SKALE ENDPOINT----');
let filestorage = new Filestorage(web3Provider);

// Directly with http(s)/ws(s) endpoints
let filestorage = new Filestorage('----HTTP(s)/WS(s) SKALE ENDPOINT----');

To use filestorage.js in HTML you should import filestorage.min.js from the npm package:

<script src="PATH_TO_PACKAGE/@skalenetwork/filestorage.js/dist/filestorage.min.js"></script>
<script type="text/javascript">
    async function downloadFile() {
        let fs = new filestorage('----SKALE ENDPOINT----', true);
        await fs.downloadToFile('----STORAGE_PATH----');
    }
</script>

Upload Files

Uploading files can be accomplished by using the uploadFile method available within the Filestorage.js NPM package.

specificDirectory - (Optional) path to the directory inside account’s root directory to create file: dirA/dirB

//Input field to add to your HTML
<input onChange={(e) => upload(e)} type="file" id="files" />

//JavaScript function for handling the file upload
async function upload(event, specificDirectory=''){
  event.preventDefault();
  //create web3 connection
  const web3Provider = new Web3.providers.HttpProvider(
    "[YOUR_SKALE_CHAIN_ENDPOINT]"
  );
  let web3 = new Web3(web3Provider);

  //get filestorage instance
  let filestorage = new Filestorage(web3, true);

  //provide your account & private key
  //note this must include the 0x prefix
  let privateKey = '0x' + '[YOUR_PRIVATE_KEY]';
  let account = "[YOUR_ACCOUNT_ADDRESS]";

  //get file data from file upload input field
  let file = document.getElementById('files').files[0];
  let reader = new FileReader();

  //file path in account tree (dirA/file.name)
  let filePath;
  if (specificDirectory === '') {
    filePath = file.name;
  } else {
    filePath = specificDirectory + '/' + file.name;
  }

  //file storage method to upload file
  reader.onload = async function(e) {
    const arrayBuffer = reader.result
    const bytes = new Uint8Array(arrayBuffer);
    let link = filestorage.uploadFile(
      account,
      filePath,
      bytes,
      privateKey
    );
  };
  reader.readAsArrayBuffer(file);
}

Show Contents

Displaying files and directories can be accomplished by using the listDirectory method available within the Filestorage.js NPM package.

storagePath - Storage path to the certain directory in File Storage

async function getFiles(storagePath){
  //create web3 connection
  const web3Provider = new Web3.providers.HttpProvider(
    "[YOUR_SKALE_CHAIN_ENDPOINT]"
  );
  let web3 = new Web3(web3Provider);

  //get filestorage instance
  let filestorage = new Filestorage(web3, true);

  //provide your account & private key
  let account = "[YOUR_ACCOUNT_ADDRESS]";

  let files = await filestorage.listDirectory(storagePath);
}

Download Files

Downloading files can be accomplished by using the FilestorageClient.downloadToFile or the downloadToBuffer method available within the Filestorage.js NPM package.

storagePath - Storage path to the certain directory in File Storage

async function downloadFileToDesktop(storagePath) {
  //create web3 connection
  const web3Provider = new Web3.providers.HttpProvider(
    "[YOUR_SKALE_CHAIN_ENDPOINT]"
  );
  let web3 = new Web3(web3Provider);

  //get filestorage instance
  let filestorage = new Filestorage(web3, true);

  await filestorage.downloadToFile(storagePath);
}

async function downloadFileToVariable(storagePath) {
  //create web3 connection
  const web3Provider = new Web3.providers.HttpProvider(
    "[YOUR_SKALE_CHAIN_ENDPOINT]"
  );
  let web3 = new Web3(web3Provider);

  //get filestorage instance
  let filestorage = new Filestorage(web3, true);

  let file = await filestorage.downloadToBuffer(storagePath);
  file = 'data:image/png;base64,' + file.toString('base64');
}

Delete Files

Deleting files can be accomplished by using the deleteFile method available within the Filestorage.js NPM package.

filePath - path to the file inside account’s root directory: dirA/dirB/file.txt

async function deleteFile(filePath) {
  //create web3 connection
  const web3Provider = new Web3.providers.HttpProvider(
    "[YOUR_SKALE_CHAIN_ENDPOINT]"
  );
  let web3 = new Web3(web3Provider);

  //get filestorage instance
  let filestorage = new Filestorage(web3, true);

  //provide your account & private key
  //note this must include the 0x prefix
  let privateKey = '[YOUR_PRIVATE_KEY]';
  let account = "[YOUR_ACCOUNT_ADDRESS]";

  await filestorage.deleteFile(account, filePath, privateKey);

Create Directory

Creating directory can be accomplished by using the createDirectory method available within the Filestorage.js NPM package.

directoryPath - path to the directory inside account’s root directory: dirA/dirB/newDir

async function createDirectory(directoryPath) {
    //create web3 connection
    const web3Provider = new Web3.providers.HttpProvider(
        "[YOUR_SKALE_CHAIN_ENDPOINT]"
    );
    let web3 = new Web3(web3Provider);

    //get filestorage instance
    let filestorage = new Filestorage(web3, true);

    //provide your account & private key
    //note this must include the 0x prefix
    let privateKey = '[YOUR_PRIVATE_KEY]';
    let account = "[YOUR_ACCOUNT_ADDRESS]";

    await filestorage.createDirectory(account, directoryPath, privateKey);
}

Delete Directory

Deleting directory can be accomplished by using the deleteDirectory method available within the Filestorage.js NPM package. The directory should be empty to delete it.

directoryPath - path to the directory inside account’s root directory: dirA/dirB/newDir

async function deleteDirectory(directoryPath) {
    //create web3 connection
    const web3Provider = new Web3.providers.HttpProvider(
        "[YOUR_SKALE_CHAIN_ENDPOINT]"
    );
    let web3 = new Web3(web3Provider);

    //get filestorage instance
    let filestorage = new Filestorage(web3, true);

    //provide your account & private key
    //note this must include the 0x prefix
    let privateKey = '[YOUR_PRIVATE_KEY]';
    let account = "[YOUR_ACCOUNT_ADDRESS]";

    await filestorage.deleteDirectory(account, directoryPath, privateKey);
}

Reserve space

Reserve space for certain address in Filestorage in bytes.

Can only be called by SKALE Chain owner.

addressToReserve - User address to reserve space for reservedSpace - Reserved space in bytes

async function reserveSpace(addressToReserve, reservedSpace) {
    //create web3 connection
    const web3Provider = new Web3.providers.HttpProvider(
        "[YOUR_SKALE_CHAIN_ENDPOINT]"
    );
    let web3 = new Web3(web3Provider);

    //get filestorage instance
    let filestorage = new Filestorage(web3, true);

    //provide your SKALE Chain owner account & private key
    //note this must include the 0x prefix
    let privateKey = '[YOUR_PRIVATE_KEY]';
    let account = "[YOUR_ACCOUNT_ADDRESS]";

    await filestorage.reserveSpace(account, addressToReserve, reservedSpace, privateKey);
}
If you are using external signing (Metamask), then omit the privateKey: 
filestorage.reserveSpace(ownerAddress, addressToReserve, reservedSpace);

Additional Notes

Storage path

Storage path is a label used to point to file or directory in Filestorage. It contains 2 parts through slash:

  1. File owner address (LOWERCASE & without 0x)

  2. File/directory path in owner’s root directory

Examples:

77333da3492c4bbb9ccf3ea5bb63d6202f86cda8/directoryA/random_text.txt
77333da3492c4bbb9ccf3ea5bb63d6202f86cda8/random_text.txt
0x77333da3492c4bbb9ccf3ea5bb63d6202f86cda8/random_text.txt #invalid storagepath
Edit on Github