同源策略

https://www.cnblogs.com/poloyy/p/15345184.html

CORS

https://www.cnblogs.com/poloyy/p/15345871.html

需要先了解什么是同源策略和 CORS 才能更好看懂这篇文章

目录结构

— root/
|
|—static/
| |
| |—jquery.min.js
|
|— cors_client.py
|— cors_server.py
|

cors_client.py 代码

主要模拟客户端

前提

为了使用

from fastapi.staticfiles import StaticFiles

需要先安装 aipfiles

pip install aiofiles

静态资源文件的使用教程后面再写

实际代码

#!usr/bin/env python
# -*- coding:utf-8 _*-
"""
# author: 小菠萝测试笔记
# blog: https://www.cnblogs.com/poloyy/
# time: 2021/9/28 12:58 下午
# file: 33_cors.py
"""
import uvicorn
from fastapi.responses import HTMLResponse
from fastapi import FastAPI
from fastapi.staticfiles import StaticFiles app = FastAPI() # 绑定静态资源文件夹(后面详解)
app.mount("/static", StaticFiles(directory="static"), name="static") @app.get("/")
def get_login():
# 返回一段 HTML 代码
html = """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="/static/jquery.min.js"></script>
</head>
<body>
<script>
$.ajax({
url:"http://127.0.0.1:8080/login",
type:"POST",
data:JSON.stringify({
"id":1,
"name":"小菠萝"
}),
contentType:"application/json",
success:function (rsp) {
console.log(rsp)
}
})
</script>
</body>
</html>
"""
return HTMLResponse(html) if __name__ == '__main__':
# 客户端是 8081 端口!
uvicorn.run(app="33_cors:app", reload=True, host="127.0.0.1", port=8081)

那段 ajax 代码就是模拟跨域请求服务端,服务端域名虽然也是 127.0.0.1,但端口是 8081,是一个跨域请求

cors_server.py 代码

主要模拟服务端

#!usr/bin/env python
# -*- coding:utf-8 _*-
"""
# author: 小菠萝测试笔记
# blog: https://www.cnblogs.com/poloyy/
# time: 2021/9/28 12:58 下午
# file: 33_cors.py
"""
import uvicorn
from fastapi import FastAPI, Body app = FastAPI() # 模拟服务端 登录 接口
@app.post("/login")
def get_login(id: str = Body(...), name: str = Body(...)):
return {"id": id, "name": name} if __name__ == '__main__':
# 服务端端口是 8080!
uvicorn.run(app="33_cors1:app", reload=True, host="0.0.0.0", port=8080)

开始模拟跨域请求场景

同时运行 cors_client.py、cors_server.py 的 uvicorn 服务器,其实就运行下两个 Python 文件就行啦

  • preflight 就是预检请求,没有通过服务端的允许,所以访问失败;
  • 点下右侧的箭头,实际发起的 login 请求会高亮
  • 第一个 login 请求就是实际发送的请求,因为预检请求失败,所以会报跨域错误

  • 查看预检请求,请求方法是 options
  • Console 可以看到有跨域报错的提示,缺少Access-Control-Allow-Origin 响应头
  • 所以浏览器不允许把请求发送到 127.0.0.1:8081 源上
  • 访问 127.0.0.1:8081,查看 F12 开发者工具-Networ

FastAPI 如何使用 CORS 来解决跨域问题?

https://www.cnblogs.com/poloyy/p/15347578.html

