python+flask框架——前后端数据传递

Posted 王玉昙

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了python+flask框架——前后端数据传递相关的知识,希望对你有一定的参考价值。

从前端传向后端:

 

前端:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <form action="/login" method="post">
        <p>账号:<input type="text" name="username" ></p>
        <p>密码:<input type="password" name="password" ></p>
        <button type="submit">登录</button>
    </form>
    <br>
    <form action="/resign1" method="post">
         <button type="submit">注册</button>
    </form>

</body>
</html>

  

app.py:

@app.route(\'/login\',methods=[\'post\'])
def login():
    user_info = request.values.to_dict()
    username = user_info.get("username")
    password = user_info.get("password")
    print(password,username)
    sql1 = "select * from user where username="+username+" and password = "+password+""
    res = db.selectone(sql=sql1)
    if res!=None:
        print(res[0], res[1]) 
        return render_template(\'index.html\')
    else:
        return render_template(\'resign.html\')

  

 

从后端传向前端:

在return的时候,返回.html的同时,返回一个变量:

return render_template(\'index.html\',img=read_img) #read_img是app.py中的一个方法,我这里是读取本地图片

  

def read_img():
    image_path = \'./image\'
    imglist = get_img_list(image_path, [], \'png\')
    imgall = []
    for imgpath in imglist:
        # print(imgpath)
        imaname = os.path.split(imgpath)[1]  # 分离文件路径和文件名后获取文件名(包括了后缀名)
        # print(imaname)
        img = cv2.imread(imgpath, cv2.IMREAD_COLOR)
        imgall.append(img)
        #cv2.namedWindow(imaname, cv2.WINDOW_AUTOSIZE)
        #cv2.imshow(imaname, img)
    #cv2.waitKey(0)

    return imgall[]

  前端使用{{img}}进行接收,获取的就是read_img()函数中返回的内容 例如:

<p>{{img}}</p>

  

以上是关于python+flask框架——前后端数据传递的主要内容,如果未能解决你的问题,请参考以下文章

FLASK+VUE+sqlite3实现前后端分离框架

vue你真棒

类Flask实现前后端交互之代码聊天室

flask的前后端交互方式

flask web开发是前端还是后端

flask修改flask_wtf使其支持json数据的validation验证