PicImpact 是一个摄影师专用的摄影作品展示网站,基于 Next.js + Hono.js 开发。
注:这是个很艰难的决定,v2 版本与 v1 版本不兼容,您需要重新配置数据库。迁移脚本
- 瀑布流相册展示图片,支持常见的格式。
- 点击图片查看原图,浏览图片信息和 EXIF 信息,支持直链访问。
- 响应式设计,在 PC 和移动端都有不错的体验,支持暗黑模式。
- 图片存储兼容 S3 API、Cloudflare R2、AList API。
- 图片支持绑定标签,并且可通过标签进行交互,筛选标签下所有图片。
- 支持批量自动化上传,上传图片时会生成 0.3 倍率的压缩图片,以提供加载优化。
- 图片版权信息展示和维护功能,支持外链跳转。
- 后台有图片数据统计、图片上传、图片维护、相册管理、系统设置和存储配置功能。
- 双因素认证功能,基于 TOTP 算法 RFC 6238,支持 Google Authenticator、Microsoft Authenticator 和 1Password 等。
- 基于 SSR 的混合渲染,采用状态机制,提供良好的使用体验。
- 基于 prisma 的自动初始化数据库和数据迁移,简化部署流程。
- 支持 Vercel 部署、Node.js 部署、Docker 等容器化部署,当然 k8s 也支持。
- 单独的存储管理功能(不会影响现有功能,属于扩展)。
- RSS 支持,能够使用 Follow 订阅。
- Web Analytics 支持。
- OneDrive 支持。
会抽空进行开发与维护,也欢迎 PR!
你可以点击下面的按钮来一键部署到 Vercel,然后将 Build Command
设置为 pnpm run build:vercel
,也可以 Fork 项目后手动部署到任何支持的平台。
Key | 备注 |
---|---|
DATABASE_URL | Postgre 数据库 url,postgresql://[用户名]:[密码]@[地址和端口]/[数据库] ,如:postgresql://postgres:666666@aws-0-ap-northeast-1.pooler.supabase.com:6543/postgres |
AUTH_SECRET | 权限机密,你可以执行 npx auth secret 生成一个,反正是随机的字符串就行 |
默认账号:admin@qq.com
,默认密码:666666
,登录后请先去设置里面修改密码!
部署就是这么简单,只需要您准备一个干净的数据库就行! 除了容器化部署方式外,其它的部署方式都需要执行
pnpm run prisma:deploy
来完成 prisma 迁移。如果是 Vercel 部署,直接将
Build Command
设置为pnpm run build:vercel
即可。如果您自行使用 node 部署,请使用
pnpm run build:node
命令来构建。
你可以使用 Docker 来部署 PicImpact,当然 containerd 和 k8s 也是可以的。
docker run -d --name picimpact \
-p 3000:3000 \
-e DATABASE_URL="postgresql://[用户名]:[密码]@[地址和端口]/[数据库]" \
-e AUTH_SECRET="自己运行npx auth secret或一串随机的字符串都行" \
besscroft/picimpact:latest
注意:如果您使用
Docker Compose
,存在无法访问数据库的问题,请尝试将环境变量的双引号去掉。即DATABASE_URL="连接信息"
->DATABASE_URL=连接信息
。
暂时提供了 AWS S3 API、Cloudflare R2、AList API 支持,您在部署成功后,可以去 设置
-> 存储
进行管理。
我比较推荐 Cloudflare R2,算是很良心的了,流量免费。
- AWS S3 配置
Key | 备注 |
---|---|
accesskey_id | 阿里 OSS / AWS S3 AccessKey_ID |
accesskey_secret | 阿里 OSS / AWS S3 AccessKey_Secret |
region | 阿里 OSS / AWS S3 Region 地域,如:oss-cn-hongkong |
endpoint | 阿里 OSS / AWS S3 Endpoint 地域节点,如:oss-cn-hongkong.aliyuncs.com |
bucket | 阿里 OSS / AWS S3 Bucket 存储桶名称,如:picimpact |
storage_folder | 存储文件夹(S3),严格格式,如:picimpact 或 picimpact/images ,填 / 或者不填表示根路径 |
force_path_style | 是否强制客户端对桶使用路径式寻址,默认 false ,如您使用 minio 作为 s3 存储,需要设置为 true |
s3_cdn | 是否启用 S3 CDN 模式,路径将返回 cdn 地址,默认 false。 |
s3_cdn_url | cdn 地址,如:https://cdn.example.com |
- Cloudflare R2 配置
Key | 备注 |
---|---|
r2_accesskey_id | Cloudflare AccessKey_ID |
r2_accesskey_secret | Cloudflare AccessKey_Secret |
r2_endpoint | Cloudflare Endpoint 地域节点,如:https://<ACCOUNT_ID>.r2.cloudflarestorage.com |
r2_bucket | Cloudflare Bucket 存储桶名称,如:picimpact |
r2_storage_folder | 存储文件夹(Cloudflare R2),严格格式,如:picimpact 或 picimpact/images ,填 / 或者不填表示根路径 |
r2_public_domain | Cloudflare R2 自定义域(公开访问) |
- AList API 配置
Key | 备注 |
---|---|
alist_token | alist 令牌 |
alist_url | AList 地址,如:https://alist.example.com |
克隆到本地开发:
git clone https://github.com/besscroft/PicImpact.git
pnpm i
pnpm run dev
如果您有任何建议,欢迎反馈!
提出新想法 & 提交 Bug | Fork & Pull Request
PicImpact 欢迎各种贡献,包括但不限于改进,新功能,文档和代码改进,问题和错误报告。
v1
分支目前仅维护和修复 bug。
v2
分支开发下一个版本,同时接受 PR
!
有需求和建议都可以提,有空的话我会处理,但受限于 Next / SSR 的⌈局限性⌋,很多功能的设计上可能会有取舍。
您使用本程序时,需要自己去维护各个平台的配置信息(毕竟跟咱没关系,需要在对应的平台配置),以及对象存储的读写权限、访问控制、防盗链、跨域设置、缓存策略和 CDN 等配置,以最大程度的避免天价账单。
如您有更多疑问,可以提交 Issue。
- Last 2 versions of Chrome, Firefox, Safari and Edge
- Firefox ESR
事实上不是过于老旧的浏览器,一般都是能用的。
已经在尽力支持了,主要基于 WAI-ARIA 规范,有爱,无障碍!
本项目使用 JetBrains 的开源许可证,基于 IntelliJ IDEA 开发,感谢!
PicImpact is open source software licensed as MIT.