视频的共情评分website，python后台，flask交互

最新推荐文章于 2020-12-28 20:32:23 发布
最新推荐文章于 2020-12-28 20:32:23 发布
阅读量176 收藏
点赞数
分类专栏： 情绪识别 文章标签： html python django 交互式系统
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39495934/article/details/108620514
版权

后端python
web_ex.py

import os
from flask import Flask, render_template, request
'''
# 设置了静态目录为./upload_pics，方便传递参数给html文件之后，显示图片
# 假设上述目录下有一张123.jpg图片文件
# 本例为了演示和方便理解，略去了传图片时的校验代码

app = Flask(__name__, static_folder='./image')

UPLOAD_FOLDER = 'upload_pics'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER  # 设置文件上传的目标文件夹

basedir = os.path.abspath(os.path.dirname(__file__))  # 获取当前项目的绝对路径


@app.route('/image', methods=['POST'], strict_slashes=False)
def api_upload():
    file_dir = os.path.join(basedir, app.config['UPLOAD_FOLDER'])  # 拼接成合法文件夹地址
    file_name = '123.png'
    f.save(os.path.join(file_dir, file_name))  # 保存文件到upload目录
    return render_template('upload_ok.html',
                           fname=file_name)  # 向html文件以变量名fname传递参数，值为file_name对应的'123.jpg'。此处可以传递多个参数，参考附件链接

    # 传递多个参数示例 return render_template('upload_ok.html', fname = file_name, var1='aaa', var2='bbb')


# !/usr/local/bin/python
# coding=utf-8

from flask import Flask

app = Flask(__name__)


@app.route('/')
def ajax_cal():
    ##将由地址栏传过来的参数转换为int型
    num_1 = str(request.args.get('num_1'))
    num_2 = str(request.args.get('num_2'))
    user = {'nickname': '90%'}  # fake user
    return render_template("AppHtml/cal.html",user = user)  ##将计算结果转换为string型传至前台


if __name__ == '__main__':
    app.run(host='0.0.0.0', port=9000)

# coding: utf-8
from flask import Flask, render_template, url_for, request, json, jsonify
from flask_bootstrap import Bootstrap

app = Flask(__name__)
app.config['JSON_AS_ASCII'] = False


@app.route('/form_data', methods=['GET', 'POST'])
def form_data():
    if request.method=='GET':
        username = request.args.get("username")
        #dumps和loads方法，来自json模块，而json模块是python中的，可以直接导入：
        #而jsonify是flask封装的扩展包
        return jsonify({'status': '0', 'username': username, 'errmsg': '登录成功!'})
    else:
        username = request.form['username']
        return jsonify({'status': '0', 'username': username, 'errmsg': '登录成功!'})



@app.route('/')
def index():
    return render_template('AppHtml/upload_ok.html')


if __name__ == '__main__':
    app.run(debug=True)



from flask import Flask,render_template,request,redirect,url_for,flash
from werkzeug.utils import secure_filename
import os
from flask import send_from_directory

UPLOAD_FOLDER = '/uploads'  #文件存放路径
ALLOWED_EXTENSIONS = set(['mp4']) #限制上传文件格式

app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
app.config['MAX_CONTENT_LENGTH'] = 5 * 1024 * 1024

def allowed_file(filename):
    return '.' in filename and filename.rsplit('.', 1)[1].lower() in ALLOWED_EXTENSIONS
@app.route('/upload/', methods=['GET', 'POST'])
def upload_file():
    if request.method == 'POST':
        # check if the post request has the file part
        if 'file' not in request.files:
            flash('No file part')
            return redirect(request.url)
        file = request.files['file']
        # if user does not select file, browser also
        # submit an empty part without filename
        if file.filename == '':
            flash('No selected file')
            return redirect(request.url)
        if file and allowed_file(file.filename):
            filename = secure_filename(file.filename)
            file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
            return  '{"filename":"%s"}' % filename
    return render_template('AppHtml/upload_ok.html')

if __name__ == '__main__':
    app.run(debug=True)
'''

# coding:utf-8

from flask import Flask, render_template, request, Response,redirect, url_for, make_response, jsonify
from werkzeug.utils import secure_filename
import os
import cv2
import time
import realtimeempathy
from datetime import timedelta

# 设置允许的文件格式
# ALLOWED_EXTENSIONS = set(['png', 'jpg', 'JPG', 'PNG', 'bmp'])
ALLOWED_EXTENSIONS = set(['mp4', 'avi', 'flv', 'RMVB', 'MKV','png', 'jpg', 'JPG', 'PNG', 'bmp'])

