ATA:NFT 教程 - 如何展示 Flow 和 IPFS 上的 NFT 收藏品_Databroker

译文出自：登链翻译计划

译者：翻译小组

校对：Tiny熊

本文是NFT教程的的第二部分，本教程主要介绍Flow区块链、NFT和IPFS。请先阅读第一部分NFT教程-用Flow和IPFS创建NFT。

在本文中，我们将构建一个简单的React应用程序，该应用程序与Flow智能合约交互，以验证和获取用户拥有的NFT。然后，我们将解析NFT的元数据，以获得NFT的底层标的资产的IPFS位置。提醒一下我们正在打造的NFT，就像NBATopShot一样，只不过是不同的视频内容。

项目设置

本教程中，你需要运行Flow模拟器。如果你不记得如何启动，可以看看之前的文章或者查看FlowCLI文档。需要注意的是，Flow模拟器是Flow区块链在内存的模拟。所以，如果关闭了模拟器，你需要继续做以下工作：

启动Flow模拟器

部署项目

数据：本周初特朗普NFT系列日销售额暴涨近800%:1月20日消息，CryptoSlam数据显示，从周二到周三，美国前总统特朗普发行的首个NFT系列“Donald Trump Digital Trading Card”的日销售额增长了近800%，从周二的约3.4万美元跃升至昨天的30.6万美元以上。截至发稿，该系列24小时销售额约为16.7万美元，跌幅达62.1%。然而今天上午，其24小时交易量一度上涨1900%。

虽然交易活动突然激增没有具体原因，但Twitter上的一些加密人士认为，需求的增长与一篇报道有关，即特朗普计划回归主流社交媒体网络。他此前因煽动1月6日对美国国会大厦的袭击而被Facebook和Twitter封禁。（Decrypt）[2023/1/20 11:23:19]

铸造你的NFT

在本教程第一部分NFT教程-用Flow和IPFS创建NFT详细介绍了其中的每一个步骤。

此外，还需要在你的机器上安装NodeJS。你可以在这里安装。

香港证监会：支持元宇宙、NFT、GameFi创新，积极探索适当的代币化资产监管框架:金色财经报道，CrossSpace创始人0xLeon发推称，在香港金融科技周活动中，香港证券及期货事务监察委员会（SFC）副行政总裁兼中介机构部执行董事梁凤仪表示，SFC因为从2018年采取了严谨的监管架构，避免了很多负面事件在香港发生，但SFC会支持创新与发展，尤其在元宇宙、NFT（艺术）、GameFi方面，香港要明确的支持，香港也在积极探索适当的代币化资产监管框架。

最初SFC觉得行业很不成熟所以限定只有专业投资者可以交易虚拟资产。4年过去了，投资者有了更多的知识和经验。整个生态也更成熟，很多国际金融机构都已经进入这个生态。监管也更有经验去监管交易所和其他相关机构。所以是时间去review是否可以逐渐向个人投资者开放。

据此前报道，香港特区政府发表虚拟资产政策宣言。香港证券及期货事务监察委员会将会就新发牌制度下零售投资者可买卖虚拟资产的适当程度展开公众谘询。对于可否在香港引入虚拟资产交易所买卖基金（ETF），政府抱持欢迎态度。政府对于日后检讨代币化资产的产权和智能合约的合法性，抱持开放态度，以便利其在香港的发展。香港金融管理局稍后会就稳定币的监管制度发布谘询结果和下一步工作。[2022/10/31 12:00:50]

和之前一样，你需要一个文本编辑器。

CryptoPunks系列NFT 24小时交易额增长超38,000%:金色财经报道，OpenSea最新数据显示，CryptoPunks系列NFT过去24小时的交易额为385ETH，增长率为38,528%。24小时交易额排名位列OpenSea第四。[2022/10/4 18:39:07]

初始化React和安装依赖

在第一部分教程中创建的pinata-party项目目录下创建React应用。

要创建我们的应用程序，运行以下命令：

npxcreate-react-apppinata-party-frontend

当一切安装完成后，你会有一个新的目录，叫做pinata-party-frontend，切换到该目录，安装依赖。

首先，参考Flow文档，需要安装FlowJSSDK。前端的设置我们只需要按照Flow的文档进行即可：

npmi;exportdefaultTokenData;//rawTokenData

ABC系列NFT 24小时交易额达6.6万SOL，位列OpenSea榜首:金色财经报道，ABC（abracadabra）系列NFT 24小时交易额达6.6万SOL，增幅242%。24小时交易额排名位列OpenSea榜首。[2022/9/8 13:15:30]

button{padding:10;height:30px;min-width:100px;cursor:pointer;}

现在，只要将新组件添加到App

exportdefaultApp;

运行应用程序并尝试获取代币数据，它应该是这样：

