【WEB3】区块链开发入门项目之「简易NFT交易市场」

最新推荐文章于 2023-12-03 23:37:30 发布

豆子前端

最新推荐文章于 2023-12-03 23:37:30 发布

阅读量459

点赞数

文章标签： web3 区块链

本文链接：https://blog.csdn.net/qq_41996454/article/details/132858944

版权

参考文章

教程英文版：https://docs.alchemy.com/docs/how-to-build-an-nft-marketplace-from-scratch

教程中文版：https://zhuanlan.zhihu.com/p/557479922?utm_id=0

以太坊测试币领取：https://goerlifaucet.com/

入门项目地址：https://github.com/alchemyplatform/NFT-Marketplace-Tutorial

一些名词和平台简介

入门该项目之前，最好先了解一些相关平台和技术，有个大概的认知。

下面的内容一些是Copy谷歌上的，一些是GPT生成的，仅供参考。

Alchemy

Alchemy 是一个以太坊开发平台，提供了一系列工具和服务，帮助开发者更轻松地构建和管理以太坊应用程序。Alchemy 的主要功能如下：

以太坊节点管理：Alchemy 提供了一个可靠的高可用性以太坊节点，开发者可以使用它来连接以太坊网络，并获取实时区块数据和交易数据。
智能合约开发：Alchemy 提供了一个易于使用的智能合约开发工具，帮助开发者编写、部署和测试智能合约。
API 集成：Alchemy 提供了一组 API，使开发者能够轻松地将以太坊功能集成到他们的应用程序中。
交易分析和监控：Alchemy 提供了一套工具，帮助开发者分析和监控以太坊网络上的交易，包括交易量、交易费用、区块时间等等。
安全和隐私：Alchemy 提供了一系列安全和隐私功能，帮助开发者保护他们的应用程序免受攻击和数据泄露。

总之，Alchemy 提供了一系列工具和服务，帮助开发者更轻松地构建和管理以太坊应用程序。

MetaMask

MetaMask 是一款以太坊钱包浏览器插件，它可以用来管理以太坊和 ERC-20 标准代币。它可以让您在浏览器中访问以太坊网络，并与去中心化应用程序（DApp）进行交互，如去中心化交易所、去中心化金融应用、游戏等，而不需要暴露您的私钥。此外，MetaMask 还提供了高级功能，如 Gas 费设置、多账户支持、交易历史记录等。如果您在使用以太坊和去中心化应用程序，MetaMask 是一个非常有用的工具。

Pinata

Pinata 是一个 IPFS 文件托管平台，它提供了简单、安全、可靠的去中心化存储和分发服务。使用 Pinata，用户可以将文件上传到 IPFS 网络，并获得一个唯一的 CID（Content Identifier），以便在整个 IPFS 网络中找到和访问该文件。Pinata 还提供了一些有用的功能，如文件版本控制、自动备份、文件加密和解密、API 接口等等。使用 Pinata，用户可以方便地将文件存储在 IPFS 网络上，以实现去中心化的文件存储和分发。这对于需要存储大量数据或需要在去中心化应用程序中使用文件的用户来说非常有用。

IPFS

星际文件系统（InterPlanetary File System，缩写为 IPFS）是一个旨在实现文件的分布式存储、共享和持久话的网络传输协议。它是一个内容可寻址的点对点超媒体分发协议。在IPFS网络中的节点构成一个分布式文件系统。

IPFS采用去中心化的方式存储文件，文件被分发到全球各个节点，每个节点都可以存储和提供文件内容。当用户请求某个文件时，IPFS会根据文件的哈希值快速定位到存储该文件的节点，实现高效的文件传输。

IPFS具有以下特点：

去中心化：文件存储和传输不依赖于中心化的服务器，而是通过全球范围内的节点共同完成。
版本控制：IPFS使用内容寻址的方式来标识文件，每个文件的哈希值与其内容密切相关，因此可以实现文件的版本控制。
高可靠性：文件在IPFS网络中会被多个节点存储，当某个节点不可用时，可以从其他节点获取文件内容，提高了文件的可靠性。
高效传输：IPFS使用数据块的哈希值来标识文件，当多个文件具有相同的数据块时，可以实现数据的共享，减少了重复传输的问题。

总之，IPFS是一种新型的分布式文件系统，通过去中心化、内容寻址和多节点存储等技术，实现了高可靠性、高效性和去中心化的文件存储和传输。

IPFS在区块链开发中可以做什么

IPFS（InterPlanetary File System）是一种点对点的分布式文件存储系统，可以在区块链开发中实现以下功能：

