Theme Customizer: Add cross-domain handling for when the admin and front-end are different origins. Handles both ajax and postMessage calls. props rboren, mdawaffe, nacin. see #20507, #19910.

git-svn-id: http://core.svn.wordpress.org/trunk@20741 1a063a9b-81f0-0310-95a4-ce76da25c4cd

wp-includes/class-wp-customize.php

@@ -71,6 +71,18 @@ final class WP_Customize {
 		if ( ! isset( $_REQUEST['customize'] ) || 'on' != $_REQUEST['customize'] )
 			return;
 
+		$url = parse_url( admin_url() );
+		$allowed_origins = array( 'http://' . $url[ 'host' ],  'https://' . $url[ 'host' ] );
+		// @todo preserve port?
+		if ( isset( $_SERVER[ 'HTTP_ORIGIN' ] ) && in_array( $_SERVER[ 'HTTP_ORIGIN' ], $allowed_origins ) ) {
+			$origin = $_SERVER[ 'HTTP_ORIGIN' ];
+		} else {
+			$origin = $url[ 'scheme' ] . '://' . $url[ 'host' ];
+		}
+
+		@header( 'Access-Control-Allow-Origin: ' .  $origin );
+		@header( 'Access-Control-Allow-Credentials: true' );
+
 		$this->start_previewing_theme();
 		show_admin_bar( false );
 	}
@@ -198,8 +210,6 @@ final class WP_Customize {
 	 */
 	public function customize_preview_settings() {
 		$settings = array(
-			// @todo: Perhaps grab the URL via $_POST?
-			'parent' => esc_url( admin_url( 'themes.php' ) ),
 			'values' => array(),
 		);
 

wp-includes/js/customize-controls.dev.js

@@ -311,6 +311,10 @@
 
 			api.Messenger.prototype.initialize.call( this, params.url );
 
+			// We're dynamically generating the iframe, so the origin is set
+			// to the current window's location, not the url's.
+			this.origin.unlink( this.url ).set( window.location.href );
+
 			this.bind( 'url', function( url ) {
 				// Bail if we're navigating to the current url, to a different origin, or wp-admin.
 				if ( this.url() == url || 0 !== url.indexOf( this.origin() + '/' ) || -1 !== url.indexOf( 'wp-admin' ) )
@@ -343,7 +347,10 @@
 			if ( this.request )
 				this.request.abort();
 
-			this.request = $.post( this.url(), this.query() || {}, function( response ) {
+			this.request = $.ajax( this.url(), {
+				type: 'POST',
+				data: this.query() || {},
+				success: function( response ) {
 					var iframe = self.loader()[0].contentWindow;
 
 					self.loader().one( 'load', self.loaded );
@@ -351,6 +358,10 @@
 					iframe.document.open();
 					iframe.document.write( response );
 					iframe.document.close();
+				},
+				xhrFields: {
+					withCredentials: true
+				}
 			} );
 		}
 	});

wp-includes/js/customize-preview.dev.js

@@ -37,7 +37,7 @@
 
 		var preview, body;
 
-		preview = new api.Preview( api.settings.parent );
+		preview = new api.Preview( window.location.href );
 
 		$.each( api.settings.values, function( id, value ) {
 			api.set( id, value );