继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

StashIt:游戏资产存储枢纽 | Pinata 🪅 提供支持的 IPFS SDK

慕后森
关注TA
已关注
手记 221
粉丝 57
获赞 235

这是提交给Pina塔挑战赛的作品。

我们建立的项目是什么呢?

我们开发了StashIt,这是一款游戏资产存储的 web 应用程序,利用了 Next.js、TailwindCSS 和 Pinata 的力量,。它安全地存储各种类型的游戏资产,如图像、音频、视频和 3D 模型,通过 IPFS 网络进行。每个文件都有 Pinata 提供的 CID 唯一标识,确保不会出现重复的资产。该平台还包括利用 OpenRouter API 自动生成角色背景故事的 AI 功能。此外,用户可以为其文件添加元数据,以便更好地管理资产。

演示

访问项目,点击这里!

首页

落地页

我的项目主页

我的项目面板

查看资产

探索资源

文件预览:查看您的文件内容。

文件预览图 (点击可查看大图)

AI角色生成器

AI 角色背景生成器

登录页面

认证页面

单文件上传功能

单文件

关键礼品袋特点

  1. IPFS 存储服务 :
  • 我们使用Pinata的IPFS服务来安全地存储和检索游戏资产。上传到Pinata的文件是去中心化的,这提供了资产存储的持久性和可靠性保障,确保了资产的安全性和易访问性。
for (const [key, value] of formData.entries()) {
    if (key.startsWith("file") && value instanceof File) {
      try {
        const upload = await pinata.upload
          .file(value)
          .group(groupId)
          .addMetadata({
            name: name,
            keyValues: {
              description: description || '',
            },
          });
        successCount++;
      } catch (error) {
        console.error(`上传文件 ${key} 时发生错误:`, error);
        errors.push(`未能成功上传 ${value.name}`);
      }
    }
}
  1. 独特的CID管理
  • 每个上传资产都会由 Pinata 获得一个唯一的CID,这便于高效追踪并防止重复上传。此功能对于维护游戏资产有序库非常关键。

    1. 元数据管理
  • 用户可以通过Pinata为其资产添加元数据,从而使游戏文件更容易分类和搜索。此功能通过提供更多相关信息,使用户能够更轻松地管理他们的资产。

    1. 群组管理
  • 用户可以创建和管理群组,与团队成员合作进行项目。此功能通过让用户在群组内共同分享和整理资源来促进团队合作。

    1. 钉住和取消钉住文件
  • 用户可以将其资产库中的文件固定和取消固定。固定文件可确保它们保留在 IPFS 网络上,而取消固定则允许用户移除不再需要的文件,从而优化存储和管理效率。

    1. 固定 AI 生成的内容部分 :
  • 由 AI 生成的文本内容会以文本文件的形式与所选项目或组相关联,并固定在其中。

    1. Pinata 分页功能
  • Pinata的分页功能让用户轻松管理大量文件,通过把它们分成几页,从而提升浏览和检索文件的体验。
const response = await pinata
  .listFiles()
  .group(groupId)
  .pageLimit(itemsPerPage + 1); // 请求每页加载 11 个项目。这样可以检查是否有额外的页面。
  .pageOffset(page * itemsPerPage); // 确保当页面从 0 开始时的正确偏移。
  1. 无缝集成 :此处提供无缝集成的简要描述或功能说明。
  • 将Pinata与我们的Next.js应用集成起来非常简单。Pinata API使我们能够以最小的成本实现文件上传、检索和附加元数据等功能。
  1. User Authentication
  • 使用 Auth.js 进行 OAuth,我们确保用户能安全登录并管理自己的资产,同时提供个性化的使用体验。
源码

在仓库里查看项目代码

GitHub logo Shivam-Sharma-1 / Stash-It

StashIt 是一个游戏资产存储的网页应用,利用了 Next.js、TailwindCSS 和 Pinata 的优势。它在 IPFS 网络上安全地存储各种游戏资产,比如图像、音频、视频和 3D 模型。每个文件都有 Pinata 提供的 CID 唯一标识,确保资产的唯一性。

dev to banner

StashIt:您的游戏资产集结地!

StashIt 是一个游戏资产存储的网页应用,利用了 Next.js、TailwindCSS 和 Pinata 的强大功能。它通过 IPFS 网络安全地存储各种游戏中的资产,如图像、音频、视频和 3D 模型,每个文件都由 Pinata 提供的 CID 唯一标识,确保不会出现重复资产。该平台还包括使用 OpenRouter API 生成角色背景的 AI 功能。此外,用户还可以为他们的文件添加元数据,以增强资产的管理。

目录表
示例

点击这里 查看实时演示

着陆页

着陆页

我的项目板

我的项目看板

探索资产

查看资产

火焰预览一下

