最初默认图.png
效果图.png
文件被写入.png
html代码核心
<body>
{% set file_name=filename %}
<form role="form" action="/update/" method="post" enctype="multipart/form-data">
<div class="form-group">
<input name="name" type="text"/>
<button type="submit" class="btn btn-danger">提交</button>
<input name="files" type="file"/>
</div>
</form>
<h3>姓名：{{ username }}</h3>
<img alt="图片丢失了" onerror="this.src='http://image.biaobaiju.com/uploads/20180928/16/1538124027-aMtYOyIRzC.jpeg'"
style="width: 80px; height: 80px;" src="{{ url_for('static',filename=file_name)}}">
</body>
注意：enctype="multipart/form-data"很关键
后台代码
@front.route('/update/', methods=["GET", "POST"])
def up_pic():
if request.method == "POST":
name = request.form["name"]
try:
file = request.files.get("files")
#写的绝对路径，可自己修改
path_static="D:\Python_project\Todo_api\static\img"
up_path=os.path.join(path_static,file.filename)
#seession保存用户名和图片名称，图片名称加个img/前缀，为了和html中匹配
session['filename']="img/"+file.filename
session['username']=name
#文件保存
file.save(up_path)
except:
print("没传文件")
return redirect(url_for('.up_pic'))
else:
filename=session.get("filename")
username=session.get("username")
data={
'filename':filename,
'username':username
}
return render_template("front/index.html",**data)
上传图片到七牛
在七牛注册，并创建对象存储
- 服务器返回七牛token凭证
@app_v1.route("/uptoken/")
def up_token():
access_key=""
secret_key=''
q=qiniu.Auth(access_key,secret_key)
bucket='todo'
token=q.upload_token(bucket)
return jsonify({'token':token})
在客户端，比如android，可以请求该地址拿到token,然后在执行上传，上传文件会把图片上传上去，并且会返回一个key，这个key就可以在后台和model绑定写到数据库中，展示的时候就是七牛的域名+文件名。前端的操作都一样，只是代码写法不一样，
