宝塔面板创建Python项目并使用Flask框架搭建api接口
上传源代码文件
main.py
from flask import Flask, request, jsonify
from flask_cors import CORS
app = Flask(__name__)
CORS(app) # 允许所有来源的跨域请求
@app.route('/calculate', methods=['POST'])
def calculate():
data = request.get_json()
num1 = data.get('num1')
num2 = data.get('num2')
result = num1 + num2
return jsonify({'result': result})
if __name__ == '__main__':
app.run(host='0.0.0.0',port=2001)
前端的一部分(vue3)
<template>
<div>
<input v-model="num1" type="number" placeholder="输入第一个数字">
<input v-model="num2" type="number" placeholder="输入第二个数字">
<button @click="calculate">计算</button>
<p>{{ result }}</p>
</div>
</template>
<script>
import axios from 'axios';
export default {
name: 'HelloWorld',
props: {
},
data() {
return {
num1: null,
num2: null,
result: null
};
},
methods: {
calculate() {
axios.post('http://127.0.0.1:5000/calculate', { num1: this.num1, num2: this.num2 })
.then(response => {
this.result = response.data.result;
})
.catch(error => {
console.error(error);
});
}
}
};
</script>
宝塔面板项目的配置
如果用的是flask框架,宝塔面板会自动创建虚拟环境。
安装依赖包
最终效果
优化
WARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.
当前为开发服务器,在后续开发中切换为生产环境服务器。