如何限制将角度应用程序加载到iframe中

如何解决如何限制将角度应用程序加载到iframe中

我正在尝试限制将角度应用程序加载到iframe中，但无法做到这一点。

我有angular个应用独立于API运行。使用.net core 2.1实现API，使用angular 7实现UI客户端。

我在api middleware中尝试了以下不同的选项，但是在我的情况下没有一个起作用：

＃1

    app.Use(async (context,next) =>
    {
        context.Response.Headers.Add("Content-Security-Policy","frame-ancestors 'none'; " +
            "script-src 'self'; " +
            "style-src 'self'; " +
            "img-src 'self'");
        await next();
    });

＃2

    app.Use(async (context,next) =>
    {
        context.Response.Headers.Add("X-Frame-Options","DENY");
        await next();
    });

我已经超越了response header中的附加值，但仍然能够在其他应用程序的iframe中加载应用程序。

在angular/API边，我这里缺少什么吗？

添加了更多信息

我们使用IIS托管角度应用程序。还尝试了以下在角度应用程序的web.config中进行设置：

<httpProtocol>
    <customHeaders>
      <add name="X-Frame-Options" value="DENY" />
    </customHeaders>
</httpProtocol>

解决方法

为什么不在用户界面的服务器端提供标头？您正在使用什么服务您的角度应用程序？是Nginx吗？ apache httpd吗？它们都提供了在每个请求上返回标头的功能

编辑：在使用IIS时，确实确实是

<system.webServer>
  ...

  <httpProtocol>
    <customHeaders>
        <add name="X-Frame-Options" value="sameorigin" />
    </customHeaders>
  </httpProtocol>

  ...
</system.webServer>

但我对此一无所知

来源：https://www.keycdn.com/blog/x-frame-options