Pendahuluan
Pustaka klien untuk JavaScript/TypeScript menawarkan antarmuka yang mudah digunakan untuk berinteraksi dengan layanan Port.
Instalasi
Untuk mengintegrasikan klien ke dalam proyek Anda, instal menggunakan npm:
npm install @portmoda/client
Fitur
Memanggil Titik Akhir
Port mengelola permintaan titik akhir melalui sistem antrian, memastikan keandalan dan skalabilitas. Gunakan metode subscribe untuk mengirim permintaan dan menunggu hasilnya.
Contoh:
import { port } from "@portmoda/client";
const result = await port.subscribe("black-forest-labs/flux-kontext-pro/text-to-image", {
input: {
prompt: "Teko teh kaca dengan teh bunga mekar di dalamnya, diletakkan di atas meja kayu di dekat jendela yang disinari matahari dengan cahaya pagi yang lembut.",
"aspect_ratio": "16:9",
"output_format": "jpeg",
},
logs: true,
onQueueUpdate: (update) => {
if (update.status === "IN_PROGRESS") {
console.log(update.logs)
}
},
});
console.log(result.data);
console.log(result.requestId);
Manajemen Antrian
Kelola permintaan Anda dengan metode ini:
Mengirim Permintaan
Kirim permintaan dan dapatkan request_id untuk penggunaan nanti.
Contoh:
import { port } from "@portmoda/client";
const { request_id } = await port.queue.submit("black-forest-labs/flux-kontext-max", {
input: {
prompt: "Teko teh kaca dengan teh bunga mekar di dalamnya, diletakkan di atas meja kayu di dekat jendela yang disinari matahari dengan cahaya pagi yang lembut.",
"aspect_ratio": "16:9",
"output_format": "jpeg",
},
});
Memeriksa Status Permintaan
Ambil status permintaan.
Contoh:
import { port } from "@portmoda/client";
const status = await port.queue.status({
requestId: "pd_eTYYuw4EqYLzRBHgnAMHA8zH",
logs: true,
});
Mengambil Hasil Permintaan
Ambil hasil dari permintaan yang sudah selesai.
Contoh:
import { port } from "@portmoda/client";
const result = await port.queue.result({
requestId: "pd_eTYYuw4EqYLzRBHgnAMHA8zH",
});
console.log(result.data);
console.log(result.requestId);
Penyimpanan
API storage memungkinkan Anda untuk mengunggah file dan menerima URL, yang kemudian dapat digunakan dalam permintaan titik akhir model Anda. Ini sangat berguna untuk model yang memerlukan input file, seperti gambar-ke-video atau ucapan-ke-teks.
Ukuran file maksimum: 100MB
Mengunggah File di Browser
Anda dapat mengizinkan pengguna untuk mengunggah file langsung dari browser mereka. Contoh berikut menunjukkan cara menggunakan elemen <input type="file"> untuk memilih file dan mengunggahnya.
import { port } from "@portmoda/client";
const fileInput = document.getElementById('file-input');
fileInput.addEventListener('change', async (event) => {
const file = event.target.files[0];
if (file) {
try {
const url = await port.storage.upload(file);
console.log('File berhasil diunggah:', url);
// Sekarang Anda dapat menggunakan URL ini dengan titik akhir model
} catch (error) {
console.error('Unggahan gagal:', error);
}
}
});
Mengunggah File di Node.js
Di sisi server dengan Node.js, Anda dapat membaca file dari sistem file lokal dan mengunggahnya.
import { port } from "@portmoda/client";
import { readFile } from "node:fs/promises";
import { basename } from "node:path";
async function uploadLocalFile(filePath) {
try {
const buffer = await readFile(filePath);
// Klien membutuhkan objek File, yang dapat kita buat dari buffer
const file = new File([buffer], basename(filePath));
const url = await port.storage.upload(file);
console.log('File berhasil diunggah:', url);
return url;
} catch (error) {
console.error('Unggahan gagal:', error);
}
}
uploadLocalFile("./path/to/your/image.png");
Unggahan Otomatis dengan Titik Akhir Model
SDK JavaScript dapat menangani unggahan file secara otomatis untuk Anda. Ketika Anda memberikan objek File, Blob, atau URI data base64 ke input titik akhir model, SDK akan terlebih dahulu mengunggahnya ke penyimpanan dan kemudian menggunakan URL yang dihasilkan dalam permintaan.
Ini menyederhanakan proses karena Anda tidak perlu melakukan langkah unggah terpisah.
import { port } from "@portmoda/client";
// Objek File dari input file browser akan diunggah secara otomatis
const fileInput = document.getElementById('file-input');
const file = fileInput.files[0];
const result = await port.subscribe("some-model-that-takes-images", {
input: {
image: file, // SDK secara otomatis mengunggah file ini
prompt: "Prompt yang menjelaskan apa yang harus dilakukan dengan gambar"
}
});
// URI data base64 juga akan diunggah secara otomatis
const base64Image = "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQ...";
const result2 = await port.subscribe("some-model-that-takes-images", {
input: {
image: base64Image, // SDK secara otomatis mengubah ini menjadi Blob dan mengunggahnya
prompt: "Prompt yang menjelaskan apa yang harus dilakukan dengan gambar"
}
});
Dukungan
Bergabunglah dengan komunitas kami untuk bantuan atau diskusi:
Kami di sini untuk membantu Anda!