进在开发公司的文件中心组件,提供各个子系统的附件上传下载、预览、版本更新等功能,前端在今天突然给我发一张图,说预览缩略图遇到问题了,然后发了个截图给我:

这很明显是一个跨域问题,

X-Frame-Options HTTP 响应头是用来给浏览器指示允许一个页面可否在 <frame>, <iframe>或者 <object> 中展现的标记。网站可以使用此功能,来确保自己网站的内容没有被嵌到别人的网站中去,也从而避免了点击劫持 (clickjacking) 的攻击。

X-Frame-Options 有三个值:

DENY

  表示该页面不允许在 frame 中展示,即便是在相同域名的页面中嵌套也不允许。

SAMEORIGIN

  表示该页面可以在相同域名页面的 frame 中展示(一般默认是这种)。

ALLOW-FROM uri

  表示该页面可以在指定来源的 frame 中展示。

此处很明显需要在中间件里面修改一下响应头的X-Frame-Options属性,core的中间件流程如下:

所以我们需要实现一个响应头的增删集合类:

    /// <summary>
/// 响应头的增删集合
/// </summary>
public class SecurityHeadersPolicy
{
public IDictionary<string, string> SetHeaders { get; }
= new Dictionary<string, string>(); public ISet<string> RemoveHeaders { get; }
= new HashSet<string>();
}

然后实现一个增删响应头的中间件:

/// <summary>
/// 中间件实现
/// </summary>
public class SecurityHeadersMiddleware
{
private readonly RequestDelegate _next;
private readonly SecurityHeadersPolicy _policy; public SecurityHeadersMiddleware(RequestDelegate next, SecurityHeadersPolicy policy)
{
_next = next;
_policy = policy;
} public async Task Invoke(HttpContext context)
{
IHeaderDictionary headers = context.Response.Headers; foreach (var headerValuePair in _policy.SetHeaders)
{
headers[headerValuePair.Key] = headerValuePair.Value;
} foreach (var header in _policy.RemoveHeaders)
{
headers.Remove(header);
} await _next(context);
}
}

提供响应头的增删方法:

    /// <summary>
/// 响应头的增删方法
/// </summary>
public class SecurityHeadersBuilder
{
private readonly SecurityHeadersPolicy _policy = new SecurityHeadersPolicy();
public SecurityHeadersBuilder AddCustomHeader(string header, string value)
{
_policy.SetHeaders[header] = value;
return this;
}
public SecurityHeadersBuilder RemoveHeader(string header)
{
_policy.RemoveHeaders.Add(header);
return this;
}
public SecurityHeadersPolicy Build()
{
return _policy;
}
}

然后我们需要一个中间件的拓展方法:

    /// <summary>
/// 中间件拓展方法
/// </summary>
public static class UseSecurityHeaders
{
public static IApplicationBuilder UseSecurityHeadersMiddleware(this IApplicationBuilder app, SecurityHeadersBuilder builder)
{
SecurityHeadersPolicy policy = builder.Build();
return app.UseMiddleware<SecurityHeadersMiddleware>(policy);
}
}

然后就是在startup的Configure方法中注册我们的中间件:

            //允许iframe嵌入资源
app.UseSecurityHeadersMiddleware(new SecurityHeadersBuilder()
.AddCustomHeader("X-Frame-Options", "AllowAll")
);

我在这里使用的值是“AllowAll” 而不是“ALLOW-FROM uri” 是为了方便测试,如果开发的话应该是需要进行配置的,到这里再嵌入网页即可成功。

