问题
Building an hybrid app with the Ionic framework, I need to embed to one of my page an Iframe. My problem is that the page loaded with the iframe does have the following CSP:
"frame-ancestors http://foo.somedomain.com"
Which works just fine on my browser. However whenever I try this on the application itself the content is not loaded due to:
Refused to display 'http://foo.somedomain.com' in a frame because an ancestor violates the following Content Security Policy directive "frame-ancestors http://*.somedomain.com"
That make sense as the app request doesn't have a domain.
So my question is simply:
How can I identify my app (iOS and Android) in order to go through the frame-ancestors CSP?
I see that I can pass many things to that frame-ancestor: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors but I don't see how to validate that the request is coming from a mobile application.
回答1:
On android, you can follow the steps at https://github.com/ionic-team/cordova-plugin-ionic-webview to specify a custom domain and scheme to use. Namely:
<preference name="Hostname" value="app" />
<preference name="Scheme" value="https" />
The issue lies in Ionic's use of a webserver on iOS. Still trying to figure that one out.
来源：https://stackoverflow.com/questions/44957787/embedding-an-iframe-having-csp-2-0-in-a-mobile-app-frame-ancestors-issue