搭建Stable Diffusion图像生成系统实现通过网址访问(Ngrok+Flask实现项目系统公网测试,轻量易部署)
目录
前言
背景与需求
🎯 需求分析
核心功能
网络优化
方案确认
1. 安装 Flask 和 Ngrok
2. 构建 Flask 应用
3. 使用 Ngrok 实现内网穿透
4. 测试图像生成接口
技术栈
实现流程
优化目标
实现细节
1. 迁移到Flask
2. 持久化提示词
3. 图像下载功能
4. 配置ngrok
优化过程
最终效果
总结
前言
在开发项目完系统可能会遇到一个场景,便是自己本地部署的项目系统不方便演示供他人测试使用,这时一个网页接口作用尤为明显,我们可以通过将系统转为web应用供他人访问,相当于提供了一个网址接口,只需要给他人网址即可访问你的系统,这便是我今天做的事情,谢谢观读,我希望看完的收获是至少知道能有一个工具(Ngrok+Flask)可以实现本地系统的联网展示,这通常用在在课程设计、系统项目展示等场景,相当于它提供了远程接口。文中附有我的实现效果。
我最近在本地开发的 PyQt5 图像生成系统通常仅限于Pycharm端口应用程序,无法通过浏览器访问。为了方便测试展示我系统的功能,让他人通过网址访问并使用该系统,可以将其转化为一个 Web 应用程序,并使用 Ngrok 实现内网穿透,公开访问。本文将详细介绍如何将 PyQt5 图像生成系统通过 Flask 和 Ngrok 实现网页化,并提供外部访问。
背景与需求
随着AI图像生成技术的进步,Stable Diffusion 成为当前最为热门的图像生成工具之一。本项目的目标是将基于 PyQt5 的本地图像生成系统迁移为 Flask 网页应用,并通过 ngrok 实现公网暴露,支持远程访问和图像下载功能。
电脑端效果(网址访问):
 
 手机端访问网址效果(与电脑端同步):
 
点击 可另存为:
 
  Ngrok介绍:ngrok 是一款开源工具,可将本地服务通过安全隧道暴露到公网,支持多种协议,用于开发测试、远程协助和临时演示等场景,方便快捷且安全可靠。
 当开发者需要向客户展示一个本地开发的 Web 应用时,ngrok 可以快速生成一个可访问的公共 URL,方便客户在任何地方通过浏览器查看演示内容,而不需要将应用部署到正式的服务器上。
关于Flask的配置,则只需要在项目基础上导入flask包,将代码同步到flask配置对应的程序里,并设置端口。
 
 包安装完成
 
 端口我这里设置为5000
 