这真是太酷了！我们正在查找指定的账户所拥有的NFT，然后从该代币中获取元数据。并显示该元数据，我们知道该元数据中的一个值解析为一个视频文件。让我们把它显示出来。

从IPFS获取媒体文件

你已经注册了一个Pinata账户，并通过Pinata上传界面将你的视频文件添加到IPFS。这意味着你已经可以从IPFS中获取内容了。在PinExplorer中，当你点击一个哈希值时，你会被带到PinataIPFS网关，在那里你的IPFS内容被解析并显示。为了教程更通用，我们还是从ProtocolLabs网关中获取它。

阿尔法·罗密欧将利用 NFT 记录最新的混合动力车辆数据:2月9日消息，著名意大利豪车制造商阿尔法·罗密欧将使用 NFT 在其新的 Tonale SUV 的区块链上跟踪和存储维护记录。该公司表示，汽车的 NFT 将能够从其维护数据记录中生成证书，但仅限于经过认证的经销商提供的服务。

据悉，阿尔法·罗密欧似乎是第一家以这种方式利用 NFT 的汽车制造商，为了给经常依赖第三方跟踪汽车记录的汽车市场带来透明度和效率。[2022/2/9 9:39:53]

回到TokenData

p>);};exportdefaultTokenData;//rawTokenData.js

我们已经添加了一个video标签，它指向IPFS上的文件。你会注意到，这里拆分了uri值，以获得IPFS哈希值，这样就可以从IPFS网关获取对应内容。先介绍下那个URI。

我们用NFT创建的uri看起来像ipfs://Qm...。我们之所以这样创建，是因为IPFS桌面客户端默认允许你点击并打开这样的链接。另外，Brave浏览器也支持粘贴这样的链接。并且我们认为这种链接形式会随着IPFS的发展得到越来越多的支持。

然而，在这里下，我们需要在利用哈希来从IPFS公共网关获取内容，并在页面上显示。因此链接会是这样：

https://ipfs.io/ipfs/QmRZdc3mAMXpv6Akz9Ekp1y4vDSjazTx2dCQRkxVy1yUj6

现在，如果你访问我们的应用程序中获取代币数据，会看到如下界面：

这是一个真正的活的数字资产!你的视频可能会有所不同，但希望你在应用中感受到相同的体验。

最后

这是一个非常简单的应用，你可以做很多事情让它变得更漂亮，让它的交互性更强，甚至可以为它添加更多的Flow元素。FlowJSSDK的功能很强大，所以我推荐大家阅读一下文档。

在第二部分成功地使用Flow为应用添加了身份验证，创建了一个接口来获取NFT的信息，创建了一种方法来显示了原始元数据以及对应的底层标的资产。这一切都由Flow区块链和IPFS来保障。我们知道NFT是由谁拥有，也知道显示的内容是有效性，因为哈希值被编码到NFT中。

在本教程的最后一篇，我们将专注于创建一个迷你交易市场，让我们转移NFT。

本翻译由CellNetwork赞助支持。

来源：https://medium.com/pinata/how-to-display-your-nft-collection-like-nba-top-shot-with-flow-and-ipfs-6ba75048bf8a

参考资料

登链翻译计划:https://github.com/lbc-team/Pioneer

翻译小组:https://learnblockchain.cn/people/412

Tiny熊:https://learnblockchain.cn/people/15

NFT教程-用Flow和IPFS创建NFT:https://learnblockchain.cn/article/2271

NFT教程-用Flow和IPFS创建NFT:https://learnblockchain.cn/article/2271

这里安装:https://nodejs.org/en/

Flow文档:https://docs.onflow.org/flow-js-sdk/flow-app-quickstart

第一篇文章:https://learnblockchain.cn/article/2271

Pinata:https://pinata.cloud/

PinExplorer:https://pinata.cloud/pinexplorer

CellNetwork:https://www.cellnetwork.io/?utm_souce=learnblockchain

免责声明：作为区块链信息平台，本站所发布文章仅代表作者个人观点，与链闻ChainNews立场无关。文章内的信息、意见等均仅供参考，并非作为或被视为实际投资建议。

本文来源于非小号媒体平台：

登链社区

现已在非小号资讯平台发布105篇作品，

非小号开放平台欢迎币圈作者入驻

入驻指南：

/apply_guide/

本文网址：

/news/9781311.html

免责声明：

1.资讯内容不构成投资建议，投资者应独立决策并自行承担风险

2.本文版权归属原作所有，仅代表作者本人观点，不代表非小号的观点或立场

上一篇：

盘点零知识证明代表性项目：如何影响和塑造区块链生态系统？

标签：FLOWFLONFTATAflow币怎么样MINIFLOKIsnft币西班牙Databroker

瑞波币热门资讯