Chuyển đến nội dung chính
Hướng dẫn AI

Xây dựng và vận hành studio hình ảnh, video AI mã nguồn mở với OpenHiggsfield AI

Tìm hiểu cách cài đặt OpenHiggsfield AI, kết nối khóa nền tảng, tạo nội dung, quản lý kết quả và khám phá kiến trúc Next.js dựa trên danh mục.

Thời gian đọc khoảng 22 phút
Studio hình ảnh, video AI mã nguồn mở với OpenHiggsfield AI

OpenHiggsfield AI là gì?

OpenHiggsfield AI là một giải pháp thay thế miễn phí, mã nguồn mở cho Higgsfield AI. Công cụ cung cấp một studio trên trình duyệt thống nhất để tạo hình ảnh và video với 40 mô hình: 12 mô hình hình ảnh và 28 mô hình video. Bạn sử dụng khóa nền tảng tạo nội dung của riêng mình, đồng thời có thể mở studio được lưu trữ hoặc tự chạy ứng dụng.

Dự án được xây dựng với Next.js 16 App Router, React 19, Zustand, CSS thuần và pnpm. Danh mục bao gồm các mô hình thuộc những dòng như Nano Banana, Soul, Gemini, Kling, Veo, Wan, Flux, GPT Image, Ideogram, Recraft, LTX, MiniMax, PixVerse, Grok và Qwen.

Studio miễn phí và mã nguồn mở, nhưng các yêu cầu tạo nội dung sử dụng khóa nền tảng của riêng bạn.

Tính năng chính

Một trình soạn thảo cho hình ảnh và video

Một thanh nhắc lệnh duy nhất xử lý cả việc tạo hình ảnh và video. Mô hình được chọn sẽ quyết định loại đầu ra. Nhấn Cmd + Enter trên macOS hoặc Ctrl + Enter trên các nền tảng khác để gửi yêu cầu.

Mỗi mô hình khai báo các cài đặt và vai trò phương tiện được hỗ trợ. Vì vậy, giao diện chỉ hiển thị những tùy chọn liên quan như tỷ lệ khung hình, độ phân giải, thời lượng, định dạng đầu ra, âm thanh, số lượng kết quả và cải thiện câu lệnh.

Đầu vào phương tiện theo mô hình

Tùy thuộc vào mô hình được chọn, bạn có thể đính kèm các đầu vào được hỗ trợ như khung hình đầu, khung hình cuối, phương tiện tham chiếu, video hoặc âm thanh. Mỗi vai trò tuân theo các giới hạn do mô hình đó khai báo.

Các tệp đã tải lên được gửi trực tiếp đến Vercel Blob và chuyển thành URL công khai để các yêu cầu tạo nội dung sử dụng. Trình chọn nội dung cũng có thể dùng lại các tệp từ thư viện tải lên hoặc những lần chạy đã hoàn tất trong lịch sử cục bộ.

Tạo hàng loạt và tiến trình trực tiếp

Studio hỗ trợ tối đa bốn kết quả cho mỗi lần gửi. Các mô hình có cài đặt số lượng tích hợp sẽ sử dụng tùy chọn đó; những mô hình khác sẽ nhận một yêu cầu cho mỗi kết quả.

Ô giữ chỗ cho kết quả xuất hiện ngay sau khi gửi. OpenHiggsfield AI kiểm tra trạng thái yêu cầu mỗi bốn giây, với thời hạn mười phút, và hiển thị từng kết quả hoàn tất ngay khi có sẵn.

Thư viện và quản lý kết quả

  • Bốn phạm vi thư viện: Hình ảnh, Video, Tài sản và Yêu thích.
  • Bố cục dạng masonry: Kết quả hiển thị theo tỷ lệ khung hình thực, mới nhất trước.
  • Thao tác trên ô: Dùng lại, yêu thích, xóa và chọn từng kết quả.
  • Trình xem chi tiết: Kiểm tra câu lệnh, mô hình, cài đặt đã áp dụng, dấu thời gian và phương tiện kích thước đầy đủ.
  • Thao tác hàng loạt: Tải xuống, yêu thích, bỏ yêu thích hoặc xóa các mục đã chọn.
  • Hoàn tác: Kết quả đã xóa có thể được khôi phục trong sáu giây.
  • Khôi phục lỗi: Các lần chạy thất bại, bị hủy hoặc NSFW vẫn giữ nguyên lý do và cung cấp quy trình thử lại.

