ipfs-api访问IPFS(星际文件系统)

时间 2019-12-05

标签 ipfs api 访问星际文件系统繁體版

原文原文链接

经过node.js和ipfs-api咱们能够访问IPFS(星际文件系统)。html

2、ipfs-api安装与使用

星际文件系统Ipfs节点提供和REST API接口，可供咱们在程序代码中操做节点进行文件的上传等操做。不过大多数状况下，咱们并不须要直接操做这个REST开发接口，而是使用通过封装的更友好的ipfs-api，一个nodejs包。前端

2.1安装nodejs

到官网下载nodejs安装包：32位，64位。下载后双击进行安装便可。node

开一个控制台窗口，测试：python

C:\Users\hubwiz> node -v
V8.11.1

2.2安装ipfs-api

Ipfs-api的安装须要git命令行，所以咱们先安装git。从官网下载git安装包：32位，64位。下载后双击安装便可。linux

执行git命令测试：webpack

D:\test-ipfs-api> git version
git version 2.16.2.windows.1

ipfs-api须要编译原生node模块，所以须要安装VisualStudio 2015和python27。git

官网下载VisualStudio 2015社区版，双击安装便可。官网下载Python27安装包，双击安装并设置PATH环境变量使python可用。github

从新开一个控制台，使环境变量生效。如今安装ipfs-api：web

D:\test-ipfs-api> npm install ipfs-api
+ ipfs-api@20.0.1
added 1 package, updated 1 package and moved 1 package in 22.138s

2.3测试代码 – nodejs

在D:\test-ipfs-api目录下建立一个测试脚本test.js：npm

const ipfsAPI = require('ipfs-api')
const ipfs = ipfsAPI('localhost', '5001', {protocol: 'http'})
const buffer = Buffer.from('this is a demo')
ipfs.add(buffer)
    .then( rsp => console.log(rsp[0].hash))
.catch(err => console.error(err))

执行这个脚本：

D:\test-ipfs-api> node test.js
QmfQS4vm9YZTAyGZEkDqm81xripwsK3NgqfNkbCdoeEw5i

也就是说，咱们将内容this is a demo添加到本地仓库后，获得哈希值 QmfQS4vm9YZTAyGZEkDqm81xripwsK3NgqfNkbCdoeEw5i。如今可使用cat子命令来查看这个哈希值对应的内容：

D:\test-ipfs-api> ipfs cat QmfQS4vm9YZTAyGZEkDqm81xripwsK3NgqfNkbCdoeEw5i

控制台会输出咱们以前上传的内容：

this is a demo

ipfs进入监听状态后，提供了一个http网关，让咱们可使用浏览器来访问ipfs上的内容。网关默认在本机（127.0.0.1）的8080端口监听，所以使用你的浏览器访问这个URL：

http://127.0.0.1:8080/ipfs/QmfQS4vm9YZTAyGZEkDqm81xripwsK3NgqfNkbCdoeEw5i

一样能够看到咱们以前上传的内容。注意：须要首先启动监听器（ipfs daemon）而且你的浏览器和ipfs节点在同一台计算机。 ?

3、在浏览器中访问ipfs

ipfs-api也支持在browser使用。最简单的方法是使用专门针对浏览器的封装库，在html中引用便可：

<script src="https://unpkg.com/ipfs-api/dist/index.js"></script>

这个特别封装的库会建立一个全局对象ipfsAPI，咱们在浏览器脚本中能够直接使用，例如：

var ipfs = window.IpfsApi('localhost', '5001')

这种方法比较简单，所以下文再也不描述。接下来咱们将使用更加工程化的方法，采用webpack来直接在前端脚本中使用ipfs-api的nodejs包。

3.1 HTML页面

在D:\test-ipfs-api目录下建立index.html：

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <textarea id="content">THIS IS ANOTHER DEMO</textarea>
  <button id="upload">Upload</button>
  <script src="./bundle.js"></script>
</body>
</html>

咱们的目标是，当点击按钮时，咱们将文本框的内容上传到ipfs

3.2前端脚本

在D:\test-ipfs-api目录下编写脚本app.js：

import ipfsAPI from 'ipfs-api'
const ipfs = ipfsAPI('localhost', '5001', {protocol: 'http'})

window.addEventListener('load', function() {
  let btn = document.querySelector('#upload')
let txt = document.querySelector('#content')
btn.addEventListener('click',()=>{
    let buffer = Buffer.from(txt.value, 'utf-8');
    ipfs.add(buffer)
      .then( rsp => console.log(rsp[0].hash))
.catch(err => console.error(err))
})  
})

3.3 webpack配置

在D:\test-ipfs-api目录下编写配置文件webpack.config.js：

const webpack = require('webpack');
const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
  entry: './app.js',
  output: {
    path: path.resolve(__dirname),
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015'],
          plugins: ['transform-runtime']
        }
      }
    ]
  }
}

3.4前端脚本打包

执行webpack打包：

D:\test-ipfs-api> webpack

3.5 配置ipfs的CORS策略

因为须要从网页中访问ipfs节点，这就引入了跨域安全问题，所以咱们须要配置ipfs节点使其容许跨域请求：

D:\>ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin '["*"]'

3.6 配置ipfs的API监听地址

因为ipfs节点默认在本机（127.0.0.1）的5001端口监听API请求，所以若是你的浏览器和ipfs节点不在同一台机器上，须要让ipfs节点监听公开地址：

D:\> ipfs config --json Addresses.API '"/ip4/0.0.0.0/tcp/5001"'

固然，若是你的浏览器和ipfs节点在同一台机器上，就不须要进行这个配置了。

3.7配置ipfs的网关的监听地址

因为ipfs节点旳http网关默认在本机（127.0.0.1）的8080端口监听http请求，所以若是你的浏览器和ipfs节点不在同一台机器上，就须要让ipfs网关监听公开地址：

D:\> ipfs config --json Addresses.Gateway '"/ip4/0.0.0.0/tcp/8080"'

3.8测试网页

首先启动ipfs监听：

D:\>ipfs daemon

而后在测试目录下启动web服务器，这里使用python内置的简单服务器，固然你可使用任何熟悉的web服务器：

D:\test-ipfs-api> python –m SimpleHTTPServer
Serving HTTP on 0.0.0.0 port 8000 ...

如今打开你的浏览器，访问http://127.0.0.1:8000/，一切顺利的话，你能够看到一个文本框和一个按钮，点击按钮，便可将文本框的内容上传到ipfs节点。

推荐两个以太坊相关的实战教程：

区块链初学者：以太坊 DApp 实战开发入门
区块链开发进阶：去中心化以太坊 DApp 电商平台实战开发