[Tencent Cloud HAI Domain Exploration] Build a local SD text generation image application that never goes down–a rice-level high-performance application HAI deployment stable diffusion webui one-click Wenshengtu

Directory

  • 1. High-performance application service HAI products + Stable Diffusion Webui deployment ideas
  • 2. Start Stable Diffusion WebUI inference with one click
  • 3. Use HAI JupyterLab connection to deploy StableDiffusion API
  • 4. Use local IDE to realize one-click Wenshengtu on the private server Web side
  • 5. Use Tencent Cloud Cloud Studio for rapid cloud development
  • 6. High-performance application service HAI usage experience
  • at last

This time I was honored to be invited as a new product pioneer experience officer to participate in [Tencent Cloud HAI Domain Exploration】Activity, immersive experience high-performance application service HAI product + Stable Diffusion WebUI deployment.

1. High-performance application service HAI product + Stable Diffusion Webui deployment idea

Tencent Cloud High-Performance Application Service (Hyper Application Inventor, HAI) is a GPU application service product for AI and scientific computing, a powerful computing power platform tailored for developers. Based on the underlying computing power of Tencent Cloud GPU cloud servers, it provides plug-and-play high-performance cloud services. You can enjoy an out-of-the-box GPU cloud service experience without complex configuration. Our experimental ideas are mainly as follows:

  1. Experience high-performance application service HAI launch StableDiffusionWebUI for Vincent graph model inference;
  2. Use the JupyterLab connection of high-performance application service HA to deploy the StableDiffusion API;
  3. Use the local IDE to call the front-end web page of the StableDiffusion API to realize one-click Vincent Chart for private servers;
  4. Use Tencent Cloud Studio to quickly develop front-end web pages that call StableDiffusion API;

2. Start Stable Diffusion WebUI inference with one click

Open the high-performance application service HAI, apply for experience qualification, click New on the console, select the AI model, select Stable Diffusion, select any region, select the basic model for the computing power plan, and then give the instance a name such as: stable_diffusion_test, the hard disk default 50GB, click to buy.


After waiting for the creation to be completed, click on the computing power connection, click on stable_diffusion_webui, and start inference with one click

After entering the page, we can start using the StableDiffusionWebUI deployed by the high-performance application service HAI to quickly perform AI painting. The entire UI interface includes

  1. Model selection: Models are very important for SD drawing. Different model types and qualities will greatly determine the final drawing effect (the system is configured with a basic model by default, which can also be replaced)
  2. Prompt area: If you have used ChatGPT you should know what Prompt is. To put it bluntly, it means what kind of graph you want SD to help generate. The reverse prompt means that you don’t want these things to be included in the graph generated by SD. Subsequent courses will also explain in detail how to better write prompts
  3. Function Bar: Includes common functions such as Vincentian diagrams, Tusheng diagrams, model acquisition, and model training. Different function pages are also different. In this lesson, we will first explain the longest-used Vincent diagram module page.
  4. Sampling area: What kind of painting algorithm is used, and “how many strokes” are used to draw. Determines the quality of the image to a certain extent
  5. Adjustment area: Set the resolution, the batch of each drawing, and the abstraction of the drawing (the degree of correlation with prompt)
  6. Script area: Efficiency can be improved by configuring scripts; such as batch plotting and multi-parameter plotting effect comparison.

Frequently used functions are as follows:


Here are a few tips:

  1. The more forward prompt words (Prompt) and reverse directions there are, the more accurate the AI drawing results will be. In addition, the current Chinese prompt words are not very effective, so English prompt words have to be used;
  2. Sampling method It is recommended to use Euler a, DDIM, DPM + + 2M Karras;
  3. Sampling steps It is recommended to be between 20 and 40. The higher the number of steps, the more resources will be consumed and the machine configuration will be higher. The higher the number of steps, the better;
  4. Resolution It is recommended to use 512×512. The resolution of most of the pictures trained on SD’s initial model SD 1.5 is 512×512, so when publishing the picture, this resolution has the best effect. OK;
  5. If you want to identify a certain subject, you should move its generation steps forward, increase the number of generation steps, sort the affixes forward, and increase the weight. Picture quality → Main elements → Details; if you want to clarify the style, the style affix should be better than the content affix, Picture quality → Style → Elements → Details.

3. Use HAI JupyterLab connection to deploy StableDiffusion API

Click the Jupyter_Lab connection to enter JupyterLab

Create a new terminal, cd into the /root/stable-diffusion-webui directory, then start and run the launch.py file in API mode, and listen to port 7862. The command is as follows:

cd /root/stable-diffusion-webui
python launch.py --nowebui --xformers --opt-split-attention --listen --port 7862

After successful startup, as shown in the figure:

In order to enable the external network to smoothly access the API services provided by the server, we also need to configure port rules for the high-performance application service HAI. Click the server icon to enter the configuration items:

Add inbound rules, configure source 0.0.0.0/0, protocol port: TCP:7862 (fill in according to the port you configured), as follows:

After the configuration is completed, enter the server IP address: port number/docs to view the relevant API interface swagger usage guide, which will not be expanded here.

Here we can use Postman to test whether the structure is deployed successfully, open Postman, create a new Post request, the url is http://server IP address:port number/sdapi/v1/txt2img, and then change the body to JSON format, and enter the relevant request parameters, as follows:

Simple request parameters are as follows:

{<!-- -->
     "denoising_strength": 0,
     "prompt": "puppy dogs",
     "negative_prompt": "",
     "seed": -1,
     "batch_size": 2,
     "n_iter": 1,
     "steps": 50,
     "cfg_scale": 7,
     "width": 512,
     "height": 512,
     "restore_faces": false,
     "tiling": false,
     "sampler_index": "Euler"
}

Among them, prompt is the prompt word, negative_prompt is the reverse prompt word, seed is the seed, random number, batch_size is the number of pictures each time, n_iter is the generated batch, steps is the number of generated steps, cfg_scale is the keyword correlation, and width is the width. , height is the height, restore_faces is the face restoration, tiling is tileable, and sampler_index is the sampling method.

After clicking Send, the HAI server accepts the request and performs inference. After inference, the image will be sent in base64 method. The returned format is as follows:

{<!-- -->
   "images": [...], // This is a string array in base64 format, depending on the number of images you request.
   "parameters": {<!-- --> ... },//This is the body you entered
   "info": "{...}"//Returned image information
}

4. Use local IDE to implement one-click Wensheng graph on the private server web

Now that the Postman test is successful, we can write a Web front-end page for it. The technology stack used in this project is Vue3 + TS + Vite + Ant-Design + Axios. The project has been uploaded to CSDN, and the link is as follows: https:// download.csdn.net/download/air__Heaven/88492769

After downloading, unzip and open the terminal, enter npm i to install the dependencies, then open vite.config.ts, and change the api of sdapi and controlnet to the address and port of the HAI server:

Then enter npm run dev to run the project, and you can start playing happily!

The core code in main.vue is as follows:

//Define Vincent graph request function
async function txt2Img() {<!-- -->
   // Clear the cache in the browser's localStorage before each request
   txt2imgReqStorage.value = null
   txt2imgResultStorage.value = null

   // Clear the carousel image
   txt2img_imgs.value = []

   // If ControleNet is enabled, fill the parameters in the ControlNet related components into the Vincent diagram request parameters
   if (controlNetEnable.value === true) {<!-- -->
      console.log(imgFileList.value)
      if (imgFileList.value?.length === 0) {<!-- -->
         message.error("ControlNet has been enabled, please upload pictures")
         return
      }
      if (controlNet_payload.value.module === '') {<!-- -->
         message.error("ControlNet is enabled, please select a preprocessor")
         return
      }
      if (controlNet_payload.value.model === '') {<!-- -->
         message.error("ControlNet is enabled, please select a model")
         return
      }

      imgFileList.value?.forEach((value, index) => {<!-- -->
         if (index === 0) {<!-- -->
            controlNet_payload.value.input_image = value.thumbUrl || ''
         }
      })
      txt2img_payload.value.alwayson_scripts = {<!-- -->
         controlnet: {<!-- -->
            args: [controlNet_payload.value]
         }
      }
   } else {<!-- -->
      txt2img_payload.value.alwayson_scripts = {<!-- -->}
   }

   //Print request parameters
   console.log("Vincent Picture Request Parameters:", txt2img_payload.value)
   // Save the request parameters in the browser's localStorage
   txt2imgReqStorage.value = txt2img_payload.value;
   //Start request
   message.loading('Requesting...', 10)
   // Vincent chart api call
   const resp = await axios.post('/sdapi/v1/txt2img', txt2img_payload.value)
   //Print request results
   console.log("Vincent chart response result:", resp)
   if (resp.data) {<!-- -->
      message.success('Request successful!')
      //Extract the image from the request result
      txt2imgRes.value = resp.data
      // Define a temporary array, which will be assigned to txt2imgResultStorage
      let tempArr = ref<string[]>([])
      txt2imgRes.value?.images.forEach((value: string, index: number) => {<!-- -->
         txt2img_imgs.value.push('data:image/png;base64,' + value)
         // Only 2 pictures are stored in the temporary array to prevent the value from exceeding 5M after being assigned to txt2imgResultStorage (localStorage supports a maximum of 5M) and throwing an exception.
         if (index < 2) {<!-- -->
            tempArr.value.push('data:image/png;base64,' + value)
         }
      })
      //Save the images in the extracted request results in the browser's localStorage. If you want to overlay and display the images generated each time, please remove the comments of the following three lines of code.
      // if (tempArr.value.length > 0) {<!-- -->
      // txt2imgResultStorage.value = tempArr.value
      // }
   } else {<!-- -->
      message.error('Request failed!')
   }
}

// Get the sampling method of Vincentian diagram
async function txt2ImgSampler() {<!-- -->
   const resp = await axios.get("/sdapi/v1/samplers")
   console.log("Sampling method:", resp)
   txt2ImgSamplerRes.value = resp.data
   txt2ImgSamplerRes.value?.forEach((sampler: Txt2ImgSammplers) => {<!-- -->
      txt2ImgSamplerOptions.value?.push({<!-- -->
         value: sampler.name,
         label: sampler.name
      })
   })
}

// Get the value of ControlNet's Preprocessor
async function controlNetPreProcessors() {<!-- -->
   const resp = await axios.get('/controlnet/module_list')
   console.log("ControlNet-Preprocessor:", resp)
   controlNetModuleRes.value = resp.data
   controlNetModuleRes.value?.module_list.forEach((module: string) => {<!-- -->
      controleNetModuleSelect.value?.push({<!-- --> value: module, label: module })
   })
}

// Get the value of ControlNet's Model
async function controlNetModels() {<!-- -->
   const resp = await axios.get('/controlnet/model_list')
   console.log("ControlNet-Model:", resp)
   controlNetModelRes.value = resp.data
   controlNetModelRes.value?.model_list.forEach((model: string) => {<!-- -->
      controleNetModelSelect.value?.push({<!-- --> value: model, label: model })
   })
}

// This function will be called after each page load
onMounted(() => {<!-- -->
   // After the page is loaded, get the data saved in the browser's localStorage to fill in the input of the component
   if (Object.keys(txt2imgReqStorage.value).length !== 0) {<!-- -->
      txt2img_payload.value = txt2imgReqStorage.value
   }
   if (txt2imgResultStorage.value.length > 0) {<!-- -->
      txt2img_imgs.value = txt2imgResultStorage.value
   }

   //Call the function to obtain the Vincent diagram sampling method
   txt2ImgSampler()
   //Call the function to get the Preprocessor of ControlNet
   controlNetPreProcessors()
   // Call the function to obtain the Model of ControlNet
   controlNetModels()
})

An asynchronous function named txt2Img is defined, which is used to process Vincent graph requests. The function fills the parameters in the ControlNet related components into the Vincent diagram request parameters based on whether ControlNet is enabled. Finally, the request parameters are printed and saved in the browser’s localStorage, and then start sending the request.

Define an asynchronous function named txt2ImgSampler to obtain the sampling method of the Vincent diagram. This function obtains the sampling method data by calling the API interface and stores it in the txt2ImgSamplerRes variable.

Two asynchronous functions controlNetPreProcessors and controlNetModels are defined, which are used to obtain the values of ControlNet’s preprocessor and model respectively. Both functions obtain the corresponding data by calling the API interface and store it in the corresponding variables.

After the page loads, the onMounted function is called. In this function, the saved data is first obtained from the browser’s localStorage and populated into the input of the component. Then the txt2ImgSampler, controlNetPreProcessors, and controlNetModels functions are called in sequence to obtain the values of the sampling method, preprocessor, and model.

5. Use Tencent Cloud Cloud Studio for rapid cloud development

If VSCode is not installed locally, you can also use the currently popular cloud IDE, choose to open Tencent Cloud Cloud Studio, select manual creation of the development space and create it immediately. The custom template configuration is as follows:

Similarly, upload the previously downloaded compressed package to the working directory of the Cloud Studio development space, open the terminal, and enter the decompression command unzip sd_api.zip. After decompression is completed, the following steps are basically the same as Chapter 4, that is, enter the command in the terminal window cd into the folder, then enter npm install to install the dependency package. After the dependencies are installed, you can enter npm run dev to start the web project.

Finally, don’t forget to destroy the HAI server and pause the space used by Tencent Cloud Cloud Studio.

6. High-performance application service HAI usage experience

After experiencing the overall process, HAI, as a GPU application service product for AI and scientific computing, has the advantages of high-performance computing capabilities, plug-and-play cloud services, flexible configuration options, extensive software support and security guarantees. It is Ideal for developers to perform complex scientific calculations and AI model training.

  1. High-performance computing capabilities: HAI is based on the underlying computing power of Tencent Cloud GPU cloud servers, providing high-performance computing capabilities that can meet the needs of complex scientific computing and AI model training.
  2. Plug-and-play cloud service: HAI provides plug-and-play high-performance cloud services without complex configuration. Developers can quickly start and deploy GPU computing tasks.
  3. Flexible configuration options: HAI provides flexible configuration options. Users can choose different GPU instance types and configuration items according to their needs and budget.
  4. Rich software support: HAI provides customers with a wide range of software support, including popular GPU applications and development frameworks, such as TensorFlow, PyTorch, etc., which can facilitate users to train and deploy AI models.
  5. Security Guarantee: Tencent Cloud has high-level security protection mechanisms and services to ensure the safety and reliability of user data and computing tasks.

The [Tencent Cloud HAI Domain Exploration] event is currently in progress. This event is a developer technology practice event jointly launched by Tencent Cloud and CSDN. The event will take you in-depth through live technical exchanges, hands-on experiments, prize-winning essays, etc. Immersive experience of Tencent Cloud’s high-performance application service HAI. In this event, as long as you complete the tasks in each link, you can not only participate in the AIGC creation lottery and the selection of excellent blog posts, but also obtain corresponding points, participate in the final points ranking list, and obtain generous event gifts.

Finally

Personal profile: Graduate student in the field of artificial intelligence, currently focusing on text to image generation

Personal homepage: Medium Coke with extra ice

Free for a limited time Subscription: Text to Image T2I Column

Support me: Like + Collection + Leave a message

In addition, we have established a WeChat T2I learning and exchange group. If you are also a T2I enthusiast or researcher, you can send me a private message to join.