分布式存储 - IPFS可以将文件分散在网络中的多个节点上存储，确保文件的安全性和可靠性。这在区块链应用程序中很有用，因为它可以将数据存储在多个节点上，从而减少数据丢失的风险。
链接数据 - IPFS使用哈希链接文件，这使得它可以轻松地链接和共享数据，从而使数据更易于在区块链应用程序中共享和使用。
去中心化网络 - IPFS是去中心化的网络，没有中心化的服务器，这使得它更难受到攻击和故障。这在区块链应用程序中很有用，因为它可以提高应用程序的可靠性和安全性。
加速数据传输 - IPFS使用内容寻址，可以加速数据传输并提高网络效率。这在区块链应用程序中很有用，因为它可以减少数据传输时间，提高应用程序的性能。

总之，IPFS可以在区块链开发中用于分布式存储、链接数据、去中心化网络和加速数据传输等方面，从而提高应用程序的可靠性、安全性、性能和效率。

NFT和IPFS之间的联系

NFT（Non-Fungible Token）是一种基于区块链的数字资产，通常用于代表独特的数字艺术品、游戏道具、收藏品等。而IPFS（InterPlanetary File System）是一种点对点的分布式文件存储系统，可以在区块链应用程序中用于存储和管理NFT资产。

具体来说，NFT通常包含对存储在IPFS上的数字资产的引用，这些数字资产可以是图像、音频、视频或其他类型的文件。因此，将NFT与IPFS结合使用可以实现以下功能：

分布式存储 - 将NFT资产存储在IPFS上可以将其分散在网络中的多个节点上存储，确保资产的安全性和可靠性。
去中心化 - 使用IPFS进行NFT资产管理可以实现去中心化的存储和管理，提高应用程序的可靠性和安全性。
链接数据 - NFT通常包含对存储在IPFS上的数字资产的引用，这使得它可以轻松地链接和共享数据，从而使数据更易于在区块链应用程序中共享和使用。

总之，NFT资产管理和IPFS之间有着密切的关系，使用IPFS可以实现分布式存储、去中心化和链接数据等功能，从而提高NFT资产的可靠性和安全性。

Alchemy、Pinata和MetaMask 三者是怎么联动的

Alchemy、Pinata 和 MetaMask 可以一起使用来构建和管理以太坊应用程序，具体的联动方式如下：

Alchemy 可以提供一个高可用性的以太坊节点，供开发者在 MetaMask 中使用。开发者可以在 MetaMask 中添加自定义网络，输入 Alchemy 提供的节点 URL，以连接到 Alchemy 的以太坊节点。
Pinata 提供了一个 IPFS 存储服务，开发者可以将文件上传到 Pinata，然后通过 Alchemy 提供的 API 将文件的哈希值存储到以太坊上。开发者可以使用 MetaMask 来授权这些交易，并跟踪交易状态。
MetaMask 可以通过 Alchemy 提供的 API 来与以太坊网络进行交互，包括查询账户余额、发送交易、调用智能合约等操作。开发者可以使用 MetaMask 来管理以太坊账户，以便与 Alchemy 和 Pinata 进行交互。

总之，Alchemy、Pinata 和 MetaMask 可以一起使用来构建和管理以太坊应用程序，通过 API 和网络连接来实现联动。这三个工具提供了不同的功能和服务，可以共同帮助开发者更轻松地构建和管理以太坊应用程序。

MetaMask连接Alchemy

要将MetaMask连接到Alchemy节点，您需要按照以下步骤操作：

在浏览器中打开MetaMask钱包，确保您已登录您的钱包。
点击MetaMask的网络切换按钮，选择“Custom RPC”自定义网络。
在“New Network”页面中，输入以下信息：

Network Name: 任意名称，如“Alchemy Mainnet”。
New RPC URL: Alchemy提供的节点URL，例如：https://eth-mainnet.alchemyapi.io/v2/YOUR-API-KEY。
Chain ID: Alchemy节点的Chain ID，例如1表示以太坊主网。
Symbol: 代币符号，例如ETH。
Block Explorer URL: 区块链浏览器的URL，例如https://etherscan.io/。

点击“Save”按钮保存设置，然后返回MetaMask的主页面。
点击MetaMask的网络切换按钮，选择刚刚新增的Alchemy网络，您现在应该已经成功连接到Alchemy节点了。

需要注意的是，为了能够连接到Alchemy节点，您需要在Alchemy上注册一个账户并获取API密钥。您可以在Alchemy的控制台中创建一个项目，并在项目设置中找到API密钥。确保您已经启用了与所使用的Alchemy节点相对应的API密钥。

NFT

NFT是“Non-Fungible Token”的缩写，中文翻译为“非同质化代币”，是一种基于区块链技术的数字资产。与传统的加密货币不同，NFT每个都是独一无二的，不可替代的数字资产，它们可以代表数字艺术品、虚拟房地产、游戏物品、音乐等数字内容。NFT使用智能合约技术，确保每个NFT的唯一性、拥有权和交易历史可追溯。NFT市场的兴起，为数字内容创造者提供了新的收入来源，同时也为数字内容爱好者提供了新的收藏方式。

创建NFT市场大致过程

