Есть ли способ избежать X-Frame-Options в приложении CEF для Windows Chromium Desktop?

Question

Я создал простое приложение, используя предложенную «инициализацию приложения», а затем уронил предварительно скомпилированное ReactApp.В приложении есть браузер, который использует IFrame для размещения перемещаемых страниц, но на некоторых страницах выдает следующую ошибку:

Отказано в отображении 'https://www.theverge.com/' во фрейме, потому что установлено'X-Frame-Options' для 'sameorigin'. ", Источник: http://localhost:5000/#/

https://content -security-policy.com /

На странице вышеесть ряд способов, как этого можно избежать, и у Chromium есть флаг, который мог бы помочь, где он отключает безопасность и, как многие предлагали в других постах и ​​вопросах, может помочь с этой проблемой.

Помимо этихесть возможность написать обратный прокси-сервер, который потенциально мог бы позаботиться об этом.

В любом случае мне нужно знать, есть ли способ добиться этого с помощью параметров в инструменте «app»,что-то вроде:

app --unsecure
app publish --unsecure
app publish-exe --unsecure

Спасибо

Answer 1

Я пробовал несколько различных опций, включая Настраиваемые приложения .NET Core Desktop , в которые добавлен переключатель disable-web-security, который раньше работал:

static int Main(string[] args)
{
    var host = new WebHostBuilder()
        .UseKestrel()
        .UseContentRoot(Directory.GetCurrentDirectory())
        .UseStartup<Startup>()
        .UseUrls("http://localhost:5000/")
        .Build();

    host.StartAsync();

    var config = new CefConfig(Debug)
    {
        Args = args,
        StartUrl = startUrl,
        HideConsoleWindow = false,
        OnBeforeCommandLineProcessing = (processType, commandLine) => {
            commandLine.AppendSwitch("disable-web-security");                    
        }
    };

    return CefPlatformWindows.Start(config);
}

Но больше не появляется, это ограничение безопасности теперь встроено в Blink.

Использование прокси для удаления заголовков

Единственное решение, которое я смог получить, - это использовать прокси-сервер, который вызывает внутренний сервер .NET Core, который проксирует нижестоящий URL-адрес, но игнорируя заголовок X-Frame-Options.

Это легко сделать с помощью функции прокси ServiceStack , где вы можете зарегистрировать прокси на https://www.theverge.com, который удаляет заголовок X-Frame-Options с:

Plugins.Add(new ProxyFeature(
    matchingRequests: req => req.PathInfo.StartsWith("/theverge"),
    resolveUrl: req => $"https://www.theverge.com" + req.RawUrl.Replace("/theverge", "/")) {
    IgnoreResponseHeaders = {
        "X-Frame-Options"
    }
});

Это позволит вам встроить границу в ваше приложение с:

<iframe src="/theverge" style="width:100%; height:800px;" frameborder="0"></iframe>

Что будет отображать TheVerge в iframe, как ожидалось:

Рабочая демоверсия

Рабочий пример этого можно найти в ServiceStack.CefGlue.Win64.AspNetCore :

Startup.cs

public class Startup
{
    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        app.UseServiceStack(new AppHost());

        app.Run(context =>
        {
            context.Response.Redirect("/metadata");
            return Task.FromResult(0);
        });
    }
}

public class AppHost : AppHostBase
{
    public AppHost() : base("MyApp", typeof(MyServices).Assembly) { }

    public override void Configure(Container container)
    {
        Plugins.Add(new SharpPagesFeature());

        Plugins.Add(new ProxyFeature(
            matchingRequests: req => req.PathInfo.StartsWith("/theverge"),
            resolveUrl: req => "https://www.theverge.com" + 
                                req.RawUrl.Replace("/theverge", "/")) {
            IgnoreResponseHeaders = {
                "X-Frame-Options"
            }
        });
    }
}

[Route("/hello")]
public class Hello : IReturn<HelloResponse>
{
    public string Name { get; set; }
}

public class HelloResponse
{
    public string Result { get; set; }
}

public class MyServices : Service
{
    public object Any(Hello request) => 
        new HelloResponse { Result = $"Hello, {request.Name}!" };
}

ServiceStack.CefGlue.Win64.AspNetCore.csproj

<PackageReference Include="Microsoft.AspNetCore.Server.Kestrel" Version="2.*" />
<PackageReference Include="ServiceStack.CefGlue.Win64" Version="5.*" />
<PackageReference Include="ServiceStack" Version="5.*" />
<PackageReference Include="ServiceStack.CefGlue" Version="5.*" />
<PackageReference Include="ServiceStack.CefGlue.Win64" Version="5.*" />
<PackageReference Include="WinApi" Version="4.0.0" />

Вам также необходимо скопировать двоичные файлы CEF из ServiceStack.CefGlue.Win64 пакета NuGet с:

<ItemGroup>
    <Content Include="locales\*.*">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="swiftshader\*.*">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="*.pak">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="*.lib">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="*.dat">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="*.dll">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="*.bin">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    <Content Include="*.exe">
        <CopyToOutputDirectory>Always</CopyToOutputDirectory>
    </Content>
    </ItemGroup>

    <Target Name="CopyLinkedContentFiles" BeforeTargets="Build">
    <Copy SourceFiles="%(Content.Identity)"
            DestinationFiles="$(OutputPath)\%(Content.Link)"
            SkipUnchangedFiles="true"
            OverwriteReadOnlyFiles="true" />
</Target>

index.html

<!DOCTYPE html>
<html lang="en">
<body>
    <h1>X-Frame-Options Proxy Test</h1>
    <iframe src="/theverge" style="width:100%; height:800px;" frameborder="0"></iframe>
</body>
</html>