使用Pinata在IPFS上存储NFT图片的实践


文章目录

  • 前言
  • 一、什么是IPFS?
  • 二、为什么NFT需要IPFS?
  • [三、 Pinata:IPFS上的存储解决方案](#三、 Pinata:IPFS上的存储解决方案)
  • [四、 实践:使用Pinata存储NFT图片](#四、 实践:使用Pinata存储NFT图片)
    • [1. 注册](#1. 注册)
    • [2. 获取API密钥与网关](#2. 获取API密钥与网关)
    • [3. 上传图片到IPFS](#3. 上传图片到IPFS)
  • 总结

前言

随着区块链技术的快速发展,NFT(非同质化代币)在数字艺术、游戏和收藏品等领域变得越来越流行。一个关键的问题是如何安全、高效地存储这些NFT的元数据和图片。IPFS(InterPlanetary File System,星际文件系统)提供了一种分布式存储解决方案,能够有效解决这一问题。本文将介绍IPFS及其在NFT存储中的应用,并具体讲解如何使用Pinata平台🚪在IPFS上存储图片。


一、什么是IPFS?

IPFS是一种分布式文件存储和共享系统,旨在创建一个更快、更安全、更开放的互联网。它通过内容寻址的方式,使文件可以永久存储,并且不依赖于某个特定的服务器。IPFS的关键特点包括:

  1. 分布式存储:IPFS采用P2P网络结构,文件存储在多个节点上,提高了数据的可靠性和抗审查能力。
  2. 内容寻址:文件在上传到IPFS时会生成一个唯一的加密哈希值,通过这个哈希值可以直接找到并访问该文件。
  3. 去中心化:IPFS去除了中心化服务器的需求,文件可以分布在全球各地的不同节点上,避免了单点故障。

二、为什么NFT需要IPFS?

在区块链上存储NFT时,通常只存储一个唯一的标识符和少量数据,而更详细的元数据(如图片、音频、视频等)存储在IPFS上。原因如下:

  1. 成本效益:区块链上的存储成本非常高,而IPFS提供了一种更经济的存储方式。
  2. 数据完整性:IPFS通过内容寻址确保文件的不可变性和完整性,任何对文件内容的修改都会生成一个新的哈希值,保证数据的原始性。
  3. 抗审查和可靠性:IPFS的分布式存储方式避免了中心化服务器的单点故障和审查问题。

三、 Pinata:IPFS上的存储解决方案

Pinata是一个易于使用的IPFS文件管理平台,提供了强大的API接口,使得在IPFS上上传和管理文件变得更加简单和高效。Pinata的主要功能包括:

  1. 文件上传和管理:通过Pinata可以方便地将文件上传到IPFS,并管理这些文件。
  2. API支持:Pinata提供了丰富的API接口,方便开发者在应用中集成IPFS存储功能。
  3. 可靠的网关服务:Pinata提供了稳定的IPFS网关服务,确保文件可以快速、可靠地被访问。

四、 实践:使用Pinata存储NFT图片

下面我们具体讲解如何使用Pinata在IPFS上存储NFT图片。

1. 注册

首先,在Pinata官网🚪注册一个账户,并获取API密钥,红框为注册按钮

用电脑注册的时候,最好是直接在你的电脑里再开一个页面为你的邮箱页面去接收验证码,用手机接收验证码的话,可能会跳转失败(亲身经历😥)

2. 获取API密钥与网关

接收完验证码就直接会跳转进入到个人主页了,进入"API Keys"页面,创建一个新的API密钥Generate API Key就可以了

输入你想给这个API密钥的命名,勾选上admin,其它的选项留待以后去研究,然后直接Generate API Key就可以了

随后会出先三个信息,注意保管好前面两个,之后要用到的

再进入到Gateways页面获取网关,网关是用来访问存储ipfs图片要用到的,要访问存储的ipfs就是https://你的网关/ipfs/存储图片得到的cid,例如我的网关是这个aqua-famous-koala-370.mypinata.cloud,那么我访问图片就是通过https://aqua-famous-koala-370.mypinata.cloud/ipfs/xxx

3. 上传图片到IPFS

通过简单的POST请求即可实现上传IPFS,首先需要刚才获得的API KeyAPI Secret,请求URL路径是https://api.pinata.cloud/pinning/pinFileToIPFS,并且请求头为pinata_api_keypinata_secret_api_key,请求体为要上传的图片或者文档

最后POST请求返回的结果里会包含IpfsHash也就是要获得的cid

以下为实现简单实现IPFS上传的一个完整核心代码,其中要替换为你自己的API密钥以及网关

html 复制代码
<!-- test.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Upload to Pinata</title>
</head>
<body>
    <h1>Upload File to Pinata</h1>
    <form id="uploadForm">
        <input type="file" id="fileInput" required>
        <button type="submit">Upload</button>
    </form>
    <div id="result"></div>

    <script src="script.js"></script>
</body>
</html>
javascript 复制代码
// script.js
    document.getElementById('uploadForm').addEventListener('submit', async (event) => {
        event.preventDefault();
        const fileInput = document.getElementById('fileInput');
        const file = fileInput.files[0];
    
        if (!file) {
            alert('Please select a file.');
            return;
        }
    
        // Create a FormData object and append the file
        const formData = new FormData();
        formData.append('file', file);
    
        // Pinata API credentials (replace with your actual API key and secret)
        const pinataApiKey = '自己的apikey';
        const pinataSecretApiKey = '自己的secret';
    
        try {
            const response = await fetch('https://api.pinata.cloud/pinning/pinFileToIPFS', {
                method: 'POST',
                headers: {
                    'pinata_api_key': pinataApiKey,
                    'pinata_secret_api_key': pinataSecretApiKey
                },
                body: formData
            });
    
            if (!response.ok) {
                throw new Error(`Error: ${response.statusText}`);
            }
    
            const data = await response.json();
            const cid = data.IpfsHash;
    
            // Display the result
            const resultDiv = document.getElementById('result');
            resultDiv.innerHTML = `
                <p>File uploaded successfully!</p>
                <p>CID: ${cid}</p>
                <p><a href="https://自己的网关/ipfs/${cid}" target="_blank">View File</a></p>
                <p><a href="https://自己的网关/ipfs/${cid}" download>Download File</a></p>
            `;
        } catch (error) {
            console.error('Error uploading file:', error);
            alert('Error uploading file. Please try again.');
        }
    });

打开页面可以上传一份图片

点击View File即可查看上传的文件是什么

如果想要在区块链中加入这个IPFS,只需要在智能合约中定义一个string类型的字符串,也就是直接将cid给存入到智能合约中,这样访问的时候直接在网关后拼接存储的cid,大大减少了文件上链的费用,同时保持了数据的完整性和可访问性


总结

通过本文,我们详细介绍了IPFS及其在NFT存储中的重要性,并通过具体示例演示了如何使用Pinata平台在IPFS上存储图片。从注册账户、获取API密钥到实际上传文件,我们逐步讲解了每一个关键步骤。IPFS提供了去中心化、内容寻址和分布式存储的优势,使得NFT元数据和图片存储更加安全和高效。希望这篇文章能帮助你更好地理解和使用IPFS来存储NFT图片。如果你有任何疑问或建议,欢迎在评论区留言讨论🌹

相关推荐
yoona10207 小时前
在 Sepolia 上使用 Zama fhEVM 构建隐私代币与流动性池:全流程实战指南
区块链·隐私币·zama
选择不变7 小时前
日线周线MACD指标使用图文教程,通达信指标
大数据·区块链·通达信指标公式·炒股技巧·短线指标·炒股指标
链上Sniper8 小时前
智能合约状态快照技术:实现 EVM 状态的快速同步与回滚
java·大数据·linux·运维·web3·区块链·智能合约
FreeBuf_16 小时前
朝鲜APT组织使用Nim语言恶意软件对macOS发起隐秘Web3与加密货币攻击
macos·web3·策略模式
TechubNews16 小时前
稳定币发行量创纪录地超过 Visa 交易量
区块链
dingzd951 天前
结合指纹防护技术,释放Web3去中心化的潜力
web3·去中心化·区块链·facebook·tiktok·instagram·clonbrowser
OEC小胖胖1 天前
去中心化身份:2025年Web3身份验证系统开发实践
前端·web3·去中心化·区块链
CertiK1 天前
IBW 2025: CertiK首席商务官出席,探讨AI与Web3融合带来的安全挑战
人工智能·安全·web3
长安链开源社区10 天前
长安链浏览器「数据看板」 高效洞察数据状态与趋势
web3·区块链·共识算法
MicroTech202510 天前
微算法科技(NASDAQ:MLGO)研发可信共识算法TCA,解决区块链微服务中的数据一致性与安全挑战
运维·算法·区块链·共识算法