选择区块链平台：有几个区块链平台支持NFT，例如Ethereum、Binance Smart Chain和Flow。选择最符合您要求的平台。

创建智能合约：编写定义NFT结构和所有权的智能合约。该合约将部署在区块链平台上。

创建前端：为您的市场开发一个前端，用户可以查看和购买NFT。您可以使用React或Angular等框架来构建您的前端。

集成钱包：集成MetaMask等钱包，允许用户购买、出售和持有NFT。

创建数据库：设置数据库以存储有关NFT及其所有者的信息。

开发付款系统：集成付款系统，允许用户购买和出售NFT。您可以使用Ether等加密货币或USDT等稳定币进行交易。

启动市场：部署智能合约和前端到区块链平台上，并启动您的NFT市场。

请记住，这只是NFT市场的基本框架。您可能需要根据您的具体要求进行自定义。

使用Goerli龙头来申请Goerli ETH（白嫖ETH）

https://zhuanlan.zhihu.com/p/557479922?utm_id=0

ABI

在以太坊区块链上，ABI（Application Binary Interface）是用于描述智能合约函数的接口的一种标准格式。要获取一个智能合约的ABI，可以按照以下步骤操作：

打开以太坊区块链浏览器（如Etherscan、BscScan、PolygonScan等）。
在搜索框中输入智能合约的地址，然后按下回车键。
打开智能合约的页面，找到“Contract”或“Contract Source Code”部分。在这一部分中，通常会提供智能合约的ABI，可以通过点击“View Contract ABI”或类似的按钮来查看。
如果ABI没有提供，则可以在“Contract Source Code”部分中查找智能合约的源代码，并手动编写ABI。

另外，如果您已经有智能合约的源代码，可以使用Solidity编译器来生成ABI。在Solidity编译器中，选择智能合约的源文件，然后点击“Compile”按钮。在编译完成后，可以在输出中找到智能合约的ABI。

一般的，我使用remix编译合约并获取之。

开发大致过程

这里只列出大致的步骤，详情请查阅参考文章中的教程

1、注册一个Alchemy账户并创建一个新的应用程序

2、注册MetaMask，记钱包私钥为PRIVATE_KEY

3、使用Goerli龙头来申请Goerli ETH，获取一点Goerli测试网的ETH（0.03就行）

建议用这个网站：https://goerli-faucet.pk910.de/

更多网站：https://zhuanlan.zhihu.com/p/618154628

4、注册Alchemy，创建一个区块链应用APP，记该APP的API地址为ALCHEMY_API_URL

5、使用remix开发、编译合约，然后，开始部署合约，并「保存合约地址和ABI」

（remix比用自己的命令行、脚本啥的省事多了）

注意：部署的时候会花费一点点虚拟币，这里是从哪个钱包扣钱，哪个钱包地址就是这个部署上去的合约的创造者（Creator）。

合约地址：部署成功后，会在控制台打印合约地址的，例如「0x2a54C4D62d40D6750B24601F9C79107D3192Bedf」

ABI：可以在编译后的contracts文件夹中的NFTMarketplace_metadata.json文件中的output的abi获取之。

然后就可以在https://goerli.etherscan.io/address/0x2a54c4d62d40d6750b24601f9c79107d3192bedf看到合约信息了。

remix地址：https://remix.ethereum.org/#lang=en&optimize=true

使用remix部署合约教程：https://docs.moonbeam.network/cn/builders/build/eth-api/dev-env/remix/

截屏2023-09-12 下午5.20.34.png

6、在本地代码里，把上面的相关配置配了。

.env大致结构如下，记得替换为自己的

REACT_APP_ALCHEMY_API_URL="https://eth-goerli.g.alchemy.com/v2/xxxxxxxxxxxxxx"

# metamask钱包秘钥
REACT_APP_PRIVATE_KEY="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

# Pinata配置
REACT_APP_PINATA_KEY="xxxxxxxxxxxxxxxxxxx"
REACT_APP_PINATA_SECRET="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"

Marketplace.json大致结构如下

{
  "address": "0x2a54c4d62d40d6750b24601f9c79107d3192bedf",
  "abi": [...]
   
}

7、跟着官方教程完善代码

8、完成项目，并进行测试

查看自己的账户余额，发布NFT商品，然后购买。在pinata查看发布的NFT数据有没有被存进来，在MetaMask或者Goerli查看自己部署的合约以及每一笔交易记录的详情

goerli.etherscan.io是以太坊测试网络Goerli的区块链浏览网站。它提供了对在Goerli网络上发生的交易、合约和地址的实时查看和跟踪，同时也可以查看区块链的状态和统计数据。

例如我完成的项目的操作可以在这里查阅得到，说明上链成功。

https://goerli.etherscan.io/tx/0x6d37aafb2947ae03076c0bc774921ec419e972a1b25a70671058e5386aec67a3

https://goerli.etherscan.io/token/0x2a54c4d62d40d6750b24601f9c79107d3192bedf