FastAPI(38)- 模拟一个跨域场景的更多相关文章

  1. 一个跨域请求的XSS续

    之前讨论过,在解决post跨域请求时,采用iframe+本域代理页的形式,兼容性(当然是包括IE6啦)是最好的.上次提到,代理页面的作用是:执行本域下的回调函数.就是这个原因,给XSS带来了便利.详细 ...

  2. 一个跨域请求的XSS漏洞

    场景回顾 一个表单进行跨域提交的方式有很多,我们使用的采用隐藏iframe,在本域下放一个代理页面,通过服务端配合完成一次完整的请求. 首先,部署proxy.html代理页面.这个页面处理服务端返回的 ...

  3. 一个跨域请求的XSS漏洞再续

    上回提到,由于需要使用代理页面解决POST请求的跨域请求,需要在代理页面上执行传递的函数.所以我们做了白名单只有我们认可的回调函数才能在页面上执行,防止执行非法的JS方法,做脚本攻击. 我们所采用的方 ...

  4. 页面中iframe中嵌入一个跨域的页面,让这个页面按照嵌入的页面宽高大小显示的方式;iframe嵌套的页面不可以编辑的问题解决方案

    <html> <head> <style> body { margin-left: 0px; margin-top: 0px; margin-right: 0px; ...

  5. Ajax+Spring MVC实现跨域请求(JSONP)JSONP 跨域

    JSONP原理及实现 接下来,来实际模拟一个跨域请求的解决方案.后端为Spring MVC架构的,前端则通过Ajax进行跨域访问. 1.首先客户端需要注册一个callback(服务端通过该callba ...

  6. Ajax+Spring MVC实现跨域请求(JSONP)(转)

    背景: AJAX向后台(springmvc)发送请求,报错:已阻止交叉源请求:同源策略不允许读取 http://127.0.0.1:8080/DevInfoWeb/getJsonp 上的远程资源.可 ...

  7. 浏览器同源策略与ajax跨域方法汇总

    原文 什么是同源策略 如果你进行过前端开发,肯定或多或少会听说过.接触过所谓的同源策略.那么什么是同源策略呢? 要了解同源策略,首先得理解“源”.在这个语境下,源(origin)其实就是指的URL.所 ...

  8. Ajax+Spring MVC实现跨域请求(JSONP)

    背景: AJAX向后台(springmvc)发送请求,报错:已阻止交叉源请求:同源策略不允许读取 http://127.0.0.1:8080/DevInfoWeb/getJsonp 上的远程资源.可 ...

  9. CORS跨域请求的限制和解决

    我们模拟一个跨域的请求,一个是8888,一个是8887 //server.js const http = require('http'); const fs = require('fs'); http ...

随机推荐

  1. java关键字native、static、final详解

    native: native关键字说明其修饰的方法是一个原生态方法,方法对应的实现不是在当前文件,而是在用其他语言(如C和C++)实现的文件中.Java语言本身不能对操作系统底层进行访问和操作,但是可 ...

  2. 十一:JavaWeb中的监听器(二)

    一.监听域对象中属性的变更的监听器 域对象中属性的变更的事件监听器就是用来监听 ServletContext, HttpSession, HttpServletRequest 这三个对象中的属性变更信 ...

  3. LeetCoded第242题题解--java--数组

    数组 数组的优点在于: 构建非常简单 能在 O(1) 的时间里根据数组的下标(index)查询某个元素(连续内存+对象指向数组下标0位置+index能够直接找到元素) 而数组的缺点在于: 构建时必须分 ...

  4. Linux 网络和端口命令

    一.查看网口IP等 显示或配置网络设备(网络接口卡)命令 sudo ifconfig 网口及ip信息 sudo ip link 网口信息 sudo ip addr 扫描端口是否开启服务,如下扫描 1至 ...

  5. 如果服务器数据更新了,CDN的数据是怎么及时更新的

    A:cdn一般用来存静态资源.拿网站来说,当用户访问网站时静态资源从cdn加载.cdn向后段源服务器请求资源并缓存,这个请求过程是周期性的,自动的,称为回源. 当你更新了一个文件,现在正巧还没到cdn ...

  6. Ubuntu防火墙:ufw

    原始linux的防火墙是iptables,以为过于繁琐,各个发行版几乎都有自己的方案; ubuntu下的防火墙是ufw[ubuntu fireward的缩写],centos的防火墙是fireward ...

  7. Go版本管理--依赖包存储

    目录 1. 简介 2. GOPATH 依赖包存储 3.GOMODULE 依赖包存储 4.包名大小写敏感问题 1. 简介 GOPATH模式下,依赖包存储在$GOPATH/src,该目录下只保存特定依赖包 ...

  8. 一个简单的 aiax请求例子

    <!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content ...

  9. 在按照ROS官方步骤操作,同时用Git管理整个过程,git clone的新catkin_ws报错: catkin_package() include dir 'include' does not exist relative to

    在按照ROS官方步骤操作,同时用Git管理整个过程,git clone的新catkin_ws报错如下: CMake Error at /opt/ros/kinetic/share/catkin/cma ...

  10. 并发编程之:AQS源码解析

    大家好,我是小黑,一个在互联网苟且偷生的农民工. 在Java并发编程中,经常会用到锁,除了Synchronized这个JDK关键字以外,还有Lock接口下面的各种锁实现,如重入锁ReentrantLo ...