利用python的flask库包作为后端接口，与html页面进行对接。
Flask搭建python接口：
该代码已搭建接口：127.0.0.1:8000/
from flask import Flask
from flask_cors import CORS
app = Flask(__name__)
app.config.from_object(__name__)
app.config['SEND_FILE_MAX_AGE_DEFAULT'] = 1
CORS(app, resources={r'/*': {'origins': '*'}})
@app.route('/')
def get():
return "这是个数据";
if __name__ == '__main__':
app.run(port=8000)运行代码出现以下端口，则启动成功：
利用postman测试端口，查看请求是否成功并返回正确返回值：
前端通过 axios脚手架+简单vue 搭建请求窗口：
<!DOCTYPE html>
<html lang="en" style="height: 100%;">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="../Bootstrap/css/bootstrap.min.css">
<script src="../Bootstrap/js/jquery.js"></script>
<script src="../Bootstrap/js/bootstrap.js"></script>
<!-- 引入 vue -->
<script type="text/javascript" src="../js/vue.js"></script>
<!--引入 axios-->
<script type="text/javascript" src="../js/axios.js"></script>
<!--自定义 css 样式 -->
<link rel="stylesheet" href="../css/style.css">
</head>
<body style="height: 100%;">
<div id="app" style="height: 100%;">
<div>{{strData}}</div>
</div>
<script>
new Vue({
el: '#app',
data: {
strData: ""
},
mounted() {
axios.get("http://127.0.0.1:8000").then(response => {
this.strData = response.data;
console.log(response.data);
})
}
})
</script>
</body>通过打开该html文件查看结果：
前端页面成功接收到数据
1483
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