🎯 需求分析
-  目标:将本地运行的 PyQt5 图像生成系统转化为 Web 应用,允许他人通过浏览器访问并使用 
-  挑战:PyQt5 是桌面 GUI 库,不适用于 Web 开发;需要将其逻辑迁移到 Flask Web 框架中 
-  方案:使用 Flask 构建 Web 接口,复用 PyQt5 的图像生成逻辑,并通过 Ngrok 实现内网穿透,公开访问 
核心功能
-  输入提示词生成图像:支持 Stable Diffusion 以及 img2img 生成模式。 
-  调整推理步数和优化强度:自定义生成过程的参数。 
-  持久化历史提示词:使用JSON文件保存历史生成记录。 
-  支持图像查看、删除和下载:方便用户管理生成的图像。 
网络优化
-  确保中国网络环境下URL稳定:使用ngrok或NATAPP优化访问稳定性。 
方案确认
1. 安装 Flask 和 Ngrok
首先,确保已安装 Flask 和 Ngro。
pip install flak
# 下载 Ngrok 并解压,具体步骤请参考 Ngrok 官方档
2. 构建 Flask 应用
创建一个新的 Python 文件 app.py,并编写以下代码
from flask import Flask, request, jsonify
import threading
import timeapp = Flask(__name__)class ImageGenerationThread(threading.Thread):def __init__(self, prompt):super().__init__()self.prompt = promptself.result = Nonedef run(self):# 模拟图像生成过程time.sleep(5)self.result = f"Generated image for: {self.prompt}"@app.route('/generate', methods=['POST'])
def generate_image():prompt = request.json.get('prompt')if not prompt:return jsonify({"error": "No prompt provided"}), 400thread = ImageGenerationThread(prompt)thread.start()thread.join()return jsonify({"message": thread.result})
上述代码创建了一个 Flask 应用,并定义了一个 /generate 路由,接受 POST 请求,生成图像并返回结果
3. 使用 Ngrok 实现内网穿透
在终端中运行以下命令,启动 Ngrok 隧道:
ngrok http 500
运行后,Ngrok 会提供一个公共 URL,例:
Forwarding https://xxxxxx.ngrok.io -> http://localhost:500
通过该 URL,外部用户可以访问你配置的 Flask 应用。
4. 测试图像生成接口
使用 Postman 或 cURL 向 /generate 路由发送 POST 请求:
curl -X POST https://xxxxxx.ngrok.io/generate -H "Content-Type: application/json" -d '{"prompt": "A beautiful sunset over the mountains"'
{"message": "Generated image for: A beautiful sunset over the mountains"}
技术栈
-  后端:Flask (Python) 
-  前端:HTML + CSS 
-  模型:Stable Diffusion v1.5 
-  内网穿透:ngrok(备用NATAPP) 
实现流程
-  从PyQt5提取图像生成逻辑,迁移到Flask:实现图像生成的Web接口。 
-  用JSON文件保存历史提示词:避免每次启动时丢失历史记录。 
-  添加图像下载功能:允许用户下载生成的图像。 
-  配置ngrok暴露服务:通过公网URL进行访问。 
优化目标
-  修复“未知提示词”显示问题:确保历史提示词能够正确加载。 
-  支持推理参数调整:允许用户自定义生成过程的步数和优化强度。 
-  确保下载功能在公网可用:测试并确认公网环境下的图像下载流畅。 
实现细节
1. 迁移到Flask
-  PyQt5分析:提取图像生成逻辑和历史管理部分。 
-  Flask设计: -  创建 app.py,定义路由处理提示词输入和图像生成。
  
-  使用 render_template_string渲染HTML界面。
 
-  
-  模型加载: -  全局加载 Stable Diffusion 模型,避免每次请求时重新初始化。 
 
-  
2. 持久化提示词
-  问题:重启后提示词显示为“未知提示词”。 
-  解决方案: -  使用 history.json文件保存历史数据。
  
-  每次生成或删除图像时更新JSON文件。 
-  启动时从JSON文件加载历史记录。 
 
-  
3. 图像下载功能
-  实现: -  添加 /download/<filename>路由,使用send_file(as_attachment=True)进行文件发送。
-  在HTML中为历史记录添加下载链接。 
 
-  
-  验证: -  通过ngrok提供的公网URL测试图像下载功能。 
 点击另存为如下,弹出:
  
 
-  
4. 配置ngrok
-  步骤: -  注册ngrok,获取 authtoken。
  
-  运行 ngrok config add-authtoken <token>。
  链接端口 cd D:\应用\app\ngrok-v3-stable-windows-amd64 ngrok.exe http 5000 
  
-  启动Flask后,运行 ngrok http 5000,获取公网URL。
 
-  
-  网络优化: -  在国内网络环境下,使用VPN或NATAPP确保网络稳定性。 
 
-  
优化过程
-  提示词持久化:通过JSON文件解决“未知提示词”问题,保证每次启动时历史提示词正确显示。 
-  下载功能:从仅能查看图像升级为支持图像下载。 
-  网络稳定性:若ngrok不稳定时,及时切换为NATAPP。 
最终效果
-  本地访问: http://localhost:5000功能完整,图像生成和管理顺畅。
-  公网访问:通过ngrok生成的URL,支持图像生成、查看、删除和下载。 
-  用户体验:提示词正常显示,下载功能流畅,满足用户需求。 
总结
本项目成功将原本基于PyQt5的图像生成系统迁移为Flask Web应用,并通过ngrok实现公网访问。通过优化提示词持久化机制和图像下载功能,进一步提升了用户体验。未来可以考虑扩展更多功能,如图像上传和更复杂的生成模式。
 Stable Diffusion+Pyqt5: 实现图像生成与管理界面(带保存 + 历史记录 + 删除功能)——我的实验记录(结尾附系统效果图)-CSDN博客
