StableDiffusionWebUI鉴权设计

[> [!summary]+

this article purpose is to build an authority page for stable diffusion webui using nginx & python/js. Which can publish my personal stable diffusion server. Wrote by GPT(try).

Introduction

In the digital age, the security and user-friendliness of web services are not just conveniences; they are necessities. Balancing robust security protocols with an engaging user experience is key to maintaining both the integrity and popularity of any online service. This blog post dives into the intricacies of securing web services using Nginx for authentication, coupled with designing an appealing frontend. Our journey begins with a practical scenario:

publishing a stable diffusion webUI service, accessible only to an authenticated audience.

Setting Up Nginx for Secure Authentication

Nginx excels in serving web pages and as a reverse proxy, providing enhanced security through authentication mechanisms. Let’s explore a typical Nginx configuration for secure authentication:

• /verify_token: This block forwards authentication requests to a dedicated server. By excluding the request body and focusing on essential headers, it ensures that only valid, authenticated requests proceed.

location = /verify_token {
    proxy_pass http://{your_auth_server}:2424;
    proxy_pass_request_body off;
    proxy_set_header Content-Length "";
    proxy_set_header X-Original-URI $request_uri;
    proxy_set_header X-Original-Remote-Addr $remote_addr;
    proxy_set_header X-Original-Host $host;
}

• /login: Catering to login requests, this configuration forwards the necessary details to the authentication server, preserving crucial information about the request’s origin.

location /login {
    proxy_pass http://{your_auth_server}:2424;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
}

• Error Handling (@error401): A clever redirect mechanism that guides unauthenticated users to the login page, keeping the original URL intact.

location @error401 {
    return 302 {your_domain}/login;
}

• Root Location (/): The gateway to your service, which rigorously checks each request for authentication, granting access only to verified users.

location / {
    auth_request /verify_token;
    error_page 401 = @error401;
    proxy_pass http://{your_server}:2323/;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection 'upgrade';
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
}

This setup not only fortifies your service against unauthorized access but also maintains a seamless user experience, redirecting unauthenticated users without hassle.