使用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图片。如果你有任何疑问或建议,欢迎在评论区留言讨论🌹

相关推荐
AIMercs3 小时前
零知识证明
区块链·零知识证明
好学且牛逼的马4 小时前
学习随想录-- web3学习入门计划
区块链
青云交16 小时前
Java 大视界 -- 基于 Java 的大数据分布式存储在工业互联网数据管理与边缘计算协同中的创新实践(364)
java·大数据·边缘计算·工业互联网·分布式存储·paxos·数据协同
太阳上的雨天19 小时前
与 TRON (波场) 区块链进行交互的命令行工具 (CLI): tstroncli
typescript·区块链·交互·tron·trx·trc20
dingzd9520 小时前
通过 Web3 区块链安全评估,领先应对网络威胁
安全·web3·区块链·facebook·tiktok·instagram·clonbrowser
MicroTech20251 天前
微算法科技(NASDAQ:MLGO)采用分布式哈希表优化区块链索引结构,提高区块链检索效率
区块链
Black_mario1 天前
Solo:基于 zkHE 的身份验证协议,构建 Web3 可信匿名身份层
web3
运维开发王义杰2 天前
Ethereum:轻松获取智能合约ABI,测试网实践指南
区块链·智能合约
运维开发王义杰2 天前
Ethereum: 区块链浏览器,我们的“天眼”
web3·区块链·智能合约
追梦人物2 天前
Uniswap 流动性机制及相关数学原理分析
区块链