跨域文件上传的时候,浏览器会自动发起一个 OPTIONS 方法到服务器,现在后台解决前端跨域解决前端跨域请求的问题

客户端发起的这个 OPTIONS 可以说是一个“预请求”,用于探测后续真正需要发起的跨域 POST 请求对于服务器来说是否是安全可接受的,因为跨域提交数据对于服务器来说可能存在很大的安全问题

请求头 Access-Control-Request-Method 用于提醒服务器在接下来的请求中将会使用什么样的方法来发起请求

Access-Control-Allow-Method 和 Access-Control-Allow-Origin 分别告知客户端,服务器允许客户端用于跨域的方法和域名

示例

下载flask_cors 包

pip install flask-cors

使用flask_cors的CORS,代码示例

from flask_cors import *

app = Flask(__name__)
CORS(app, supports_credentials=True)

以下是Flask-CORS 的官方文档链接

http://flask-cors.readthedocs.io/en/latest/

实现

现在我们看看解决问题的实际案例

from flask_cors import CORS
app = Flask(__name__,)
# r'/*' 是通配符,让本服务器所有的URL 都允许跨域请求
CORS(app, resources=r'/*')
# 上传文件
@uploadFiles.route('/upload', methods=['POST'])
def uploadFile():
result_text = {"statusCode": 200,"message": "文件上传成功"}
response = make_response(jsonify(result_text))
response.headers['Access-Control-Allow-Origin'] = '*'
response.headers['Access-Control-Allow-Methods'] = 'OPTIONS,HEAD,GET,POST'
response.headers['Access-Control-Allow-Headers'] = 'x-requested-with'
return response

使用POSTMAN请求

遇到的问题

由于项目中路由是多级路由,通过主路由跳转到子路由,一开始的时候,允许跨域的配置在上传文件的子路由中进行设置,发现OPTIONS请求响应值中并没有返回预期的头文件,将跨域设置在主路由中设置即可

flask跨域请求的更多相关文章

  1. flask跨域请求三行代码搞定

    flask跨域请求三行代码就可以搞定.但是请注意几点: 第一:只能返回json格式数据,比如list.ndarray等都不可以 第二:返回的对象必须是是字符串.元组.响应实例或WSGI可调用. pyt ...

  2. flask 跨域请求

    Flask中,跨域请求主要有两种方式: 1.在响应头信息中添加允许跨域 如下,使用装饰器app.after_request(我这里的web是定义的蓝图),这样在每次请求后,加入header 2.使用第 ...

  3. Flask框架踩坑之ajax跨域请求

    业务场景: 前后端分离需要对接数据接口. 接口测试是在postman做的,今天才开始和前端对接,由于这是我第一次做后端接口开发(第一次嘛,问题比较多)所以在此记录分享我的踩坑之旅,以便能更好的理解,应 ...

  4. CORS跨域请求

    一.问题: 服务器端代码 from flask import Flask from flask import make_response from flask import jsonify app = ...

  5. jquery实现ajax跨域请求

    1.跨域问题: 是因为浏览器的同源策略是对ajax请求进行阻拦了,但是不是所有的请求都给做跨域,像是一般的href属性,a标签什么的都不拦截. 如: 项目一:p1.html <body> ...

  6. django之csrf_exempt解决跨域请求的问题

    一: from django.views.decorators.csrf import csrf_exempt # 获取微信返回的code信息 @csrf_exempt def wechat_auth ...

  7. Laravel中的ajax跨域请求

    最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...

  8. 跨域请求——WebClient通过get和post请求api

    AJAX不可以实现跨域请求,经过特殊处理才行.一般后台可以通过WebClient实现跨域请求~ //get 请求        string url = string.Format("htt ...

  9. 原生js封装ajax,实现跨域请求

    描述: 需要ajax跨域请求,用cors跨域方案.服务端设置: header('Access-Control-Allow-Origin: http://front.ls-la.me'); header ...

随机推荐

  1. VC++调用MSFlexGrid的SetRow方法,出现异常“Invalid Row Value”

    MSFlexGrid是微软提供的网格表格控件,SetRow方法用于设置当前焦点所在行.  C++ Code  12345   void CMSFlexGrid::SetRow(long nNewVal ...

  2. Linux下安装或升级Python 2.7

    1.准备编译环境gcc 2.去官网下载要安装的对应版本的python的源代码 下载地址:https://www.python.org/downloads/source/ 你可以选择你要下载的版本,用w ...

  3. 将文件导入到SQL server数据库表中的字段中

    一.在要执行的sql server数据库a中执行如下脚本,创建存储过程sp_textcopy /* 将二进制文件导入.导出到数据库相应字段列中 */ CREATE PROCEDURE sp_textc ...

  4. Visual Assist X 10.8.2042的Crack破解补丁. 2014.06.25 (General release.)

    VA小组时隔一个月又公布了新的版本号,这个版本号新添加了5个特性,修复了7-8个bug.而且也是稳定的Release版.所以这是很推荐更新的一个版本号. 对于破解补丁还是老规矩,请到我的下载空间下载, ...

  5. 我的notepad++

    我觉得,做开发的一定要有一个简单,但功能强大的文本编辑器.我比较喜欢notepad++,而且一直使用.准备通过这篇文章分享一下我的notepad++配置. 希望广大notepad++用户,如果有好的配 ...

  6. Netty权威指南之NIO通信模型

    NIO简介:与Socket和ServerSocket类相对应,NIO提供了SocketChannel和ServerSocketChannel两种不同的套接字通道实现,这两种新通道都支持阻塞和非阻塞两种 ...

  7. 【代码审计】CLTPHP_v5.5.3 前台任意文件上传漏洞分析

      0x00 环境准备 CLTPHP官网:http://www.cltphp.com 网站源码版本:CLTPHP内容管理系统5.5.3版本 程序源码下载:https://gitee.com/chich ...

  8. iOS开发--关闭ARC

    对整个项目关闭ARC project -> Build settings -> Apple LLVM complier 3.0 - Language -> objective-C A ...

  9. mysql分组查询获取组内某字段最大的记录

    id sid cid 1 1 12 1 23 2 1 以sid分组,最后取cid最大的那一条,以上要取第2.3条 1 方法一: select * from (select * from table o ...

  10. Bootstrap - select2

    1.调整select2下拉框的宽度 <style> .select2-container .select2-choice { height: 28px; line-height: 28px ...