flask后端、使用ajax上传数据到flask、用到了flask-restful做json处理

#视图层

from flask import Flask,url_for,render_template
from flask_restful import Api,Resource,reqparse,inputs

'''
(输入) Flask_restful01 有一个验证、类似于wtf的验证 (输入验证)
通过 postman 进行输入
'''
app = Flask(__name__)
api = Api(app)

class LoginView(Resource):
'''
只定义一个post请求
'''
def post(self):
#获取解析对象
parser = reqparse.RequestParser()
#获取username 是否是str类型 ,提示用户名验证错误!
parser.add_argument("username",type = str, help = "用户名验证错误!",required = True)
parser.add_argument("password",type = str, help = "密码验证错误!")

parser.add_argument("home_page",type = inputs.url,help = "个人链接验证错误")

'''
default = "鼎鼎" 默认是鼎鼎
required = True 必须要传递的参数, 如果不传递,输出 用户名验证错误!

1. default:默认值,如果这个参数没有值,那么将使用这个参数指定的值。
2. required:是否必须。默认为False,如果设置为True,那么这个参数就必须提交上来。 3. type:这个参数的数据类型,如果指定,那么将使用指定的数据类型来强制转换提交上来的值。
4. choices:选项。提交上来的值只有满足这个选项中的值才符合验证通过,否则验证不通过。
5. help:错误信息。如果验证失败后,将会使用这个参数指定的值作为错误信息。
6. trim:是否要去掉前后的空格。


其中的type,可以使用python自带的一些数据类型,也可以使用flask_restful.inputs下的一些特定的数据类型来强制转换。比如一些常用的:
1. url:会判断这个参数的值是否是一个url,如果不是,那么就会抛出异常。
2. regex:正则表达式。
3. date:将这个字符串转换为datetime.date数据类型。如果转换不成功,则会抛出一个异常。
'''

#拿到这个传来的参数
args = parser.parse_args()


#打印ajax传递来的参数
print(args)

#获取username的字段
print(args.get("username"))
return {"username":"zhiliao"}

#方式一、在Postman里面输入:http://127.0.0.1:8888/login/?username=哇咔咔 会传递信息 哇咔咔 给username
#方式二、通过jquery的方式、给后端进行传参、
api.add_resource(LoginView,"/login/")


@app.route('/')
def hello_world():
return render_template("index.html")


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





#---------------------------------------------------------------------------------------------
前端页面、用ajax获取到了 html 页面里面的值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax提交数据</title>
<script src="../static/jq/jquery-2.1.0.js"></script>

<script>
function tijiao(){
{#获取id = id1的值#}
var id1var = $("#id1").val();
{#如果不为null 或者不为 ""#}
if(id1var!=null && id1var!=""){

$.ajax({
type: "post",
{# 数据来自于 17 行#}
url: "/login/",
{#格式 json 传递数据给/login/ 视图#}
data: {
'username':id1var
},

dataType: "json",
success: function(data){
console.log(data);
}
});
}else{
alert("不能为空");
}
}



</script>
</head>
<body>
<p>hello</p>


{#通过ajax给后端flask进行传递删数据#}
username:<input id="id1" value="">
<a href="javaScript:tijiao()">提交</a>

</body>
</html>
原文地址:https://www.cnblogs.com/yuanjia8888/p/13344211.html