def allowed_file(filename):
    return '.' in filename and filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS


app = Flask(__name__)
# 设置静态文件缓存过期时间
app.send_file_max_age_default = timedelta(seconds=1)
@app.route('/homepage', methods=['POST', 'GET'])
def homepage():
    return render_template('AppHtml/homepage.html')

@app.route('/register', methods=['POST', 'GET'])
def register():
    return render_template('AppHtml/register.html')

@app.route('/updatefile', methods=['POST', 'GET'])
def updatefile():
    if request.method == 'POST':
        f = request.files['file']

        if not (f and allowed_file(f.filename)):
            return jsonify({"error": 1001, "msg": "请检查上传的图片类型，仅限于mp4、avi、flv、RMVB、MKV、png、jpg、JPG、PNG、bmp"})

        user_input = request.form.get("name")

        basepath = os.path.dirname(__file__)  # 当前文件所在路径

        upload_path = os.path.join(basepath, 'static/image', secure_filename(f.filename))  # 注意：没有的文件夹一定要先创建，不然会提示没有该路径
        print(secure_filename(f.filename))
        # upload_path = os.path.join(basepath, 'static/images','test.jpg')  #注意：没有的文件夹一定要先创建，不然会提示没有该路径
        f.save(upload_path)
        dir = 'C:/Users/zhangjing/Anaconda3/envs/Django/static/image/' + str(secure_filename(f.filename))
        dir_out = 'C:/Users/zhangjing/Anaconda3/envs/Django/static/sound/TEST.wav'
        video_train_clf_knn = 'E:/ffmpeg-latest-win64-static/2019_11_12_experimental_data/peak_detetion(test)/sound_image_knn.pickle'
        image_train_clf_knn = 'E:/ffmpeg-latest-win64-static/2019_11_12_experimental_data/GAZE_DATA_backup/7_09_proceess/classifier/pickle/image_svm.pickle'
        time.sleep(10)
        realtimeempathy.video_sound(dir, dir_out)
        x, E_image, N_image = realtimeempathy.image_pred(dir,image_train_clf_knn)
        E_video, N_video = realtimeempathy.video_pred(dir,dir_out,video_train_clf_knn)
        realtimeempathy.video(dir, x, E_image, N_image, E_video, N_video)
        print('processed!')
        data = E_video[-1]* 100
        #
        user = {'nickname': str(data)}
        # return Response(gen(), mimetype='multipart/x-mixed-replace; boundary=frame')
        return render_template('AppHtml/upload_ok.html', userinput=user_input, val1=time.time(),
                               title='Home',
                               user=user)

    return render_template('AppHtml/updatefile.html')

def gen():
    video_path = 'C:/Users/zhangjing/Anaconda3/envs/Django/static/image/test.mp4'
    vid = cv2.VideoCapture(video_path)
    while True:
        return_value, frame = vid.read()
        image = cv2.imencode('.jpeg', frame)[1].tobytes()
        yield (b'--frame\r\n'
               b'Content-Type: image/jpeg\r\n\r\n' + image + b'\r\n')

@app.route('/video_feed')
def video_feed():
    return Response(gen(), mimetype='multipart/x-mixed-replace; boundary=frame')

if __name__ == '__main__':
    app.run(host='0.0.0.0',port =5000, debug=False)
    # data = real_empathy()
    # print(data)

前端html五个
第一个homepage.html

