4.3 IPFS+區塊鏈

尹成發表於2018-11-09
  1. js-ipfs-api 
    1. 如何使用js-ipfs-api
  2. 具體實現 
    1. 安裝create-react-app:sudo npm install -g create-react-app
    2. 建立React專案:create-react-app ipfs-http-demo
    3. 執行:cd ipfs-http-demo && npm start
    4. 安裝 ipfs-api:npm install –save ipfs-api
    5. 完成前端邏輯
    6. 匯入ipfs 
      1. const ipfsApi = require(“ipfs-api”); //匯入IPFS
      2. const ipfs = ipfsApi({host:’localhost’, port:’5001’, protocol:’http’}); // 配置網路
    7. 上傳字串到IPFS中的Promise函式
    8. 測試
    9. 跨域資源共享的CORS配置 
      1. ipfs config –json API.HTTPHeaders.Access-Control-Allow-Methods ‘[“PUT”,”GET”,”POST”,”OPTIONS”]’
      2. ipfs config –json API.HTTPHeaders.Access-Control-Allow-Origin ‘[“*”]’
      3. ipfs config –json API.HTTPHeaders.Access-Control-Allow-Credentials ‘[“true”]’
      4. ipfs config –json API.HTTPHeaders.Access-Control-Allow-Headers ‘[“Authorization”]’
      5. ipfs config –json API.HTTPHeaders.Access-Control-Expose-Headers ‘[“Location”]’
      6. 用正確的埠執行daemon 
        1. ipfs config Addresses.API
        2. ipfs config Addresses.API /ip4/127.0.0.1/tcp/5001
        3. ipfs daemon
      7. 測試
      8. 從IPFS讀取資料
  3. IPFS圖片上傳與下載 
    1. 建立React專案:create-react-app ipfs-http-pic
    2. cd ipfs-http-pic && npm start
    3. 安裝ipfs-api:npm install –save ipfs-api
    4. App.js匯入IPFS
    5. 實現上傳圖片到IPFS的Promise函式 
      6 上傳圖片到IPFS
  4. IPFS與Ethereum 
    1. truffle unbox react
    2. 安裝ipfs-api
    3. 修改前端邏輯
    4. 修改合約
    5. truffle develop
    6. ipfs daemon
    7. npm start

 

相關文章