Image: sideload external images on the server when uploading to the library#29
Conversation
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
…ibrary Uploading an image inserted by URL to the media library read the remote image's bytes in the browser with window.fetch and posted the resulting blob. Under cross-origin isolation, which client-side media processing requires, that cross-origin fetch is blocked, so the upload could not complete. Accept a `url` parameter on the attachments create endpoint and sideload the remote image on the server instead, storing only the original file (no sub-sizes). The image block and the pre-publish external-media panel use this path through a new mediaSideloadFromUrl editor setting, so external uploads work regardless of cross-origin isolation. The now-unused client-side fetch helper is removed.
610d035 to
e2e1a55
Compare
|
Size Change: -261 B (0%) Total Size: 8.6 MB 📦 View Changed
|
Cover the server-side external image sideload path that backs the cross-origin-isolation fallback: - PHP: exercise the `url` param branch on POST /wp/v2/media, asserting it sideloads the remote image, generates no sub-sizes when generate_sub_sizes is false, attaches to the parent post, propagates download errors, and registers the `url` arg on the creatable route. - JS: unit test mediaSideloadFromUrl for the request shape, attachment transform, post/wp_id resolution, and error handling.
What
Extends the attachments REST endpoint (
POST /wp/v2/media) to accept an optionalurlparameter. When present, the server downloads the remote image withdownload_url()and sideloads it, storing only the original (no sub-sizes), instead of the browser fetching the bytes and posting a blob.The image block "Upload to Media Library" action and the pre-publish "External media" panel use this server-side path through a new
mediaSideloadFromUrleditor setting.Why
When the editor is cross-origin isolated — which client-side media processing requires (
Document-Isolation-Policy: isolate-and-credentialless) — the previous client-sidewindow.fetch()of the remote image is blocked by CORS for hosts that do not send the needed headers, so external uploads silently failed. Letting the server fetch the URL avoids browser CORS entirely.Stacked on WordPress#79342 (which introduces the editor cross-origin isolation).
Testing
test/e2e/specs/editor/blocks/image.spec.js"should upload external image to media library" and "should upload through prepublish panel" pass with cross-origin isolation active (Chrome 148).201with no sub-sizes (emptymedia_details.sizes), so the front end serves only the original (no srcset).