<html>
	<head>
		<title>empathy evoluation real system</title>
	  <style type="text/css">
    html {
      width: 100%;
      height: 100%;
      overflow: hidden;
      font-style: sans-serif;
    }

    body {
      width: 100%;
      height: 100%;
      font-family: 'Open Sans', sans-serif;
      margin: 0;
      background-color: #FF8080;
    }

    #login {
      position: absolute;
      top: 40%;
      left: 40%;
      margin: -150px 0 0 -150px;
      width: 600px;
      height: 150px;
    }

    #login h1 {
      color: #fff;
      text-shadow: 0 0 10px;
      letter-spacing: 1px;
      text-align: center;
    }

    h1 {
      font-size: 2em;
      margin: 0.67em 0;
    }

    input {
      width: 100px;
      height: 30px;
      margin-bottom: 10px;
      outline: none;
      padding: 10px;
      font-size: 13px;
      color: #fff;
      text-shadow: 1px 1px 1px;
      border-top: 1px solid #312E3D;
      border-left: 1px solid #312E3D;
      border-right: 1px solid #312E3D;
      border-bottom: 1px solid #56536A;
      border-radius: 4px;
      background-color: #2D2D3F;
    }

    .but {
      width: 300px;
      min-height: 20px;
      display: block;
      background-color: #4a77d4;
      border: 1px solid #3762bc;
      color: #fff;
      padding: 9px 14px;
      font-size: 15px;
      line-height: normal;
      border-radius: 5px;
      margin: 0;
    }
  	 </style>
	</head>
	<body>

	<div id="login">
		<center>
			<h1>안녕하세요!
         영상의 공감도 알고 싶죠? Try it!
			</h1>

		<p>

			<a href="mailto:zj03010020@gmail.com">Author Email</a>
			<hr color="pink">

			Username：<input type="text" name="user" value="" width="30"><br>
			Password：<input type="password" name="pwd" value="" width="30"><br>
			<table>
				<tr>
					<td>

						<input type="reset" value="cancel">
						<a href="/updatefile"><input type="submit" value="Proceed" ></a>
						<a href="/register"><input type="submit" value="Login Help" ></a>
					</td>
				</tr>
			</table>
		<p>

		</center>
	</div>
	</body>
</html>

第二个register.html

<html>
	<head>
	 <title>Welcome to register</title>
	 <style type="text/css">
    html {
      width: 100%;
      height: 100%;
      overflow: hidden;
      font-style: sans-serif;
    }

    body {
      width: 100%;
      height: 100%;
      font-family: 'Open Sans', sans-serif;
      margin: 0;
      background-color: #FF8080;
    }

    #login {
      position: absolute;
      top: 40%;
      left: 50%;
      margin: -150px 0 0 -150px;
      width: 300px;
      height: 300px;
    }

    #login h1 {
      color: #fff;
      text-shadow: 0 0 10px;
      letter-spacing: 1px;
      text-align: center;
    }

    h1 {
      font-size: 2em;
      margin: 0.67em 0;
    }

    input {
      width: 100px;
      height: 30px;
      margin-bottom: 10px;
      outline: none;
      padding: 10px;
      font-size: 13px;
      color: #fff;
      text-shadow: 1px 1px 1px;
      border-top: 1px solid #312E3D;
      border-left: 1px solid #312E3D;
      border-right: 1px solid #312E3D;
      border-bottom: 1px solid #56536A;
      border-radius: 4px;
      background-color: #2D2D3F;
    }

    .but {
      width: 300px;
      min-height: 20px;
      display: block;
      background-color: #4a77d4;
      border: 1px solid #3762bc;
      color: #fff;
      padding: 9px 14px;
      font-size: 15px;
      line-height: normal;
      border-radius: 5px;
      margin: 0;
    }
  	 </style>
	</head>
	<body>
    <div id="login">
		<center>
			<h1>register</h1>
			<p>
			<form method="get" action="zhuce.html">
				<table>
					<tr>
						<td>Username：</td>
						<td><input type="text" name="user" value="" width="30"></td>
					</tr>
					<tr>
						<td>Password：</td>
						<td><input type="password" name="pwd" value="" width="30"></td>
					</tr>
					<tr>
						<td>Sex：</td>
						<td>
							<input type="radio" name="sex" value="0" checked>Boy
							<input type="radio" name="sex" value="1">Girl
						</td>
					</tr>


					<tr>
						<td valign="top">Personal Statement:</td>
						<td><textarea name="personal" rows="5" cols="30">Personal profile</textarea></td>
					</tr>
					<tr>
						<td> <input type="reset" value="reset"></td>
						<td><input type="submit" value="submit"></td>
					</tr>
				</table>
			</form>
			<a href="/homepage"><font color="black"></b>back homepage！</font></a>
		</center>
	</div>
    </body>
</html>

第三个updatefile.html



<!DOCTYPE html>