1 Refused to display ‘url’ in a frame because it set 'X-Frame-Options' to 'sameorigin' 怎么解决?的更多相关文章

  1. 14、运行Django时浏览器中遇到Refused to display 'url' in a frame because it set 'X-Frame-Options' to 'deny'

    问题:Refused to display 'url' in a frame because it set 'X-Frame-Options' to 'deny' 解决办法: 只需要在 Djagno ...

  2. Refused to display '[url]' in a frame because it set 'X-Frame-Options' to 'Deny'.

    X-Frame-Options是一个HTTP标头(header),用来告诉浏览器这个网页是否可以放在iFrame内.例如: X-Frame-Options: DENY X-Frame-Options: ...

  3. linux中上传文件出现Refused to display 'http://***' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

    刚开始出现这个问题,去百度了一下,网上很多答案都是一致的,但是在我这里没有解决问题.这个问题服务器没有打印日志.说明没有访问到服务器上,但是前端又没有问题,很奇怪,后面终于有一个同事和我说会不会是腾讯 ...

  4. odoo开发笔记 -- 跨域Refused to display in a frame because it set 'X-Frame-Options' to 'DENY'

    场景描述: odoo界面嵌入iframe,Refused to display in a frame because it set 'X-Frame-Options' to 'DENY' 跨域请求失败 ...

  5. 区别CSS中display:box;inline;none以及HTML中 <frame> 标签<table> 标签的 frame 属性

    区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...

  6. 2.7.2 元素定位:frame 内定位 driver.switch_to.frame()

    来源: http://blog.csdn.net/anniejunyan/article/details/23257327  Selenium + Webdriver 学习(五) frame下元素定位 ...

  7. url参数中出现+、空格、=、%、&、#等字符的解决办法

    url出现了有+,空格,/,?,%,#,&,=等特殊符号的时候,可能在服务器端无法获得正确的参数值,如何是好?解决办法将这些字符转化成服务器可以识别的字符,对应关系如下:URL字符转义 用其它 ...

  8. Atitit.404错误解决标准流程and url汉字中文路径404错误resin4 resin chinese char path 404 err解决

    Atitit.404错误解决标准流程and 错误resin4 resin chinese char path 404 err解决 1. #原因解析 1 2. #解决方式 2 3. 输出图片流... 2 ...

  9. 如何在一个frame中调用另一个frame中的javascript函数

    1.htm <script language="javascript">function test(){alert("测试")}</scrip ...

随机推荐

  1. MediaPlayer: MediaPlayer中的prepare方法和prepareAsync方法的区别

    prepare方法是将资源同步缓存到内存中,一般加载本地较小的资源可以用这个,如果是较大的资源或者网络资源建议使用prepareAsync方法,异步加载.但如果想让资源启动,即start()起来,因为 ...

  2. jenkins报错集合

    可能会碰到以下报错: 1)这里的失败原因是因为运行jenkins程序的是jenkins用户,我们连接节点的秘钥是root的,所以现在连接不上 打开配置文件/var/lib/jenkins 将jenki ...

  3. Mysql迁移由于字符集导致乱码的数据

    有时候会在不注意的情况下创建了字符集为latin1的数据库,导致后续插入的中文显示乱码.这时有两种方法:1.修改数据库与数据表的字符集(只能向上调整,不能向下调整):2.数据迁移.但是两种方法都需要做 ...

  4. 123456------com.threeapp.erTongHuiHua01-----儿童绘画游戏01

    com.threeapp.erTongHuiHua01-----儿童绘画游戏01

  5. ubuntu18.04 install rar

    sudo apt-get update #如果好久没有更新资源建议update一次 sudo apt-get install rar #安装rar sudo apt-get install unrar ...

  6. 动态PHP电商网站伪静态的 Nginx反向代理Cache缓存终极设置

    转自: http://www.ttlsa.com/nginx/dynamic-php-nginx-cache/

  7. 偶尔在网上看到的,相对比较好的c#端订单号生成规则

    偶尔在网上看到的,相对比较好的c#端订单号生成规则 public class BillNumberBuilder{     private static object locker = new obj ...

  8. 01.轮播图之三 : collectionView 轮播

    个人觉得 collection view 做轮播是最方便的,设置下flowlayout 其他不会有很大的变动,没有什么逻辑的代码 let's begin…… 创建自定义的view .h 声明文件 @i ...

  9. 最新 哔哩哔哩java校招面经 (含整理过的面试题大全)

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.哔哩哔哩等10家互联网公司的校招Offer,因为某些自身原因最终选择了哔哩哔哩.6.7月主要是做系统复习.项目复盘.Leet ...

  10. 谈谈NPM和Webpack的关系

    为什么有NPM: 当包引入数量很多时管理就成为了一个问题,这个就是npm为开发者行了方便之处,npm已经为你做好了依赖和版本的控制,也就是说使用npm可以让你从繁杂的依赖安装和版本冲突中解脱出来,进而 ...