IPFS实用指南

in #starnote4 years ago

用IPFS提供web服务,需要有两部分,一是服务器端开启daemon, 二是前端用js来访问服务器。这与一般的网站服务是一样的。所以,在此我分为服务器端和前端两部分来实现IPFS的服务。
-> 前往星空笔记

Sort:  

用IPFS提供web服务,需要有两部分,一是服务器端开启daemon, 二是前端用js来访问服务器。这与一般的网站服务是一样的。所以,在此我分为服务器端和前端两部分来实现IPFS的服务。

Loading...

IPFS的全称是InterPlanetary File System(星际文件系统),从名称上看,这是一个很炫酷、很有野心的项目。简单地说它就是一个点对点的分布式文件系统。官网和github都可以找到所有的相关资料。建议从它的白皮书,和直译中文版本开始了解,后面我们会慢慢地认识它。白皮书上指出了多个应用场景。

Loading...
//需要改动的地方
"Addresses": {
    "API": "/ip4/127.0.0.1/tcp/9000",
    "Announce": [],
    "Gateway": "/ip4/127.0.0.1/tcp/8080",
"StorageMax": "80GB"

//在控制台粘入以下6条命令
ipfs config Addresses.Gateway /ip4/127.0.0.1/tcp/8080  //访问接口
ipfs config Addresses.API /ip4/127.0.0.1/tcp/9000    //上传接口
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Methods '["PUT","GET", "POST", "OPTIONS"]'
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Origin '["*"]'
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Credentials '["true"]'
ipfs config --json API.HTTPHeaders.Access-Control-Allow-Headers '["Authorization"]'
ipfs config --json API.HTTPHeaders.Access-Control-Expose-Headers '["Location"]'

IPFS的公共网关还是蛮稀缺的,而且很多在国内是访问不了的,所以,只能多试下啰。

查询公共网关

https://ipfs.io/ipfs
https://ipfs.jeroendeneef.com/ipfs
https://na.siderus.io/ipfs/
https://ipfs.busy.org/ipfs
http://gateway.ipfs.io/ipfs
https://siderus.io/ipfs/
https://ipfs.jes.xxx/ipfs/
https://eu.siderus.io/ipfs/
https://na.siderus.io/ipfs/
https://ipfs.eternum.io/ipfs/
https://hardbin.com/ipfs/
https://gateway.temporal.cloud/ipfs/
https://jorropo.ovh/ipfs/
Loading...

前端使用vue环境,使用js-ipfs-http-client客户端来访问服务器,进行上传/查看文件(图片、视频等)。

服务器端开启daemon,设置访问端口,用于文件存储。

wget https://github.com/ipfs/go-ipfs/releases/download/v0.4.22/go-ipfs_v0.4.22_linux-amd64.tar.gz

tar -zxvf go-ipfs_v0.4.22_linux-amd64.tar.gz
cd go-ipfs
mv ipfs /usr/local/bin/ipfs
ipfs version
ipfs --help  

//初始化,/root/.ipfs
ipfs init

ipfs id     //自己的id
ipfs daemon //开启进程
Loading...
cnpm install ipfs-http-client --save 
//main.js
import ipfsClient from 'ipfs-http-client'
const ipfs = ipfsClient({ host: 'example.com', port: '9001', protocol: 'https' })

Vue.prototype.ipfs = ipfs  //挂载到全局
Loading...

和上传图片是一个函数,在细节上略有不同。

<b-form-file placeholder="上传mp4视频" browse-text="文件" v-model="file" class="mb-2" accept=".mp4" ></b-form-file>

//上传视频
let file = this.file
const reader = new FileReader()
reader.readAsArrayBuffer(file)
reader.onload = (event) => {
  that.ipfs.add({
    path: file.name,
    content: Buffer.from(event.target.result)},
  (error, added) => {
    if (error) {
        console.log(123, error)
    } else {
        //上传成功
        that.addNew = true
        let body = added[0].hash
        console.log(234, body)
    }
  })
}

不明觉厉的围观

@lemooljiang, one of your Steem friends wish you a Happy Valentine's day and asked me to give you a new badge!

To find out who wanted you to receive this special gift, click here!

You can view your badges on your Steem Board and compare to others on the Steem Ranking

Do not miss the last post from @steemitboard:

Valentine's day challenge - Give a badge to your beloved!

好久不见小蒋了,忙大事业了?

来自于 [WhereIn Android] (http://www.wherein.io)