文件预览:](https://private-user-images.githubusercontent.com/111264028/376124004-8403fb84-ec31-41fc-ab75-ec9125173a54.jpg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mjg4ODkxODksIm5iZiI6MTcyODg4ODg4OSwicGF0aCI6Ii8xMTEyNjQwMjgvMzc2MTI0MDA0LTg0MDNmYjg0LWVjMzEtNDFmYy1hYjc1LWVjOTEyNTE3M2E1NC5qcGc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQxMDE0JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MTAxNFQwNjU0NDlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0zYmVhMWRjNmZlMWExNzYwNTJlYTA5ZjMyNzg2MmM5NmEyMTQ1MTA5Y2M1MGQ5MDcyOWViNTQ5ODBlMzAwYjcyJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCJ9.5VxbXO87gZpqEovWifmxQz4qu_tqMGYkoK7FageYQjc)

AI角色背景生成器

AI角色背景生成器](https://private-user-images.githubusercontent.com/111264028/376124550-bbfbe676-a8d6-4f00-ba4e-fc10388f7668.jpg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mjg4ODkxODksIm5iZiI6MTcyODg4ODg4OSwicGF0aCI6Ii8xMTEyNjQwMjgvMzc2MTI0NTUwLWJiZmJlNjc2LWE4ZDYtNGYwMC1iYTRlLWZjMTAzODhmNzY2OC5qcGc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQxMDE0JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MTAxNFQwNjU0NDlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT1jZTEwMmEyY2EzYTlhYzk5ODU0NWZlM2U2Y2I3MGNlOWFhMTBhYzg3MjA2ODljMzQ4MDFiOWI5NzEyNDBmMzVmJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCJ9.dnwG73KOeCIJBM_cXXNXeXKgy12FkHmAWdbqX1-Z7kU)

身份验证页面

auth](https://private-user-images.githubusercontent.com/111264028/376124966-8c0a28da-7ddd-4403-8ffa-dffa43bd2e41.jpg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mjg4ODkxODksIm5iZiI6MTcyODg4ODg4OSwicGF0aCI6Ii8xMTEyNjQwMjgvMzc2MTI0OTY2LThjMGEyOGRhLTdkZGQtNDQwMy04ZmZhLWRmZmE0M2JkMmU0MS5qcGc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQxMDE0JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MTAxNFQwNjU0NDlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0yZjBjZTYyN2EwZmM3MmVhOWMwMzZjNzU1ZDQ1YWE4NTEyYTYxNjIxZmUxMzg2MWUyY2Y5MDY4NDU4ZWNjZmMzJlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCJ9.QTkLELC5nTJDYPzcTHkbIG4qtdDoxYLqHjAYixc0BG4)

上传单个文件

单个上传](https://private-user-images.githubusercontent.com/111264028/376125154-ab02355e-aae5-4334-a87b-b365380ccb6a.jpg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3Mjg4ODkxODksIm5iZiI6MTcyODg4ODg4OSwicGF0aCI6Ii8xMTEyNjQwMjgvMzc2MTI1MTU0LWFiMDIzNTVlLWFhZTUtNDMzNC1hODdiLWIzNjUzODBjY2I2YS5qcGc_WC1BbXotQWxnb3JpdGhtPUFXUzQtSE1BQy1TSEEyNTYmWC1BbXotQ3JlZGVudGlhbD1BS0lBVkNPRFlMU0E1M1BRSzRaQSUyRjIwMjQxMDE0JTJGdXMtZWFzdC0xJTJGczMlMkZhd3M0X3JlcXVlc3QmWC1BbXotRGF0ZT0yMDI0MTAxNFQwNjU0NDlaJlgtQW16LUV4cGlyZXM9MzAwJlgtQW16LVNpZ25hdHVyZT0wODk0MDJmYmI0MjRlNzJjYzEzZTc4MDEyM2RmYzI5ODIwMzE2Nzk2ZjE1YTNkODRlZTllN2RlMTc4OGJiYjM1JlgtQW16LVNpZ25lZEhlYWRlcnM9aG9zdCJ9.IljmF0EWjdHVBZEh-aHL3zeMIduN07yXv4r48zstRgQ)

特点
  • 使用IPFS的存储用于游戏资源(游戏素材)
  • 每个资产都有一个唯一的CID,以防止重复
  • Pinata元数据功能:添加...等功能

在 GitHub 上查看

了解更多

StashIt 展示了 Pinata 在管理数字资产的网页应用中的潜力。通过 Pinata 的强大 IPFS 功能,我们确保用户可以安全地上传、管理和分享他们的游戏资产,无需担心丢失或重复的问题。使用元数据让资产管理工作更加系统化,让用户更容易查找和有效利用存储的资产。

附加的功能

  • AI角色生成背景:用户可以使用OpenRouter API生成独特的角色背景和故事情节,从而提升他们在游戏开发中的体验。
  • 通过Auth.js实现OAuth:我们实现了通过Auth.js的OAuth功能,允许用户通过第三方服务(如Google或GitHub)登录,从而在管理其资产时增加了安全性和使用的便利性。
  • 固定AI生成的内容:用户可以将AI生成的图像固定到选定的项目或组中,而AI生成的文本将以文本文件的形式关联到选定的项目或组。
团队提交:

这是由两名成员组成的团队提交的内容。

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP