首页 > 其他分享 >Flask解决跨域问题

Flask解决跨域问题

时间:2023-11-10 15:35:23浏览次数:31  
标签:Control www http 跨域 Flask Access 解决 com

什么是跨域问题

跨域问题指的是浏览器限制了从一个源(协议、域名、端口)访问另一个源的资源的行为,这个限制是浏览器的一个安全机制。如果一个网页从一个源加载了另一种类型的资源(例如 HTML、CSS、脚本或图像)但是资源的来源是不同的源,那么就会发生跨域问题。

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

当前页面url 被请求页面url 是否跨域 原因
http://www.xxma.com/ http://www.xxma.com/index 同源(协议、域名、端口号相同)
http://www.xxma.com/ https://www.xxma.com/ 协议不同(http/https)
http://www.xxma.com/ http://www.xm.com/ 主域名不同
http://www.xxma.com/ http://cnblog.xxma.com/ 子域名不同
http://www.xxma.com:8080/ http://www.xxma.com:8081/ 端口号不同

实际解决

1.下载flask_cors 包

pip install flask-cors

2.使用flask_cors的CORS

app初始化的时候就加载配置


from flask import Flask
from flask_cors import CORS
app = Flask(__name__)
# r'/*' 是通配符,让本服务器所有的 URL 都允许跨域请求
CORS(app, resources=r'/*')
if __name__ == "__main__":
    app.run()

配置参数说明

参数 类型 Head字段 说明
resources 字典、迭代器或字符串 全局配置允许跨域的API接口
origins 列表、字符串或正则表达式 Access-Control-Allow-Origin 配置允许跨域访问的源 *表示全部允许
methods 列表、字符串 Access-Control-Allow-Methods 配置跨域支持的请求方式,如:GET、POST
expose_headers 列表、字符串 Access-Control-Expose-Headers 自定义请求响应的Head信息
allow_headers 列表、字符串或正则表达式 Access-Control-Request-Headers 配置允许跨域的请求头
supports_credentials 布尔值 Access-Control-Allow-Credentials 是否允许请求发送cookie,false是不允许
max_age 整数、字符串 Access-Control-Max-Age 预检请求的有效时长

3.在被请求的Response header中加入header

middlewares.py中加入

def add_cors_headers(response: Flask.response_class) -> Flask.response_class:
    response.headers.set("Access-Control-Allow-Origin", "*")
    response.headers.set("Access-Control-Allow-Headers", "*")
    response.headers.set("Access-Control-Allow-Methods", "*")
    return response

# 在请求上下文中添加中间件函数
def setup_middlewares(app: Flask) -> None:
    app.after_request(add_cors_headers)

标签:Control,www,http,跨域,Flask,Access,解决,com
From: https://www.cnblogs.com/XxMa/p/17824229.html

相关文章

  • 解决英文版Windows 2003中文乱码问题
    解决英文版Windows2003中文乱码问题  首先,将英文版Windows2003光碟放在光驱:  1.打开“控制面板”,双击“RegionalandLanguageOptions”图标,打开区域和语言设置窗口;   2.在区域和语言设置窗口中,选择“Language”选项卡,将“InstallFilesforEastAsianLanguag......
  • IIS HTTP 500 - 内部服务器错误完美解决 IIS 服务器无法加载应用程序 '/LM/W3SVC/1/RO
    现象:       浏览ASP页面提示  500内部错误事件查看器中:        [1]:               服务器无法加载应用程序'/LM/W3SVC/1/ROOT'。错误是'没有注册类别'。                有关此消息的详细信息,请访问Microsoft联机支......
  • node 栈溢出 解决办法
    启动项目时报错解决办法:在package.json里面找到启动项目命令,加上NODE_OPTIONS=\"--max-old-space-size=4096\"即可"scripts":{"serve":"NODE_OPTIONS=\"--max-old-space-size=4096\"vue-cli-serviceserve--modedevelopment",......
  • 解决nginx: [error] invalid PID number in /usr/local/nginx/logs/nginx.pid
    在编辑nginx之后,运行时出现nginx已经在运行,然后输入./nginx-sreload时出现nginx:[error]invalidPIDnumber“”in“/usr/local/nginx/logs/nginx.pid”,进入对应目录可以看到nginx.pid里是空的,因此无法结束或者重启nginx。究其原因是因为每一个nginx进程都对应一个id,存放......
  • IDEA中配置配置国际化时,properties文件没有Resource Bundle如何解决
    如果IDEA中配置国际化时,.properties文件没有可视化界面,则需要安装一个ResourceBundleEditor的插件 ......
  • wsl 开发环境中完美解决 vm.max_map_count [65530] is too low
    Win10环境用WSL+Docer搭建ElasticSearch集群时,肯定会报这样一个错误:maxvirtualmemoryareasvm.max_map_count[65530]istoolow,increasetoatleast[262144] 解决方案如下:$wsl-ddocker-desktop$sysctl-wvm.max_map_count=262144不少人应该都......
  • 套索工具任何像素都不大于50%选择,如何解决?
    当你提到套索工具选择像素不大于50%的问题,我推测你可能在使用AdobePhotoshop或类似的图像编辑软件时遇到了一个常见的问题:你想要选择的区域不够准确,或者选择的边缘不够清晰。在Photoshop中,通常有几种方法可以提高选择区域的准确性。以下是一个详细的教程,说明如何使用Photoshop中......
  • Node opensslErrorStack 错误解决方法记录
    从Git仓库中下载了一个老项目,使用npminstall安装后没有问题,当我使用npmrundev的时候遇到了OpenSSL相关错误,例如opensslErrorStack:['error:03000086:digitalenveloperoutines::initializationerror']网上找了一下相关信息,然后顺利解决了,记录分享给大家问题原因:这种错......
  • 解决Vue中使用wangEditor富文本编辑器复制粘贴word文档携带内容样式文本问题
    前言:本文记录作者在vue项目中使用到wangEditor富文本编辑器复制粘贴功能所遇到的bug,故此把自己所遇到的坑及问题详细的记录下来。如果觉得作者写的不错,希望得到您的点赞/收藏/支持,如果有不同意见,欢迎下方评论区留言。一、自定义处理粘贴的文本内容1、配置自定义处理粘贴的文本内......
  • Linux:SSH服务异常,无法登录解决办法
    我这能杀死啊,我还以为杀不死呢。。。[root@RV1126_RV1109:/]#killallky_ai_camera_engine_origin[root@RV1126_RV1109:/]#12文章目录20230816Linux中使用killall时无法找到进程的原因及解决方法一、引言二、可能的原因2.1进程名错误2.2进程未在执行2.3权限问题三、解决方......