jbilcke-hf's picture
jbilcke-hf HF staff
disable bad rendering
b1fd525
raw
history blame
20.6 kB
"use server"
import { v4 as uuidv4 } from "uuid"
import Replicate from "replicate"
import { RenderRequest, RenderedScene, RenderingEngine, Settings } from "@/types"
import { generateSeed } from "@/lib/generateSeed"
import { sleep } from "@/lib/sleep"
const serverRenderingEngine = `${process.env.RENDERING_ENGINE || ""}` as RenderingEngine
// TODO: we should split Hugging Face and Replicate backends into separate files
const serverHuggingfaceApiKey = `${process.env.AUTH_HF_API_TOKEN || ""}`
const serverHuggingfaceApiUrl = `${process.env.RENDERING_HF_INFERENCE_ENDPOINT_URL || ""}`
const serverHuggingfaceInferenceApiModel = `${process.env.RENDERING_HF_INFERENCE_API_BASE_MODEL || ""}`
const serverHuggingfaceInferenceApiModelRefinerModel = `${process.env.RENDERING_HF_INFERENCE_API_REFINER_MODEL || ""}`
const serverHuggingfaceInferenceApiModelTrigger = `${process.env.RENDERING_HF_INFERENCE_API_MODEL_TRIGGER || ""}`
const serverHuggingfaceInferenceApiFileType = `${process.env.RENDERING_HF_INFERENCE_API_FILE_TYPE || ""}`
const serverReplicateApiKey = `${process.env.AUTH_REPLICATE_API_TOKEN || ""}`
const serverReplicateApiModel = `${process.env.RENDERING_REPLICATE_API_MODEL || ""}`
const serverReplicateApiModelVersion = `${process.env.RENDERING_REPLICATE_API_MODEL_VERSION || ""}`
const serverReplicateApiModelTrigger = `${process.env.RENDERING_REPLICATE_API_MODEL_TRIGGER || ""}`
const videochainToken = `${process.env.AUTH_VIDEOCHAIN_API_TOKEN || ""}`
const videochainApiUrl = `${process.env.RENDERING_VIDEOCHAIN_API_URL || ""}`
const serverOpenaiApiKey = `${process.env.AUTH_OPENAI_API_KEY || ""}`
const serverOpenaiApiBaseUrl = `${process.env.RENDERING_OPENAI_API_BASE_URL || "https://api.openai.com/v1"}`
const serverOpenaiApiModel = `${process.env.RENDERING_OPENAI_API_MODEL || "dall-e-3"}`
export async function newRender({
prompt,
// negativePrompt,
nbFrames,
width,
height,
withCache,
settings,
}: {
prompt: string
// negativePrompt: string[]
width: number
height: number
nbFrames: number
withCache: boolean
settings: Settings
}) {
// throw new Error("Planned maintenance")
if (!prompt) {
const error = `cannot call the rendering API without a prompt, aborting..`
console.error(error)
throw new Error(error)
}
let defaulResult: RenderedScene = {
renderId: "",
status: "error",
assetUrl: "",
alt: prompt || "",
maskUrl: "",
error: "failed to fetch the data",
segments: []
}
const nbInferenceSteps = 30
const guidanceScale = 9
let renderingEngine = serverRenderingEngine
let openaiApiKey = serverOpenaiApiKey
let openaiApiModel = serverOpenaiApiModel
let replicateApiKey = serverReplicateApiKey
let replicateApiModel = serverReplicateApiModel
let replicateApiModelVersion = serverReplicateApiModelVersion
let replicateApiModelTrigger = serverReplicateApiModelTrigger
let huggingfaceApiKey = serverHuggingfaceApiKey
let huggingfaceInferenceApiModel = serverHuggingfaceInferenceApiModel
let huggingfaceApiUrl = serverHuggingfaceApiUrl
let huggingfaceInferenceApiModelRefinerModel = serverHuggingfaceInferenceApiModelRefinerModel
let huggingfaceInferenceApiModelTrigger = serverHuggingfaceInferenceApiModelTrigger
let huggingfaceInferenceApiFileType = serverHuggingfaceInferenceApiFileType
const placeholder = "<USE YOUR OWN TOKEN>"
// console.log("settings:", JSON.stringify(settings, null, 2))
if (
settings.renderingModelVendor === "OPENAI" &&
settings.openaiApiKey &&
settings.openaiApiKey !== placeholder &&
settings.openaiApiModel
) {
console.log("using OpenAI using user credentials (hidden)")
renderingEngine = "OPENAI"
openaiApiKey = settings.openaiApiKey
openaiApiModel = settings.openaiApiModel
} if (
settings.renderingModelVendor === "REPLICATE" &&
settings.replicateApiKey &&
settings.replicateApiKey !== placeholder &&
settings.replicateApiModel &&
settings.replicateApiModelVersion
) {
console.log("using Replicate using user credentials (hidden)")
renderingEngine = "REPLICATE"
replicateApiKey = settings.replicateApiKey
replicateApiModel = settings.replicateApiModel
replicateApiModelVersion = settings.replicateApiModelVersion
replicateApiModelTrigger = settings.replicateApiModelTrigger
} else if (
settings.renderingModelVendor === "HUGGINGFACE" &&
settings.huggingfaceApiKey &&
settings.huggingfaceApiKey !== placeholder &&
settings.huggingfaceInferenceApiModel
) {
console.log("using Hugging Face using user credentials (hidden)")
renderingEngine = "INFERENCE_API"
huggingfaceApiKey = settings.huggingfaceApiKey
huggingfaceInferenceApiModel = settings.huggingfaceInferenceApiModel
huggingfaceInferenceApiModelTrigger = settings.huggingfaceInferenceApiModelTrigger
huggingfaceInferenceApiFileType = settings.huggingfaceInferenceApiFileType
}
try {
if (renderingEngine === "OPENAI") {
/*
const openai = new OpenAI({
apiKey: openaiApiKey
});
*/
// When using DALLΒ·E 3, images can have a size of 1024x1024, 1024x1792 or 1792x1024 pixels.
// the improved resolution is nice, but the AI Comic Factory needs a special ratio
// anyway, let's see what we can do
const size =
width > height ? '1792x1024' :
width < height ? '1024x1792' :
'1024x1024'
/*
const response = await openai.createImage({
model: "dall-e-3",
prompt,
n: 1,
size: size as any,
// quality: "standard",
})
*/
const res = await fetch(`${serverOpenaiApiBaseUrl}/images/generations`, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
Authorization: `Bearer ${openaiApiKey}`,
},
body: JSON.stringify({
model: openaiApiModel,
prompt,
n: 1,
size,
// quality: "standard",
}),
cache: 'no-store',
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
if (res.status !== 200) {
throw new Error('Failed to fetch data')
}
const response = (await res.json()) as { data: { url: string }[] }
// console.log("response:", response)
return {
renderId: uuidv4(),
status: "completed",
assetUrl: response.data[0].url || "",
alt: prompt,
error: "",
maskUrl: "",
segments: []
} as RenderedScene
} else if (renderingEngine === "REPLICATE") {
if (!replicateApiKey) {
throw new Error(`invalid replicateApiKey, you need to configure your REPLICATE_API_TOKEN in order to use the REPLICATE rendering engine`)
}
if (!replicateApiModel) {
throw new Error(`invalid replicateApiModel, you need to configure your REPLICATE_API_MODEL in order to use the REPLICATE rendering engine`)
}
if (!replicateApiModelVersion) {
throw new Error(`invalid replicateApiModelVersion, you need to configure your REPLICATE_API_MODEL_VERSION in order to use the REPLICATE rendering engine`)
}
const replicate = new Replicate({ auth: replicateApiKey })
const seed = generateSeed()
const prediction = await replicate.predictions.create({
version: replicateApiModelVersion,
input: {
prompt: [
"beautiful",
// "intricate details",
replicateApiModelTrigger || "",
prompt,
"award winning",
"high resolution"
].filter(x => x).join(", "),
width,
height,
seed,
...replicateApiModelTrigger && {
lora_scale: 0.85 // we generally want something high here
},
}
})
// no need to reply straight away as images take time to generate, this isn't instantaneous
// also our friends at Replicate won't like it if we spam them with requests
await sleep(4000)
return {
renderId: prediction.id,
status: "pending",
assetUrl: "",
alt: prompt,
error: prediction.error,
maskUrl: "",
segments: []
} as RenderedScene
} if (renderingEngine === "INFERENCE_ENDPOINT" || renderingEngine === "INFERENCE_API") {
if (!huggingfaceApiKey) {
throw new Error(`invalid huggingfaceApiKey, you need to configure your HF_API_TOKEN in order to use the ${renderingEngine} rendering engine`)
}
if (renderingEngine === "INFERENCE_ENDPOINT" && !huggingfaceApiUrl) {
throw new Error(`invalid huggingfaceApiUrl, you need to configure your RENDERING_HF_INFERENCE_ENDPOINT_URL in order to use the INFERENCE_ENDPOINT rendering engine`)
}
if (renderingEngine === "INFERENCE_API" && !huggingfaceInferenceApiModel) {
throw new Error(`invalid huggingfaceInferenceApiModel, you need to configure your RENDERING_HF_INFERENCE_API_BASE_MODEL in order to use the INFERENCE_API rendering engine`)
}
if (renderingEngine === "INFERENCE_API" && !huggingfaceInferenceApiModelRefinerModel) {
throw new Error(`invalid huggingfaceInferenceApiModelRefinerModel, you need to configure your RENDERING_HF_INFERENCE_API_REFINER_MODEL in order to use the INFERENCE_API rendering engine`)
}
const baseModelUrl = renderingEngine === "INFERENCE_ENDPOINT"
? huggingfaceApiUrl
: `https://api-inference.huggingface.co/models/${huggingfaceInferenceApiModel}`
const positivePrompt = [
"beautiful",
// "intricate details",
huggingfaceInferenceApiModelTrigger || "",
prompt,
"award winning",
"high resolution"
].filter(x => x).join(", ")
const res = await fetch(baseModelUrl, {
method: "POST",
headers: {
"Content-Type": "application/json",
Accept: huggingfaceInferenceApiFileType,
Authorization: `Bearer ${huggingfaceApiKey}`,
},
body: JSON.stringify({
inputs: positivePrompt,
parameters: {
num_inference_steps: nbInferenceSteps,
guidance_scale: guidanceScale,
width,
height,
},
// this doesn't do what you think it does
use_cache: false, // withCache,
}),
cache: "no-store",
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
// Recommendation: handle errors
if (res.status !== 200) {
const content = await res.text()
console.error(content)
// This will activate the closest `error.js` Error Boundary
throw new Error('Failed to fetch data')
}
const blob = await res.arrayBuffer()
const contentType = res.headers.get('content-type')
let assetUrl = `data:${contentType};base64,${Buffer.from(blob).toString('base64')}`
// note: there is no "refiner" step yet for custom inference endpoint
// you probably don't need it anyway, as you probably want to deploy an all-in-one model instead for perf reasons
if (renderingEngine === "INFERENCE_API") {
try {
const refinerModelUrl = `https://api-inference.huggingface.co/models/${huggingfaceInferenceApiModelRefinerModel}`
const res = await fetch(refinerModelUrl, {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${huggingfaceApiKey}`,
},
body: JSON.stringify({
inputs: Buffer.from(blob).toString('base64'),
parameters: {
prompt: positivePrompt,
num_inference_steps: nbInferenceSteps,
guidance_scale: guidanceScale,
width,
height,
},
// this doesn't do what you think it does
use_cache: false, // withCache,
}),
cache: "no-store",
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
// Recommendation: handle errors
if (res.status !== 200) {
const content = await res.json()
// if (content.error.include("currently loading")) {
// console.log("refiner isn't ready yet")
throw new Error(content?.error || 'Failed to fetch data')
}
const refinedBlob = await res.arrayBuffer()
const contentType = res.headers.get('content-type')
assetUrl = `data:${contentType};base64,${Buffer.from(refinedBlob).toString('base64')}`
} catch (err) {
console.log(`Refiner step failed, but this is not a blocker. Error details: ${err}`)
}
}
return {
renderId: uuidv4(),
status: "completed",
assetUrl,
alt: prompt,
error: "",
maskUrl: "",
segments: []
} as RenderedScene
} else {
const res = await fetch(`${videochainApiUrl}${videochainApiUrl.endsWith("/") ? "" : "/"}render`, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
Authorization: `Bearer ${videochainToken}`,
},
body: JSON.stringify({
prompt,
// negativePrompt, unused for now
nbFrames,
nbSteps: nbInferenceSteps, // 20 = fast, 30 = better, 50 = best
actionnables: [], // ["text block"],
segmentation: "disabled", // "firstframe", // one day we will remove this param, to make it automatic
width,
height,
// no need to upscale right now as we generate tiny panels
// maybe later we can provide an "export" button to PDF
// unfortunately there are too many requests for upscaling,
// the server is always down
upscalingFactor: 1, // 2,
// let's completely disable turbo mode, it doesn't work well for drawings and comics,
// basically all the people I talked to said it sucked
turbo: false, // settings.renderingUseTurbo,
// analyzing doesn't work yet, it seems..
analyze: false, // analyze: true,
cache: "ignore"
} as Partial<RenderRequest>),
cache: 'no-store',
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
if (res.status !== 200) {
throw new Error('Failed to fetch data')
}
const response = (await res.json()) as RenderedScene
return response
}
} catch (err) {
console.error(err)
return defaulResult
}
}
export async function getRender(renderId: string, settings: Settings) {
if (!renderId) {
const error = `cannot call the rendering API without a renderId, aborting..`
console.error(error)
throw new Error(error)
}
let renderingEngine = serverRenderingEngine
let openaiApiKey = serverOpenaiApiKey
let openaiApiModel = serverOpenaiApiModel
let replicateApiKey = serverReplicateApiKey
let replicateApiModel = serverReplicateApiModel
let replicateApiModelVersion = serverReplicateApiModelVersion
let replicateApiModelTrigger = serverReplicateApiModelTrigger
let huggingfaceApiKey = serverHuggingfaceApiKey
let huggingfaceInferenceApiModel = serverHuggingfaceInferenceApiModel
let huggingfaceInferenceApiModelTrigger = serverHuggingfaceInferenceApiModelTrigger
let huggingfaceApiUrl = serverHuggingfaceApiUrl
let huggingfaceInferenceApiModelRefinerModel = serverHuggingfaceInferenceApiModelRefinerModel
const placeholder = "<USE YOUR OWN TOKEN>"
if (
settings.renderingModelVendor === "OPENAI" &&
settings.openaiApiKey &&
settings.openaiApiKey !== placeholder &&
settings.openaiApiModel
) {
renderingEngine = "OPENAI"
openaiApiKey = settings.openaiApiKey
openaiApiModel = settings.openaiApiModel
} if (
settings.renderingModelVendor === "REPLICATE" &&
settings.replicateApiKey &&
settings.replicateApiKey !== placeholder &&
settings.replicateApiModel &&
settings.replicateApiModelVersion
) {
renderingEngine = "REPLICATE"
replicateApiKey = settings.replicateApiKey
replicateApiModel = settings.replicateApiModel
replicateApiModelVersion = settings.replicateApiModelVersion
replicateApiModelTrigger = settings.replicateApiModelTrigger
} else if (
settings.renderingModelVendor === "HUGGINGFACE" &&
settings.huggingfaceApiKey &&
settings.huggingfaceApiKey !== placeholder &&
settings.huggingfaceInferenceApiModel
) {
// console.log("using Hugging Face using user credentials (hidden)")
renderingEngine = "INFERENCE_API"
huggingfaceApiKey = settings.huggingfaceApiKey
huggingfaceInferenceApiModel = settings.huggingfaceInferenceApiModel
huggingfaceInferenceApiModelTrigger = settings.huggingfaceInferenceApiModelTrigger
}
let defaulResult: RenderedScene = {
renderId: "",
status: "pending",
assetUrl: "",
alt: "",
maskUrl: "",
error: "failed to fetch the data",
segments: []
}
try {
if (renderingEngine === "REPLICATE") {
if (!replicateApiKey) {
throw new Error(`invalid replicateApiKey, you need to configure your AUTH_REPLICATE_API_TOKEN in order to use the REPLICATE rendering engine`)
}
const res = await fetch(`https://api.replicate.com/v1/predictions/${renderId}`, {
method: "GET",
headers: {
Authorization: `Token ${replicateApiKey}`,
},
cache: 'no-store',
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
// Recommendation: handle errors
if (res.status !== 200) {
// This will activate the closest `error.js` Error Boundary
throw new Error('Failed to fetch data')
}
const response = (await res.json()) as any
return {
renderId,
status: response?.error ? "error" : response?.status === "succeeded" ? "completed" : "pending",
assetUrl: `${response?.output || ""}`,
alt: `${response?.input?.prompt || ""}`,
error: `${response?.error || ""}`,
maskUrl: "",
segments: []
} as RenderedScene
} else {
const res = await fetch(`${videochainApiUrl}/render/${renderId}`, {
method: "GET",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
Authorization: `Bearer ${videochainToken}`,
},
cache: 'no-store',
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
if (res.status !== 200) {
throw new Error('Failed to fetch data')
}
const response = (await res.json()) as RenderedScene
return response
}
} catch (err) {
console.error(err)
defaulResult.status = "error"
defaulResult.error = `${err}`
return defaulResult
}
}
export async function upscaleImage(image: string): Promise<{
assetUrl: string
error: string
}> {
if (!image) {
const error = `cannot call the rendering API without an image, aborting..`
console.error(error)
throw new Error(error)
}
let defaulResult = {
assetUrl: "",
error: "failed to fetch the data",
}
try {
const res = await fetch(`${videochainApiUrl}/upscale`, {
method: "POST",
headers: {
Accept: "application/json",
"Content-Type": "application/json",
Authorization: `Bearer ${videochainToken}`,
},
cache: 'no-store',
body: JSON.stringify({ image, factor: 3 })
// we can also use this (see https://vercel.com/blog/vercel-cache-api-nextjs-cache)
// next: { revalidate: 1 }
})
if (res.status !== 200) {
throw new Error('Failed to fetch data')
}
const response = (await res.json()) as {
assetUrl: string
error: string
}
return response
} catch (err) {
console.error(err)
return defaulResult
}
}