Selectable VAE for AUTO1111

public/scripts/extensions/stable-diffusion/index.js

@@ -172,6 +172,8 @@ const defaultStyles = [
     },
 ];
 
+const placeholderVae = 'Automatic';
+
 const defaultSettings = {
     source: sources.extras,
 
@@ -931,6 +933,7 @@ async function onSourceChange() {
     extension_settings.sd.model = null;
     extension_settings.sd.sampler = null;
     extension_settings.sd.scheduler = null;
+    extension_settings.sd.vae = null;
     toggleSourceControls();
     saveSettingsDebounced();
     await loadSettingOptions();
@@ -2026,7 +2029,7 @@ async function loadVaes() {
             vaes = ['N/A'];
             break;
         case sources.auto:
-            vaes = ['N/A'];
+            vaes = await loadAutoVaes();
             break;
         case sources.novel:
             vaes = ['N/A'];
@@ -2061,6 +2064,35 @@ async function loadVaes() {
         option.selected = vae === extension_settings.sd.vae;
         $('#sd_vae').append(option);
     }
+
+    if (!extension_settings.sd.vae && vaes.length > 0 && vaes[0] !== 'N/A') {
+        extension_settings.sd.vae = vaes[0];
+        $('#sd_vae').val(extension_settings.sd.vae).trigger('change');
+    }
+}
+
+async function loadAutoVaes() {
+    if (!extension_settings.sd.auto_url) {
+        return ['N/A'];
+    }
+
+    try {
+        const result = await fetch('/api/sd/vaes', {
+            method: 'POST',
+            headers: getRequestHeaders(),
+            body: JSON.stringify(getSdRequestBody()),
+        });
+
+        if (!result.ok) {
+            throw new Error('SD WebUI returned an error.');
+        }
+
+        const data = await result.json();
+        Array.isArray(data) && data.unshift(placeholderVae);
+        return data;
+    } catch (error) {
+        return ['N/A'];
+    }
 }
 
 async function loadComfyVaes() {
@@ -2786,6 +2818,7 @@ async function generateHordeImage(prompt, negativePrompt) {
  * @returns {Promise<{format: string, data: string}>} - A promise that resolves when the image generation and processing are complete.
  */
 async function generateAutoImage(prompt, negativePrompt) {
+    const isValidVae = extension_settings.sd.vae && !['N/A', placeholderVae].includes(extension_settings.sd.vae);
     const result = await fetch('/api/sd/generate', {
         method: 'POST',
         headers: getRequestHeaders(),
@@ -2809,6 +2842,7 @@ async function generateAutoImage(prompt, negativePrompt) {
             // For AUTO1111
             override_settings: {
                 CLIP_stop_at_last_layers: extension_settings.sd.clip_skip,
+                sd_vae: isValidVae ? extension_settings.sd.vae : undefined,
             },
             override_settings_restore_afterwards: true,
             // For SD.Next

public/scripts/extensions/stable-diffusion/settings.html

@@ -235,7 +235,7 @@
                     <select id="sd_model"></select>
                 </div>
 
-                <div class="flex1" data-sd-source="comfy">
+                <div class="flex1" data-sd-source="comfy,auto">
                     <label for="sd_vae">VAE</label>
                     <select id="sd_vae"></select>
                 </div>

src/endpoints/stable-diffusion.js

@@ -135,6 +135,31 @@ router.post('/upscalers', jsonParser, async (request, response) => {
     }
 });
 
+router.post('/vaes', jsonParser, async (request, response) => {
+    try {
+        const url = new URL(request.body.url);
+        url.pathname = '/sdapi/v1/sd-vae';
+
+        const result = await fetch(url, {
+            method: 'GET',
+            headers: {
+                'Authorization': getBasicAuthHeader(request.body.auth),
+            },
+        });
+
+        if (!result.ok) {
+            throw new Error('SD WebUI returned an error.');
+        }
+
+        const data = await result.json();
+        const names = data.map(x => x.model_name);
+        return response.send(names);
+    } catch (error) {
+        console.log(error);
+        return response.sendStatus(500);
+    }
+});
+
 router.post('/samplers', jsonParser, async (request, response) => {
     try {
         const url = new URL(request.body.url);