Chọn Dùng lại sẽ khôi phục mô hình, câu lệnh và cài đặt ban đầu, hữu ích cho công việc lặp lại thay vì chỉ sao chép văn bản câu lệnh.

Lịch sử cục bộ

Lịch sử được lưu trong IndexedDB của trình duyệt hiện tại. Lịch sử giữ tối đa 60 bản ghi, trong khi các mục yêu thích được giữ lại thay vì bị loại bỏ khi đạt giới hạn đó. Vì URL kết quả thuộc về nền tảng tạo nội dung, các bản ghi cũ vẫn có thể nằm trong lịch sử sau khi phương tiện CDN của chúng hết hạn.

Tùy chọn 1: Sử dụng studio được lưu trữ

Cách nhanh nhất để bắt đầu là mở openhiggsfield.ai. Phiên bản này chạy hoàn toàn trong trình duyệt và không yêu cầu cài đặt Node.js hay thiết lập cục bộ.

  1. Mở studio được lưu trữ.
  2. Chọn Thêm khóa.
  3. Dán khóa nền tảng theo định dạng id:secret.
  4. Chọn một mô hình hình ảnh hoặc video.
  5. Nhập câu lệnh và cấu hình các cài đặt khả dụng.
  6. Gửi yêu cầu và chờ các ô kết quả hoàn tất.

Khóa được xử lý bởi một server action và lưu trong cookie httpOnly. Trình duyệt không gọi trực tiếp API tạo nội dung. Nếu không có khóa, studio sẽ mở hộp thoại khóa thay vì âm thầm báo lỗi.

Tùy chọn 2: Cài đặt OpenHiggsfield AI cục bộ

Điều kiện tiên quyết

Bạn cần một môi trường phát triển có khả năng chạy dự án bằng pnpm. Bạn cũng cần một khóa nền tảng tương thích để tạo nội dung. Quy trình tải lên yêu cầu mã thông báo đọc-ghi Vercel Blob.

Cài đặt phần phụ thuộc và khởi chạy môi trường phát triển

Sao chép hoặc tải xuống kho lưu trữ, mở thư mục của kho trong terminal và chạy:

pnpm install
pnpm dev

Máy chủ phát triển khởi chạy tại http://localhost:3000. Mở địa chỉ đó, nhấn Thêm khóa và nhập khóa theo dạng id:secret.

Cấu hình biến môi trường

Thiết lập nguồn gốc API tạo nội dung và mã thông báo Vercel Blob trong môi trường được ứng dụng sử dụng:

HF_API_BASE_URL=
OPEN_HIGGSFIELD_READ_WRITE_TOKEN=
  • HF_API_BASE_URL xác định nguồn gốc chỉ dành cho máy chủ của API tạo nội dung.
  • OPEN_HIGGSFIELD_READ_WRITE_TOKEN cung cấp quyền đọc-ghi để tải lên Vercel Blob.

Không để lộ nguồn gốc API tạo nội dung hoặc thông tin xác thực riêng tư thông qua mã phía máy khách. Dự án được thiết kế để server action là nơi duy nhất gọi API tạo nội dung.

Lệnh cho môi trường sản xuất

Xây dựng và phục vụ phiên bản sản xuất bằng:

pnpm build
pnpm start

Kho lưu trữ cũng bao gồm lệnh xây dựng thương hiệu để tạo lại các biểu tượng và thẻ Open Graph trong public/:

pnpm brand

