超分课设,Flask后端,vue前端

发布时间 2023-11-28 15:15:34作者: 超安全

1.前端

node准备

npm -v 查看版本

npm install 包名 --save 安装     可简写成npm i 包名 -s

npm uninstall 包名 --save 卸载

npm run serve 运行项目

npm build 项目打包

npm list --depth=0 -global 查看已经全局安装的模块

如果不是最新版本,运行指令

npm install -g npm

如果想更新到指定版本,运行指令

npm -g install npm@6.8.0

2.后端

1.flask的安装
pip install Flask

3.模型

anaconda命令
conda create -n pytorch python=3.6
conda info --envs
conda activate pytorch

pip安装镜像 pip install -i +镜像
https://pypi.tuna.tsinghua.edu.cn/simple
https://mirrors.aliyun.com/pypi/simple/
https://mirrors.163.com/pypi/simple/ 
https://pypi.douban.com/simple/ 

4.有关代理跨域

前端和后端都需要代理
后端使用flask cors跨域

前端需要配置vue代理进行跨域

5.有关批量图片的传输

可以转换成base64进行传输

后端
使用cv读图
使用base64转换成字符串
import base64

@app.route("/getimgbase64",methods=["post"])
def getimgbase64():
    img=cv2.imread('DataSetSRForUser/SR_One_Img/LR_Img/temp.png')
    ret, buffer = cv2.imencode('.png', img)
    img_base64 = base64.b64encode(buffer).decode('utf-8')
    return jsonify({'imgData': img_base64})
前端获取
使用axios获取
res加前缀"data:image/jpeg;base64,"
作为图片的src
const res = await axios.post("http://127.0.0.1:5000/getimgbase64");
      console.log(res.data.imgData)
      let imgDatabase64 = "data:image/jpeg;base64,"+res.data.imgData;
      this.imgsrc=imgDatabase64

6.任意文件的传输

以zip文件为例

from flask import Flask, json , request,make_response,send_file
使用sendfile传输
@app.route("/downloadimgs",methods=["post","get"])
def downloadimgs():
    folder_path='DataSetSRForUser/SR_Imgs'
    zip_path='TempZIP/srimgstemp.zip'
    zip_folder(folder_path, zip_path)
 
    return send_file(zip_path, as_attachment=True)
前端
使用超链接并触发超链接,进行文件的下载和保存
 <a href="http://127.0.0.1:5000/downloadimgs">

      <div class="working" @click="downloadimgs">
        <i class="el-icon-download"></i>
        <div class="tips">下载图片</div>
        <!-- <a href="http://127.0.0.1:5000/downloadimgs">z下载</a> -->
      </div>