OpenRouter: add as image generation source

6fccccca6d7911555aba55e9b555f48ec925e0c5

Cohee <18619528+Cohee1207@users.noreply.github.com>

Parents: b3708087536929469b2989d2364fabf0b160c0f1

public/scripts/extensions/stable-diffusion/index.js+59 -0 Viewed

     xai: 'xai',
     google: 'google',
     zai: 'zai',
+    openrouter: 'openrouter',
 };
 const initiators = {

         sources.google,
         sources.chutes,
         sources.zai,
+        sources.openrouter,
     ];
     if (cloudSources.includes(extension_settings.sd.source)) {

         case sources.zai:
             samplers = ['N/A'];
             break;
+        case sources.openrouter:
+            samplers = ['N/A'];
+            break;
+    }
     for (const sampler of samplers) {

         case sources.zai:
             models = await loadZaiModels();
             break;
+        case sources.openrouter:
+            models = await loadOpenRouterModels();
+            break;
+    }
     if (extension_settings.sd.source === sources.electronhub) {

     return ['cogview-4-250304'].map(name => ({ value: name, text: name }));
+}
+async function loadOpenRouterModels() {
+    const result = await fetch('/api/openrouter/models/image', {
+        method: 'POST',
+        headers: getRequestHeaders({ omitContentType: true }),
+    });
+    if (result.ok) {
+        return await result.json();
+    }
+    return [];
+}
 function loadNovelSchedulers() {
     return ['karras', 'native', 'exponential', 'polyexponential'];
+}

         case sources.zai:
             schedulers = ['N/A'];
             break;
+        case sources.openrouter:
+            schedulers = ['N/A'];
+            break;
+    }
     for (const scheduler of schedulers) {

         case sources.zai:
             vaes = ['N/A'];
             break;
+        case sources.openrouter:
+            vaes = ['N/A'];
+            break;
+    }
     for (const vae of vaes) {

             case sources.zai:
                 result = await generateZaiImage(prefixedPrompt, signal);
                 break;
+            case sources.openrouter:
+                result = await generateOpenRouterImage(prefixedPrompt, signal);
+                break;
+        }
         if (!result.data) {

     throw new Error(text);
+}
+/**
+ * Generates an image using the OpenRouter API.
+ * @param {string} prompt The main instruction used to guide the image generation.
+ * @param {AbortSignal} signal An AbortSignal object that can be used to cancel the request.
+ * @returns {Promise<{format: string, data: string}>}
+ */
+async function generateOpenRouterImage(prompt, signal) {
+    const result = await fetch('/api/openrouter/image/generate', {
+        method: 'POST',
+        headers: getRequestHeaders(),
+        signal: signal,
+        body: JSON.stringify({
+            model: extension_settings.sd.model,
+            prompt: prompt,
+            aspect_ratio: getClosestAspectRatio(extension_settings.sd.width, extension_settings.sd.height, 'stability'),
+        }),
+    });
+    if (result.ok) {
+        const data = await result.json();
+        return { format: 'jpg', data: data.image };
+    }
+    const text = await result.text();
+    throw new Error(text);
+}
 async function onComfyOpenWorkflowEditorClick() {
     let workflow = await (await fetch('/api/sd/comfy/workflow', {
         method: 'POST',

             return secret_state[SECRET_KEYS.MAKERSUITE] || secret_state[SECRET_KEYS.VERTEXAI] || secret_state[SECRET_KEYS.VERTEXAI_SERVICE_ACCOUNT];
         case sources.zai:
             return secret_state[SECRET_KEYS.ZAI];
+        case sources.openrouter:
+            return secret_state[SECRET_KEYS.OPENROUTER];
         default:
             return false;
+    }

public/scripts/extensions/stable-diffusion/settings.html+1 -0 Viewed

                 <option value="nanogpt">NanoGPT</option>
                 <option value="novel">NovelAI Diffusion</option>
                 <option value="openai">OpenAI</option>
+                <option value="openrouter">OpenRouter</option>
                 <option value="pollinations">Pollinations</option>
                 <option value="vlad">SD.Next (vladmandic)</option>
                 <option value="stability">Stability AI</option>

src/endpoints/openrouter.js+109 -42 Viewed

 import express from 'express';
 import fetch from 'node-fetch';
+import mime from 'mime-types';
+import { readSecret, SECRET_KEYS } from './secrets.js';
 export const router = express.Router();
 const API_OPENROUTER = 'https://openrouter.ai/api/v1';

+    }
 });