<html>
<head>
  <meta charset="UTF-8">
  <title>영상!</title>

  <style type="text/css">
    html {
      width: 100%;
      height: 100%;
      overflow: hidden;
      font-style: sans-serif;
    }

    body {
      width: 100%;
      height: 100%;
      font-family: 'Open Sans', sans-serif;
      margin: 0;
      background-color: #FF8080;
    }

    #login {
      position: absolute;
      top: 40%;
      left: 50%;
      margin: -150px 0 0 -150px;
      width: 300px;
      height: 300px;
    }

    #login h1 {
      color: #fff;
      text-shadow: 0 0 10px;
      letter-spacing: 1px;
      text-align: center;
    }

    h1 {
      font-size: 2em;
      margin: 0.67em 0;
    }

    input {
      width: 278px;
      height: 18px;
      margin-bottom: 10px;
      outline: none;
      padding: 10px;
      font-size: 13px;
      color: #fff;
      text-shadow: 1px 1px 1px;
      border-top: 1px solid #312E3D;
      border-left: 1px solid #312E3D;
      border-right: 1px solid #312E3D;
      border-bottom: 1px solid #56536A;
      border-radius: 4px;
      background-color: #2D2D3F;
    }

    .but {
      width: 300px;
      min-height: 20px;
      display: block;
      background-color: #4a77d4;
      border: 1px solid #3762bc;
      color: #fff;
      padding: 9px 14px;
      font-size: 15px;
      line-height: normal;
      border-radius: 5px;
      margin: 0;
    }
  </style>


</head>
<body>
<div id="login">
<center>
	<h1>Test begin!</h1>
	<form action="" enctype='multipart/form-data' method='POST'>
        <input type="file" name="file" style="margin-top:20px;"/>
        <br>
        <h>지금 당신의 기분이 어떤 신나요?(행복、슬퍼、화나):</h>
        <input type="text" class="txt_input" name="name"  value="행복" style="margin-top:10px;"/>
        <input type="submit" value="submit" class="button-new" style="margin-top:10px;"/>
    </form>

</center>
	</div>
</body>
</html>

得到的结果图展示
upload_ok.html



<!DOCTYPE html>

<html>
<head>
  <meta charset="UTF-8">
  <title>영상!</title>

  <style type="text/css">
    html {
      width: 100%;
      height: 100%;
      overflow: hidden;
      font-style: sans-serif;
    }

    body {
      width: 100%;
      height: 100%;
      font-family: 'Open Sans', sans-serif;
      margin: 0;
      background-color: #FF8080;
    }

    #login {
      position: absolute;
      top: 40%;
      left: 30%;
      margin: -150px 0 0 -150px;
      width: 300px;
      height: 300px;
    }

    #login h1 {
      color: #fff;
      text-shadow: 0 0 10px;
      letter-spacing: 1px;
      text-align: center;
    }

    h1 {
      font-size: 2em;
      margin: 0.67em 0;
    }

    input {
      width: 278px;
      height: 18px;
      margin-bottom: 10px;
      outline: none;
      padding: 10px;
      font-size: 13px;
      color: #fff;
      text-shadow: 1px 1px 1px;
      border-top: 1px solid #312E3D;
      border-left: 1px solid #312E3D;
      border-right: 1px solid #312E3D;
      border-bottom: 1px solid #56536A;
      border-radius: 4px;
      background-color: #2D2D3F;
    }

    .but {
      width: 300px;
      min-height: 20px;
      display: block;
      background-color: #4a77d4;
      border: 1px solid #3762bc;
      color: #fff;
      padding: 9px 14px;
      font-size: 15px;
      line-height: normal;
      border-radius: 5px;
      margin: 0;
    }
  </style>

</head>
<body>
<div id="login">
    <center>
	<h1>empathy score:{{user.nickname}}!</h1>
    </center>
    <img src="{{ url_for('video_feed') }}">

	</div>
