帖子解决两个问题:
第一、ajax发出请求后端用flask轻量化部署,包括websocket通信
第二、web服务器部署集成环境wamrserver和flask冲突(具体表现在:ajax中的请求会默认wamp不会指向flask)
先解决第一个问题:
用vue-cli 创建项目后配置下 项目的配置文件,config/index.js 找到proxyTable,配置如下:
亲测有效的方法
proxyTable: {
'/api/*':{
//这里面的 '/api/*' 才好用, 其他的形式如:'/api'不失败的
target:'http://xxxx.com;8011',
changeOrigin: true,//跨域(很重要,前后端分离时所在服务器ip不同会涉及到跨域的问题)
pathRewrite: {
'^/api': '/api' // 这里的/api 会替代http://xxxx.com, 具体前端请求例子往下看
}
}
//这里设置的请求用/api替代,所以后台flask中的请求地址也应该是/api开头(必须这样否则请求不成功)
后台先配置下flask,如下代码,保存到.py文件后在cmd中python run.py运行,会启动flask服务
其中@app.route(’/api/aa/hello_world’,methods=[‘GET’,‘POST’]) 和@app.route(’/api/sendAjax2’, methods=[‘POST’])中带请求地址必须都以/api开头同config/index.js 里的proxyTable设置中保持一致,
待请求中的最后面hello_world和sendAjax2是后台对应的方法,待请求结尾必须以方法名结尾,表示调用该方法。
from flask import Flask
from flask import request
import json
app = Flask(__name__)
@app.route('/api/aa/hello_world',methods=['GET','POST'])//待请求的地址以/api开头
def hello_world():
data = request.form.get("data")//接收前端传过来的参数
print(data)
return (data)
@app.route('/api/sendAjax2', methods=['POST'])/待请求的地址以/api开头
def sendAjax2():
return "46575"
#接收前端上传的真实设备xlsx文件
@app.route('/api/upload_xlsx', methods=['POST'])
def upload_xlsx():
f = request.files['file']
filename = f.filename
upload_file = request.files['file']
upload_file.save('{}/{}'.format(os.getcwd(), filename))
os.rename('{}/{}'.format(os.getcwd(), filename), '{}/{}'.format(os.getcwd(), 'Device.xlsx'))#重命名
return '{}/{}'.