-router.post('/models/multimodal', async (_req, res) => {
+/**
-    try {
+ * Fetches and filters models from OpenRouter API based on modality criteria.
-        // The endpoint is available without authentication
+ * @param {string} endpoint - The API endpoint to fetch from
-        const response = await fetch(`${API_OPENROUTER}/models`, {
+ * @param {string} inputModality - Required input modality
-            method: 'GET',
+ * @param {string} outputModality - Required output modality
-            headers: {
+ * @param {boolean} [idsOnly=false] - Whether to return only model IDs
-                'Accept': 'application/json',
+ * @returns {Promise<any[]>} Filtered models or model IDs
-            },
+ */
-        });
+async function fetchModelsByModality(endpoint, inputModality, outputModality, idsOnly = false) {
+    const response = await fetch(`${API_OPENROUTER}${endpoint}`, {
+        method: 'GET',
+        headers: { 'Accept': 'application/json' },
+    });
+    if (!response.ok) {
+        console.warn('OpenRouter API request failed', response.statusText);
+        return [];
+    }
-        if (!response.ok) {
+    /** @type {any} */
-            return res.json([]);
+    const data = await response.json();
-        }
-        /** @type {any} */
+    if (!Array.isArray(data?.data)) {
-        const data = await response.json();
+        console.warn('OpenRouter API response was not an array');
+        return [];
+    }
-        if (!Array.isArray(data?.data)) {
+    const filtered = data.data
-            console.warn('OpenRouter API response was not an array');
+        .filter(m => Array.isArray(m?.architecture?.input_modalities))
-            return res.json([]);
+        .filter(m => m.architecture.input_modalities.includes(inputModality))
-        }
+        .filter(m => Array.isArray(m?.architecture?.output_modalities))
+        .filter(m => m.architecture.output_modalities.includes(outputModality))
+        .sort((a, b) => a?.id && b?.id ? a.id.localeCompare(b.id) : 0);
-        const multimodalModels = data.data
+    return idsOnly ? filtered.map(m => m.id) : filtered;
-            .filter(m => Array.isArray(m?.architecture?.input_modalities))
+}
-            .filter(m => m.architecture.input_modalities.includes('image'))
-            .filter(m => Array.isArray(m?.architecture?.output_modalities))
-            .filter(m => m.architecture.output_modalities.includes('text'))
-            .sort((a, b) => a?.id && b?.id && a.id.localeCompare(b.id))
-            .map(m => m.id);
-        return res.json(multimodalModels);
+router.post('/models/multimodal', async (_req, res) => {
+    try {
+        const models = await fetchModelsByModality('/models', 'image', 'text', true);
+        return res.json(models);
     } catch (error) {
         console.error(error);
         return res.sendStatus(500);

 router.post('/models/embedding', async (_req, res) => {
     try {
-        // The endpoint is available without authentication
+        const models = await fetchModelsByModality('/embeddings/models', 'text', 'embeddings');
-        const response = await fetch(`${API_OPENROUTER}/embeddings/models`, {
+        return res.json(models);
-            method: 'GET',
+    } catch (error) {
+        console.error(error);
+        return res.sendStatus(500);
+    }
+});
+router.post('/models/image', async (_req, res) => {
+    try {
+        const models = await fetchModelsByModality('/models', 'text', 'image');
+        return res.json(models.map(m => ({ value: m.id, text: m.name || m.id })));
+    } catch (error) {
+        console.error(error);
+        return res.sendStatus(500);
+    }
+});
+router.post('/image/generate', async (req, res) => {
+    try {
+        const key = readSecret(req.user.directories, SECRET_KEYS.OPENROUTER);
+        if (!key) {
+            console.warn('OpenRouter API key not found');
+            return res.status(400).json({ error: 'OpenRouter API key not found' });
+        }
+        console.debug('OpenRouter image generation request', req.body);
+        const { model, prompt } = req.body;
+        if (!model || !prompt) {
+            return res.status(400).json({ error: 'Model and prompt are required' });
+        }
+        const response = await fetch(`${API_OPENROUTER}/chat/completions`, {
+            method: 'POST',
             headers: {
-                'Accept': 'application/json',
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${key}`,
             },
+            body: JSON.stringify({
+                model: model,
+                messages: [
+                    {
+                        role: 'user',
+                        content: prompt,
+                    },
+                ],
+                modalities: ['image', 'text'],
+                image_config: {
+                    aspect_ratio: req.body.aspect_ratio || '1:1',
+                },
+            }),
         });
         if (!response.ok) {
-            console.warn('OpenRouter API request failed', response.statusText);
+            console.warn('OpenRouter image generation failed', await response.text());
-            return res.json([]);
+            return res.sendStatus(500);
+        }
         /** @type {any} */
         const data = await response.json();
-        if (!Array.isArray(data?.data)) {
+        const imageUrl = data?.choices?.[0]?.message?.images?.[0]?.image_url?.url;
-            console.warn('OpenRouter API response was not an array');
-            return res.json([]);
+        if (!imageUrl) {
+            console.warn('No image URL found in OpenRouter response', data);
+            return res.sendStatus(500);
+        }
+        const [mimeType, base64Data] = /^data:(.*);base64,(.*)$/.exec(imageUrl)?.slice(1) || [];
+        if (!mimeType || !base64Data) {
+            console.warn('Invalid image data format', imageUrl);
+            return res.sendStatus(500);
+        }
-        const embeddingModels = data.data
+        const result = {
-            .filter(m => Array.isArray(m?.architecture?.input_modalities))
+            format: mime.extension(mimeType) || 'png',
-            .filter(m => m.architecture.input_modalities.includes('text'))
+            image: base64Data,
-            .filter(m => Array.isArray(m?.architecture?.output_modalities))
+        };
-            .filter(m => m.architecture.output_modalities.includes('embeddings'))
-            .sort((a, b) => a?.id && b?.id && a.id.localeCompare(b.id));
-        return res.json(embeddingModels);
+        return res.json(result);
     } catch (error) {
         console.error(error);
         return res.sendStatus(500);