</body>
</html>
情绪识别博士
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【python】Flask Web框架
weixin_38009144的博客
04-07 350
使用。
基于SVM的中文微博情感分析系统（flask实现界面）
haosen
04-08 6475
目前网上流行一种进行情感分析的嵌入界面，通过提交评论进行实时情感分析，但是目前网上的开源代码多基于慕课源码的英文文本情感分析。为了能够进行中文的文本情感分析，此篇文章通过收集微博情感数据集进行训练和实现一个基于中文的简单情感分析web系统。 该项目主要实现了两个内容: 一是基于词频统计和词嵌入的特征表示方法分别比较了SVM算法和LSTM算法在中文情感分析上的性能。 二是将利用fla...
flask实现文本情感分析服务
lixunxie的专栏
01-04 681
用RNN模型实现文本情感分析 直接上代码吧！！！ # encoding:utf-8 from meinheld import server from predict_rnn import RnnModel import time import logging from logging.handlers import TimedRotatingFileHandler import jso...
python+html语音人物交互_flask后台与前端（html）交互的两种方法
weixin_39872872的博客
12-28 363
基于python flask框架搭建webflask后台与前端(html)交互的两种方法：方法1 使用flask-wtf 提供的表单用常见的登录为例：// An highlighted blockfrom flask_wtf import Formclass LoginForm(Form): # 登录表单ROLE = SelectField('角色', choices=[('s', '管...
python-flask-first-website
02-05
标题“python-flask-first-website”表明这是一个关于使用Python的Flask框架构建第一个网站的教程或项目。Flask是一个轻量级的Web服务器网关接口（WSGI）Web应用框架，由Armin Ronacher开发。它以其简洁和模块化的...
personal-website:使用Flask的个人网站
03-31
标题 "personal-website:使用Flask的个人网站" 暗示了这是一个使用Python的Flask框架构建的个人网站项目。Flask是一个轻量级的Web服务器和Web应用框架，适合初学者和小型项目，因为它提供了简洁的API和基本功能，而...
Python-FlaskMovieWebsite基于Python的Flask框架在线电影网站系统
08-12
总的来说，"Flask_Movie_Website"项目展示了如何使用Python的Flask框架构建一个在线电影网站，涉及到了Web开发的基本概念、数据库操作、模板引擎和表单处理。这为初学者提供了学习Flask和Web开发的实践平台。
music-website-flask:基于flask与MySQL完成的音乐库管理系统
05-04
本文将深入探讨一个名为“music-website-flask”的项目，这是一个利用Python的Flask框架与MySQL数据库构建的音乐库管理系统。通过这个系统，用户可以实现在线音乐播放、下载和收藏，以及订阅会员等多种功能。 首先...
Pizza-ordering-website:一个使用Flask和Flask-wtf订购披萨的python网站
04-27
Flask是一个轻量级的Web服务程序，是Python的一种WSGI（Web Server Gateway Interface）应用框架。它的核心设计思想是模块化，允许开发者自由选择各种扩展来添加功能，如数据库支持、表单处理等。在这个项目中，...
视频中的物理要素——提取人们产生共情的元素
情感识别技术的博客
07-20 966
近几年油管，各种小视频的兴起，似乎在为我们打开一扇门。 研究角度来看，人们为什么对小视频如此痴迷。 短暂的欲望得到满足 为什么通过视觉刺激，听觉刺激可以在观看吃播的时候，观看者也可以得到同样的对食物满足的情绪刺激。 很重要的原因是，我们很需要很需要共情（empathy） 相恋的两个人，为什么会在某一天争吵， 因为对方体会不到我的心情，看来共情是多么的重要啊 所以如果能够找到那个让你产生共情的元素 那么在未来的广告创作中，巧妙的运用这些共情元素，让观众在观看广告的过程中产生了广告中所表达的情绪。 那么观众就会
视频中提取图片信息和声音信息
情感识别技术的博客
07-20 766
随着某音，某拍小视频的流行，视频中的物理要素变得尤为重要，通过提起视频中的物理要素，判断视频对人们情绪的刺激，将是未来一个重要的话题。 视频中的重要信息包括图片和声音。 图片又可以从每帧的RGB，HSV，Lab得到特征值。 声音有很多方式的提取，这里列举三种。1.将声音转为数据信息，将数据信息通过FFT分析，提取每秒的frequency和power。 2.使用MFCC中提取的12个倒波系数作为特征值。3.将每帧数据先进行SFTF的变换为RGB图片。从RGB图片中提取R，G，B三个变量作为声音的amp
瞳孔特征值提取，blink frequency,fixation frequency,saccad extent, pupil diameter等
情感识别技术的博客
09-17 614
进行的分析有，滤波分析，fft，psd database.py 下面展示一些 内联代码片。 import pandas as pd import numpy as np def read_file(raw_path): data = pd.DataFrame(pd.read_csv(raw_path, encoding="utf-8", engine='python')) LPMM = np.array(data['LPMM']) RPMM = np.array(data['RPM
视频同情程度实时分析系统
情感识别技术的博客
08-20 472
下面展示一些 内联代码片。 # -*- coding: utf-8 -*- import cv2 import pandas as pd import os import time import wave import numpy as np import pickle import nextpow2 from sklearn import preprocessing from moviepy.editor import * import matplotlib.pyplot as plt import ma
视频中图片和声音物理要素的提取
情感识别技术的博客
07-20 413
这里写自定义目录标题 图片中RGB，HSV，Lab特征值的提取，python的实现 下面展示一些 内联代码片。 # -*- coding: utf-8 -*- import cv2 import pandas as pd import os ## 判断是否存在文件夹 def dir(path_out): folder = os.path.exists(path_out) if not folder: os.makedirs(path_out) prin
使用机器学习对视频中图片和声音物理要素进行训练
情感识别技术的博客
07-21 392
上次提取到的声音特征值和图片特征值对其进行学习，以便我们后续的实时共感系统的运行 下边是python的实现 数据集 下面展示一些 内联代码片。 def load_dataset(): train_data = pd.DataFrame(pd.read_csv(path +file,encoding='CP949', engine='python'))#path+out 是声音和图片的数据集，csv格式 X_train = np.array(train_data[['gray','h','
视频中图片和声音物理要素的提取（2）
情感识别技术的博客
07-20 379
使用从声音中RGB图片的提取，来区分共情元素和非共情元素的python实现。 下面展示一些 内联代码片。 import wave import numpy as np import matplotlib.pyplot as plt import nextpow2 import os def data(): fw = wave.open(wav_path + file, 'r') # 读取音频文件 soundInfo = fw.readframes(-1) #读取音频的每一帧 sou
眼睛在欣赏视频时的特征值分析——pupillary response and eye movement
情感识别技术的博客
08-12 365
任务激发的瞳孔反应显示出与工作记忆的直接相关性，使其成为有效的衡量与学习无关的认知负荷的方法。 the pupillary diameter mean (P Dμ): the tonic dilation measured by the time series mean of the pupillary diameter 2… the pupillary diameter standard deviation (P Dσ): the phaseal/dynamic aspect of pupillary
视频中提取到的共感要素画折线图添加到视频中，实时系统。 python实现
情感识别技术的博客
07-21 356
我这边 有24个视频，首先 要对他们进行video转picture的转换 然后将名称重新定义 import glob import os num =[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24] for n in range(len(num)): #图片位置 inputPath = r'E:/ffmpeg-latest-win64-static/2019_11_12_experimental_data/stimuli
python flask前后端交互
最新发布
07-03
Python Flask是一个轻量级的Web应用框架，常用于构建快速原型和小型网站。Flask的核心在于其简单易用，能够方便地处理HTTP请求与响应，非常适合前后端分离架构中的后端开发。 在Flask中，前后端交互主要通过以下几种方式： 1. **RESTful API**（Representational State Transfer）：Flask提供了丰富的路由功能，开发者可以通过定义URL映射和对应的视图函数（View Functions），来创建RESTful接口。客户端（如前端JavaScript或移动应用）发送HTTP请求到这些API，获取数据或者执行操作。 ```python from flask import Flask, jsonify app = Flask(__name__) @app.route('/api/users', methods=['GET']) def get_users(): users = [{'id': 1, 'name': 'Alice'}, {'id': 2, 'name': 'Bob'}] return jsonify(users) # 更复杂的接口示例，返回JSON格式的数据 @app.route('/api/products/<int:id>', methods=['GET']) def get_product(id): product_data = {'id': id, 'name': 'Product {}'.format(id)} return jsonify(product_data) ``` 2. **模板引擎**：Flask支持多种模板引擎（比如Jinja2），前端开发者可以在HTML文件中嵌入Python代码，从而动态渲染数据。前端可以通过Ajax等技术向服务器请求数据，并将接收到的数据插入到页面中。 ```html <!-- templates/index.html --> {% for user in users %} <li>{{ user.name }}</li> {% endfor %} ``` 在后端接收前端的AJAX请求并填充数据： ```python from flask import render_template_string @app.route('/users') def list_users(): users = [{'id': 1, 'name': 'Alice'}, {'id': 2, 'name': 'Bob'}] rendered_html = render_template_string('<ul>{% for user in users %} <li>{{ user.name }}</li> {% endfor %}</ul>', users=users) return rendered_html ``` 3. **WebSocket**：Flask扩展库如`Flask-SocketIO`或`Flask-WTF-Signature`可以实现双向通信，例如聊天应用、实时更新等功能。 ```python from flask_socketio import SocketIO app = Flask(__name__) socketio = SocketIO(app) @socketio.on('message') def handle_message(message): # 处理前端发送的消息 if __name__ == '__main__': socketio.run(app) ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值