基于IPFS去中心化相册以太坊Dapp_通过ipfs实现去中心化存储的dapp-CSDN博客

这篇博客介绍了如何利用IPFS和以太坊开发一个去中心化的相册Dapp。首先，讲解了如何安装和配置IPFS，包括启动服务器和设置CORS。接着，提到了需要的开发环境，如Truffle、Node.js和React。然后，详细阐述了项目结构，包括合约的编写和前端界面的调整。最后，指导读者进行本地测试，包括部署合约、启动前端和上传图片。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Dapp-IPFS-Image
基于IPFS去中心化相册以太坊Dapp

注意: 使用该 github 克隆到本地, 需要执行 $ npm install 安装依赖 node_modules

安装IPFS
官网(访问不了时,需要科学上网) https://ipfs.io
下载解压缩
$ tar xvfz go-ipfs_v0.4.10_darwin-amd64.tar.gz
$ cd go-ipfs
$ mv ipfs /usr/local/bin/ipfs

创建IPFS节点
$ ipfs init
$ cd ~/.ipfs

启动服务器
ipfs daemon

跨域资源共享 CORS配置
control + c 终止ipfs服务器进程

$ 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服务器
$ ipfs daemon
新建终端执行:
$ ipfs cat /ipfs/QmYwAPJzv5CZsnA625s3Xf2nemtYgPpHdWEz79ojWnPbdG/readme
打开http://localhost:5001/webui会看到UI界面

需要 truffle ,node.js ,npm ,react 环境安装参考之前环境配置文章

项目开发
新建项目文件夹
$ mkdir 项目名IPFS-Image
cd IPFS-Image

下载unbox react 框架
$ truffle unbox react

安装ipfs-api
$ npm install ipfs-api --save-dev

验证框架和环境:
编译合约
$ truffle compile

开启前端
$ npm start

看见项目页面, ok

修改项目框架代码:
Atom编辑器打开项目:
$ atom ./

编写智能合约
修改contracts/SimpleStorage.sol文件

pragma solidity ^0.4.19;

contract SimpleStorage {

string[] public photoArr;  //定义一个 装图片hash值的字符串数组

function storePhoto(string