Tạo kết quả đầu tiên

  1. Xác nhận chỉ báo khóa trên thanh trên cùng cho biết vẫn còn khóa khả dụng.
  2. Mở bộ chọn mô hình có chức năng tìm kiếm.
  3. Chọn mô hình hình ảnh hoặc video.
  4. Viết prompt trong trình soạn thảo dùng chung.
  5. Xem lại các cài đặt được hiển thị cho mô hình đó.
  6. Nếu được hỗ trợ, đính kèm phương tiện tham chiếu hoặc đầu vào dành riêng cho vai trò khác.
  7. Khi phù hợp, chọn kích thước lô tối đa bốn.
  8. Nhấn Cmd + Enter hoặc Ctrl + Enter.

Đối với một yêu cầu hình ảnh cơ bản, bạn có thể nhập:

A cinematic photograph of a glass observatory above a misty forest at sunrise

Đối với mô hình video, prompt định hướng chuyển động có thể là:

The camera slowly approaches a glass observatory while morning fog moves through the trees

Các tùy chọn thay đổi tùy theo mô hình. Chỉ sử dụng những cài đặt và vai trò phương tiện được studio hiển thị, thay vì giả định mọi mô hình đều hỗ trợ cùng một loại đầu vào.

Tái sử dụng tài nguyên và các lượt chạy trước

Khi một mô hình chấp nhận phương tiện, hãy mở bộ chọn tài nguyên cho vai trò tương ứng. Bộ chọn này hiển thị hai nguồn trong cùng một thư viện:

  • Tệp tải lên: Các tệp đã được tải lên trước đó qua studio.
  • Lịch sử: Phương tiện từ các lượt tạo đã hoàn tất.

Bộ chọn lọc các mục theo loại được yêu cầu bởi vai trò đã chọn. Nhờ đó, bạn có thể sử dụng một hình ảnh đã hoàn tất làm khung hình bắt đầu hoặc hình ảnh tham chiếu khi mô hình được chọn công bố hỗ trợ đầu vào đó.

Để lặp lại một lượt tạo trước đó, hãy chọn Tái sử dụng trên ô thư viện của lượt đó hoặc Tạo lại trong trình xem. Studio khôi phục mô hình, cài đặt và prompt để bạn có thể sửa một chi tiết rồi tạo phiên bản khác.

Làm việc hiệu quả trong thư viện

Sử dụng các phạm vi Hình ảnh và Video để tập trung vào một loại phương tiện, Tài nguyên để xem mọi lượt chạy đã hoàn tất, và Yêu thích để giữ các kết quả quan trọng luôn dễ truy cập. Thanh tab hỗ trợ điều hướng bằng phím mũi tên.

Để quản lý nhiều kết quả, hãy nhấp vào ô chọn của một ô để vào chế độ chọn. Nhấn Shift khi nhấp để mở rộng vùng chọn theo một khoảng. Sau đó, bạn có thể tải xuống hàng loạt, thay đổi trạng thái yêu thích hoặc xóa hàng loạt. Nhấn Esc để thoát chế độ chọn.

Các lượt tải xuống hàng loạt chạy tuần tự và hiển thị tiến trình. Báo cáo cuối cùng xác định mọi tệp bị CDN từ chối. Nếu bạn xóa nhầm mục, hãy sử dụng nút hoàn tác trong sáu giây trước khi hết thời hạn.

Cách kiến trúc tạo nội dung hoạt động

Mỗi lượt tạo bắt đầu dưới dạng một đối tượng duy nhất chứa mô hình, prompt, phương tiện và cài đặt đã chọn:

{ model, prompt, media, settings }

Giao diện xây dựng đối tượng này và truyền nó đến một server action. Action đó đối chiếu mô hình với danh mục, rồi ánh xạ các giá trị trong studio sang những trường mà API tạo nội dung yêu cầu, chẳng hạn như image_urls và aspect_ratio.

Các yêu cầu gửi và trạng thái tuân theo các mẫu phía máy chủ sau:

POST /{model}
GET /requests/{id}/status
Authorization: Key <api_key>

