[wp-trac] [WordPress Trac] #40020: Customizer fails to load in Safari due to X-Origin Header mismatch

[WordPress Trac]

#40020: Customizer fails to load in Safari due to X-Origin Header mismatch
------------------------------------+------------------------------
 Reporter:  nickkeenan              |       Owner:  (none)
     Type:  defect (bug)            |      Status:  new
 Priority:  normal                  |   Milestone:  Awaiting Review
Component:  Customize               |     Version:  4.7.2
 Severity:  normal                  |  Resolution:
 Keywords:  has-patch dev-feedback  |     Focuses:
------------------------------------+------------------------------

Comment (by fullyint):

 == Summary

 Currently, if the Customizer's embed gives an `ALLOW-FROM` header, it must
 be same domain/origin due to #39128 and any specified path has no effect
 (discussed below). Thus, switching to `SAMEORIGIN` loses nothing. It
 achieves broader browser support (see added green boxes in table below).

 The path should probably remain absent from `frame-ancestors`, due to
 browsers' inconsistent treatment. If there is ever a day of cross-domain
 Customizer embeds, `frame-ancestors` can accept multiple `source`s.

 == Path in `ALLOW-FROM`

 It would be appealing to add the `path/to/customize.php` specificity to
 `ALLOW-FROM` but as you suspected, the path appears to be ignored. I find
 `ALLOW-FROM` discussed only as some other origin, like an opposite to
 `SAMEORIGIN`, never with a path. Also see this note from the
 [https://tools.ietf.org/html/rfc7034#section-2.1 X-Frame-Options spec]:
   The meaning of the term "serialized-origin" is given in
 [https://tools.ietf.org/html/rfc6454#section-7.1 RFC6454]... Any data
 beyond the domain address (i.e., any data after the "/" separator) is to
 be ignored."

 Perhaps the path specificity never worked but the perceived loss is
 limited because `ALLOW-FROM` would only apply to IE 11 and other older
 browser versions. Most modern browsers support [https://w3c.github.io
 /webappsec-csp/2/#frame-ancestors-and-frame-options frame-ancestors].
   If a resource has both policies, the `frame-ancestors` policy SHOULD be
 enforced and the `X-Frame-Options` policy SHOULD be ignored.

 == Path in `frame-ancestors`

 My impression is that browsers' implementation of `frame-ancestors` has
 not settled on the treatment of paths. In my tests (see table below),
 Firefox and Edge seem to ignore the path. So long as the origin is
 correct, all paths succeed, e.g.,
 {{{
 frame-ancestors https://example.com/nonexistent-path/
 }}}

 On the other hand, it seems that //any// path, even if correct, causes
 Chrome and Safari to block the embed.

 The fact that Firefox ignores the path in `frame-ancestors` (embed
 succeeds) but Chrome evaluates the path in some way (embed fails) may be
 an example of [https://bugzilla.mozilla.org/show_bug.cgi?id=1367531#c11
 this discussion at Firefox] for how to implement `frame-ancestors`.

 It seems safest for `frame-ancestors` to avoid paths until cross-browser
 treatment becomes more consistent.

 == Tests

 I did some informal manual testing related to `ALLOW-FROM` and `frame-
 ancestors`, their interaction, and the effect of adding a path to the
 `source`:

 ||    ||=  **IE**  =||=  **Edge**  =||=  **Firefox**  =||=  **Chrome**
 =||=  **Safari**  =||
 ||= **`ALLOW-FROM` supported?** =||  [[span(style=color: white;
 background: #39b54a, _ Y _)]]  ||  [[span(style=color: white; background:
 #39b54a, _ Y _)]]  ||  [[span(style=color: white; background: #39b54a, _ Y
 _)]]  ||  [[span(style=color: white; background: #c44230, _ N _)]]  ||
 [[span(style=color: white; background: #c44230, _ N _)]]  ||
 ||= **`SAMEORIGIN` supported?** =||  [[span(style=color: white;
 background: #39b54a, _ Y _)]]  ||  [[span(style=color: white; background:
 #39b54a, _ Y _)]]  ||  [[span(style=color: white; background: #39b54a, _ Y
 _)]]  ||  [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 ||= **`frame-ancestors` supported?** =||  [[span(style=color: white;
 background: #c44230, _ N _)]]  ||  [[span(style=color: white; background:
 #39b54a, _ Y _)]]  ||  [[span(style=color: white; background: #39b54a, _ Y
 _)]]  ||  [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 ||= **`frame-ancestors` override `ALLOW-FROM`?** =||  n/a  ||
 [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 [[span(style=color: white; background: #39b54a, _ Y _)]]  ||
 ||= **`ALLOW-FROM` honors path?** =||  [[span(style=color: white;
 background: #c44230, _ N _)]]  ||  [[span(style=color: white; background:
 #c44230, _ N _)]]  ||  [[span(style=color: white; background: #c44230, _ N
 _)]]  ||  n/a  ||  n/a  ||
 ||= **when `frame-ancestors`\\specifies a `source` with a path** =||  n/a
 ||  embed succeeds\\(path ignored)  ||  embed succeeds\\(path ignored)  ||
 embed fails  ||  embed fails  ||
 ||= **browser version tested** =||  11.371.16299.0  ||  41.16299.371.0  ||
 65.0.3325.181  ||  59.0.2  ||  11605.1.33.1.3  ||

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/40020#comment:10>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform