本地HTML访问后端获取数据使用@CrossOrigin仍出现跨域问题

2023-11-09

Access to XMLHttpRequest at 'http://localhost/api/admin/authorizations' from origin 'http://localhost:9528' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Access-Control-Allow-Credentials 这个头的作用,果然药到病除。这个是服务端下发到客户端的 response 中头部字段,意义是允许客户端携带验证信息,例如 cookie 之类的。这样客户端在发起跨域请求的时候,不就可以携带允许的头,还可以携带验证信息的头,又由于客户端是请求框架是 axios,并且手残的设置了 withCredentials: true,意思是客户端想要携带验证信息头,但是我的服务端设置是 ‘supportsCredentials’ => false, ,表示不允许携带信息头。

WebMvcConfigurer配置跨域用法介绍
https://blog.csdn.net/munangs/article/details/132223699

@CrossOrigin(originPatterns = “*”,allowCredentials = “true”)

package xunan.management.boot.config;

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class CrossConfig implements WebMvcConfigurer{
//    @Override
//    public void addCorsMappings(CorsRegistry registry) {
//        registry.addMapping("/**")
//                .allowedHeaders("*")
//                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
//                .allowCredentials(true)
//                .maxAge(3600);
//    }
    /**
     *             .addMapping("/**")// 允许跨域访问的路径
     *             .allowedOrigins("*")// 允许跨域访问的源
     *             .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")// 允许请求方法
     *             .maxAge(168000)// 预检间隔时间
     *             .allowedHeaders("*")// 允许头部设置
     *             .allowCredentials(true);  // 是否发送cookie
     */

    //以上这段代码等于@CrossOrigin(allowCredentials = "true")
}

如果用原生的AJAX是加载本地文件就不会出现错误。当然,这个jquery的load放在服务器上通过http加载还是支持的。也有例外比如在firefox和ie浏览器使用$.ajax加载本地html或txt文件时,不会报错。

当其他浏览器控制台弹出下面报错,表明这个不支持跨域浏览本地文件

Access to XMLHttpRequest at ‘file:///F:/%E4%BB%A3%E7%A0%81/Jquery/a.txt’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

其实 ,禁止跨域是浏览器的安全限制机制,在每个浏览器下都有,如在chrome、Firefox、opera 、360 都是这样的,同样会报告上述错误,但是可以通过设置来绕过这个限制(如果经常 完前端代码 建议在本机装个web容器。。。),常见的方式是 右击chrome快捷方式,选择“属性”,在“快捷方式”下的“目标”中添加" --allow-file-access-from-files"(最前面有个空格),重启chrome即可如下:

“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” –allow-file-access-from-files   //注意有空格,关闭浏览器然后重启浏览器即可支持

Jquery的load()一般是加载服务器上的文件(非本地文件),这个概念需要弄清楚。要发布网站后通过http协议进行访问,本地file协议浏览会产生跨域问题。
除非是静态文件html调用load,但是这个也是有的浏览器支持,有的不支持。

在这里插入图片描述
加载js文件时使用了file协议,该协议会导致跨域,而使用htpp、https等协议时则没有跨域问题。而使用file协议则是因为在浏览器中查看html文件时没有起服务!平时使用webstorm时会自动起服务,所以没有注意到这个问题。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

