网站使用cdn后显示Access-Control-Allow-Origin跨域错误解决办法

 

前言 

今天在设置网站时,有一个资源显示Access-Control-Allow-Origin这个跨域错误,但是图片又是正常使用的,查了下文档也是解决了的,就想着写一篇文章记录一下,相信大家也是会遇到这个问题的。

为什么出现这个问题

首先了解一下,什么是跨域:跨域资源共享CORS(Cross-Origin Resource Sharing)简称跨域访问,是HTML5提供的标准跨域解决方案,允许网页从不同源加载和访问跨域资源,使得跨域数据传输得以安全进行

由于安全限制,浏览器一般会遵循同源策略(Same-Origin Policy),限制网页发起从不同域、子域、协议或端口加载和访问资源的请求,例如example.com无法访问example.org上的资源。通过配置跨域资源共享,可以在CDN服务器端设置相关的响应头,如果访问CDN资源时的请求携带了满足允许规则内的请求头,即可实现跨域资源的加载和访问。

以阿里云为例

登录CDN控制台。

在左侧导航栏,单击域名管理。

在域名管理页面,找到目标域名,单击操作列的管理。

在指定域名的左侧导航栏,单击缓存配置。

单击节点HTTP响应头页签。

单击添加,配置节点HTTP响应头。

请按照以下内容进行选择,设置指定允许的跨域请求的来源,然后单击确定保存配置。

配置示例

如果跨域资源共享的响应头值设置了单个或者多个值(多个值之间用“,”分隔)。

如果用户请求头里携带的“Origin”参数值与被设置的任意一个值精确匹配,就会响应对应的跨域头。

如果都没有精确匹配上,则不响应跨域头。

CDN上设置:Access-Control-Allow-Origin:http://example.com,https://aliyundoc.com。

如果用户请求携带的Origin头是http://example.com,则CDN节点将会响应Access-Control-Allow-Origin:http://example.com。

如果用户请求携带的Origin头是http://aliyundoc.com,则CDN节点将不会响应Access-Control-Allow-Origin(协议头不匹配,用户请求的是HTTP协议,CDN上设置的是HTTPS协议)。

如果用户请求携带的Origin头是https://aliyundoc.com,则CDN节点将会响应Access-Control-Allow-Origin:https://aliyundoc.com。

如果用户请求携带的Origin头是http://aliyun.com,则CDN节点将不会响应Access-Control-Allow-Origin(域名不匹配)。

本文作者:微信公众号:花摇响铃铛

 

原创文章,作者:速盾高防cdn,如若转载,请注明出处:https://www.sudun.com/ask/14629.html

Like (0)
速盾高防cdn的头像速盾高防cdn
Previous 2024年3月21日
Next 2024年3月21日

相关推荐

  • 哪个相亲网站真实可靠,哪个相亲网站好

    哪个相亲网站靠谱 交友网站已经成为现代人寻找浪漫伴侣的重要途径之一。随着市场的不断扩大,越来越多的交友网站出现,人们在选择时感到困惑。哪些交友网站可靠?本文将从以下几个角度进行分析…

    2024年4月28日
    0
  • 奥伊是什么?

    “oi”是一种网络流行语,是打招呼的拟声词,意思相当于“喂”。“oi”一词最初出现于博主“川子”模仿精神小伙的视频中,他通过发出“oioi”的声音来引起别人的注

    2024年9月28日
    0
  • 浅谈C++中的防御性编程

    浅谈C++中的防御性编程目录
    1.什么是防御性编程
    2.防御性编程技巧
    2.1.采用良好的编码风格
    2.2.合理使用assert
    2.3.检查函数参数
    2.4.使用异常处理
    2.5.避免裸指针
    2.6.资源管理
    2.7.最

    网站运维 2024年7月6日
    0
  • 数据库存储过程简介

    存储过程简介SQL语句需要先编译后执行,而存储过程(Stored Procedure)是一组为了完成特定功能的SQL语句集,经编译后存储在数据库中,用户通过指定

    2024年9月1日
    0

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注