Code Monkey home page Code Monkey logo

upload-files-to-ipfs-from-browser-panel's Introduction

Upload Files to IPFS from Browser - Panel

Upload files to IPFS with Browser - Panel

Introdução

Suba seus arquivos para a IPFS diretamente pelo Browser. Você pode escolher entre usar um node IPFS rodando localmente ou remotamente, portanto instalar um node IPFS é opcional.

Uma interface web simples e intituiva para a API js-ipfs-http-client

As linguagens utilizadas aqui (javascript, html e css) se aplicam a qualquer servidor web, podem rodar tanto com node js, conforme segue o tutorial abaixo, como em outros. Para rodar no apache e nginx, por exemplo, basta copiar os arquivos de dentro do diretório /public para o diretório do seu servidor (por exemplo /var/www/html/).

Demo Online

Você pode acessar o mesmo neste link. É o mesmo código, hospedado pelo Github Pages

Caso decida usar um node IPFS rodando localmente, lembre-se de Setar o Cors corretamente.

Caso contrário terá erros de permissão nas requisiçôes.

Instalando e rodando (node js):

Primeiramente resolva as dependências (git, npm e node js)

Debian / Ubuntu:

  sudo apt update && sudo apt upgrade

  sudo apt install curl python-software-properties

  curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -

  sudo apt install nodejs

  sudo apt install git

Para verificar as versões instaladas:

node -v
npm -v
git --version

Instalando

git clone https://github.com/anarkrypto/upload-files-to-ipfs-from-browser-panel.git

cd upload-files-to-ipfs-from-browser-panel

npm install

Para iniciar o servidor localmente então, (porta 3000 por padrão), digite no mesmo diretório:

node app.js

Se deu tudo certo, ele vai retornar algo como Server listening on https://localhost:3000

Então abra este endereço https://localhost:3000 no seu navegador e pronto! Já pode começar a enviar seus arquivos, a interface é intuitiva.

Para rodar a API em um node IPFS localmente

Caso ainda não tenha instalado, siga os passos de instalação e configuração do node IPFS: IPFS - Getting Started

Cors

Após isso, configure o CORS, com os seguintes comandos no seu terminal:

ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin '["*"]'
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Methods '["GET", "POST"]'
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Headers '["Authorization"]'
ipfs config --json API.HTTPHeaders.Access-Control-Expose-Headers '["Location"]'
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Credentials '["true"]'

Inicie o node novamente

ipfs daemon 

Pronto! Seu node estará online localmente e pronto pra servir as requisições API.

Por padrão, o node IPFS roda a API em localhost:5001 (ou 127.0.0.1:5001). E o gateway na porta 8080.

upload-files-to-ipfs-from-browser-panel's People

Contributors

jefterrocha avatar anarkrypto avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.