Trình duyệt không bao giờ liên hệ trực tiếp với API tạo nội dung. Tệp tải lên được xử lý riêng: máy khách tải lên Vercel Blob thông qua /api/blob, nơi cấp các token có phạm vi giới hạn. URL blob: cục bộ chỉ được dùng để xem trước.

Bố cục dự án

src/
  app/
    /api/blob
    base.css
  generation/
  openhiggsfield/
  • src/app/ chứa trang studio toàn màn hình, endpoint cấp token Blob và các kiểu canvas ở cấp tài liệu.
  • src/generation/ chứa các yêu cầu tạo nội dung, server action, ánh xạ API, danh mục mô hình và các store Zustand.
  • src/openhiggsfield/ chứa trình soạn thảo, thư viện, trình xem, bộ chọn mô hình, cài đặt, bộ chọn tài nguyên, thanh chọn và CSS của studio.

Mẹo nâng cao

Coi danh mục là nguồn sự thật duy nhất

Hành vi của mô hình được điều khiển bởi danh mục trong src/generation/catalog/. Một mục trong danh mục cung cấp các cài đặt và vai trò phương tiện cho giao diện, vì vậy studio không duy trì một danh sách điều khiển hardcode riêng.

Khi mở rộng dự án bằng một mô hình được dịch vụ tạo nội dung hỗ trợ, hãy tuân theo mẫu khai báo danh mục hiện có. Đảm bảo các cài đặt và vai trò phương tiện được phép phản ánh chính xác API, thay vì thêm các điều khiển dành riêng cho mô hình ở nơi khác trong studio.

Giữ quyền truy cập API ở phía máy chủ

Duy trì ranh giới server action hiện có khi tùy chỉnh dự án. Việc xác thực tạo nội dung sử dụng Authorization: Key <api_key>; chuyển các lệnh gọi này vào mã trình duyệt sẽ làm suy yếu thiết kế vốn giữ hoạt động giao tiếp với API và thông tin xác thực ở phía máy chủ.

Hiểu mô hình trạng thái Zustand

Ứng dụng sử dụng năm store Zustand nhỏ thay vì tạo một store cho mỗi mô hình. Quy trình hình ảnh và video dùng chung trạng thái prompt và phương tiện, trong khi các cài đặt được lập chỉ mục theo ID mô hình và một store hoạt động nhỏ theo dõi trạng thái hiện tại. Các tùy chỉnh nên duy trì cấu trúc cài đặt hướng theo mô hình này.

Lập kế hoạch cho các URL phương tiện hết hạn

Lịch sử trong IndexedDB có thể tồn tại lâu hơn các tệp được CDN của nền tảng tạo nội dung lưu trữ. Các bản ghi yêu thích được cố ý giữ lại, nhưng điều đó không đảm bảo URL phương tiện từ xa của chúng vẫn khả dụng. Hãy tải xuống các kết quả quan trọng thay vì chỉ dựa vào lịch sử trình duyệt.

Dùng mục yêu thích cho các phiên lặp dài

Giới hạn lịch sử thông thường là 60 bản ghi, trong khi các mục yêu thích không bị loại khỏi giới hạn đó theo thời gian. Hãy đánh dấu các kết quả tiềm năng là yêu thích trong những phiên dài, sau đó dùng Tái sử dụng hoặc Tạo lại để tiếp tục tinh chỉnh prompt và cài đặt của chúng.

Kết luận

OpenHiggsfield AI kết hợp khả năng tạo hình ảnh và video trong một studio mã nguồn mở, được xây dựng theo danh mục. Bạn có thể sử dụng ngay phiên bản được lưu trữ hoặc tự lưu trữ ứng dụng Next.js, kết nối khóa riêng, làm việc với các tùy chọn điều khiển dành riêng cho từng mô hình, tái sử dụng tài nguyên và quản lý kết quả thông qua thư viện trình duyệt luôn được duy trì. Ranh giới API chỉ dành cho máy chủ cùng danh mục khai báo cũng tạo nền tảng rõ ràng cho việc tùy chỉnh.