本地HTML访问后端获取数据使用@CrossOrigin仍出现跨域问题 的相关文章

  • 如何解决错误:java.lang.ClassNotFoundException:io.netty.util.concurrent.GenericFutureListener?

    昨天我第一次尝试用 Java 制作 Prometheus 客户端 从 Python 开始 最后是 GoLang 是否找到示例 import io prometheus client Counter import io prometheus
  • 如何在 OpenAPI 3.0 中定义字节数组

    我正在将 API 从 Swagger 2 0 迁移到 OpenAPI 3 0 在 DTO 中 我有一个指定为字节数组的字段 Swagger 对 DTO 的定义 Job type object properties body type str
  • Java:检查给定日期是否在当前月份内

    我需要检查给定的日期是否在当前月份 我编写了以下代码 但 IDE 提醒我getMonth https docs oracle com javase 7 docs api java util Date html getMonth and ge
  • z-index 属性到底如何工作?

    如何z index实际上工作吗 它是否对未指定的元素起作用position 它是否支持具有指定的元素 即将它们放在顶部 position 像这样的数字必须是负数吗 div below div div less below div div o
  • Maven 多模块项目结构问题

    自从过去几周构建我的 Maven 多模块项目以来 这是我的一次有趣的经历 当我决定使用 Maven 进行构建生命周期管理时 我有几个原因希望选择 Maven A 大多数开发团队都是分开的 这样每个团队都可以在项目中的单独模块上工作 例如团队
  • 我们可以在三元运算符(Java)中使用命令吗?

    这是一个工作代码 String a first String b second String object System out println object null a b 但它不是 String a first String b se
  • document.registerElement - 为什么我们需要指定“prototype”和“extends”?

    考虑我想扩展本地button元素 并创建我自己的super button元素 据我所知 它必须遵循以下模式 var SuperButton document registerElement super button prototype Ob
  • 使用 Jquery 更改 css 属性时的事件检测

    有没有办法检测元素的 显示 css 属性是否更改 是否更改为无 块或内联块 如果没有的话有什么插件吗 谢谢 Note 突变事件 https developer mozilla org en US docs Web Guide Events
  • 会话 bean 中的 EntityManager 异常处理

    我有一个托管无状态会话 bean 其中注入了 EntityManager em 我想做的是拥有一个具有唯一列的数据库表 然后我运行一些尝试插入实体的算法 但是 如果实体存在 它将更新它或跳过它 我想要这样的东西 try em persist
  • grails 上的同步块在 Windows 上有效,但在 Linux 上无效

    我有一个 grails 应用程序 它依赖于服务中的同步块 当我在 Windows 上运行它时 同步按预期工作 但当我在 ams linux 上运行时 会出现 StaleObjectStateException 该问题在以下示例中重现 cla
  • 使用外部硬盘写入和存储 mysql 数据库

    我已经设置了 mysql 数据库在我的 Mac 上使用 java 和 eclipse 运行 它运行得很好 但现在我将生成大约 43 亿行数据 这将占用大约 64GB 的数据 我存储了大量的密钥和加密值 我有一个 1TB 外部我想用作存储位置
  • 使用 MailTo 链接,我可以向发件人发送副本吗?

    我们开发了一个非常简单的表单 一旦提交 就会填充一封电子邮件以发送支持票证 这些电子邮件目前发送给我们的 支持人员 但如果我们也能向发件人发送一份副本 那就更理想了 我们正在使用 mailto 链接 这可能吗 例如 我们的员工 Brad 填
  • 如何保存包含框架/iframe 的完整 html 页面?

    在网页抓取期间 我想将当前页面的 html 保存到文件中以供以后调试 browser html在大多数情况下有帮助 但是当页面包含 iframe frame 时 它 的内容不会返回browser html 我必须用类似的东西单独得到它bro
  • 用 Java 创建迷宫求解算法

    我被分配了用 Java 创建迷宫求解器的任务 这是任务 Write an application that finds a path through a maze The maze should be read from a file A
  • RMI 服务器:rmiregistry 或 LocateRegistry.createRegistry

    对于服务器端的RMI 我们需要启动吗rmiregistry程序 或者只是调用LocateRegistry createRegistry 如果两者都可以的话 各有什么优点和缺点 他们是同一件事 rmiregistry是一个单独的程序 您可以从
  • 为什么-标签没有关闭

    这是一个普遍问题 我的教授都无法回答 为什么我不必关闭 HTML 中的标签 所有其他标签都必须关闭 例如 or 那么为什么不呢 首先 它根本不是一个标签 在名义上基于 SGML 或 XML 的 HTML 版本中 它是文件类型声明 它具有在
  • HTML5 画布将颜色应用于形状重叠的图像

    我将此图像绘制到 HTML5 画布上 我想做的就是只给它的一部分应用颜色 我想要应用颜色的部分由以下覆盖图像定义 所以 基本上 我想通过叠加来指导我的着色 因此 在覆盖像素与主图像像素相遇的地方 我应该在主图像上应用颜色 至少我认为它是这样
  • 监控 Java 应用程序上的锁争用

    我正在尝试创建一个小基准 在 Groovy 中 以显示几个同步方法上的高线程争用 当监控自愿上下文切换时 应该会出现高争用 在 Linux 中 这可以通过 pidstat 来实现 程序如下 class Res private int n s
  • 日期时间解析异常

    解析日期时 我的代码中不断出现异常错误 日期看起来像这样 Wed May 21 00 00 00 EDT 2008 这是尝试读取它的代码 DateTimeFormatter formatter DateTimeFormatter ofPat
  • 使用 Android 的 Mobile Vision API 扫描二维码

    我跟着这个tutorial http code tutsplus com tutorials reading qr codes using the mobile vision api cms 24680关于如何构建可以扫描二维码的 Andr

随机推荐