Gutenberg breaks completely if site URL is not the same as wordpress URL #1761

hedgefield · 2017-07-06T12:09:17Z

Issue Overview

I have wordpress installed on domain1/subdirectory, but I set up an addon domain (domain2) to be the main way to visit the site. Wordpress supports this by allowing you to change the site address to be different from the actual wordpress address in settings. However, this breaks gutenberg entirely because of WP-NONCE.

Steps to Reproduce (for bugs)

Get a hosting account and a domain (domain1)
Install wordpress in a subdirectory
buy another domain (domain2)
set domain2 as addon domain, pointing to domain1/subdirectory (because I want people to end up on domain2/permalink-to-post, not domain1/subdirectory/permalink-to-post
install gutenberg
open gutenberg (new post or demo, doesn't matter) and see a white screen

Expected Behavior

For gutenberg to function as intended (or even load at all).

Current Behavior

Because the site URL and the wordpress URL differ, loading gutenberg throws the following errors:

XMLHttpRequest cannot load http://<domain1>/wp-json/wp/v2/. Request header field X-WP-Nonce is not allowed by Access-Control-Allow-Headers in preflight response.

GET http://<domain1>/wp-json/jetpack/v4/jitm?message_path=wp%3Agutenber…erg-demo%3Aadmin_notices&query=page%253Dgutenberg-demo&_wpnonce=49a5b82bc9 403 (Forbidden)

Related Issues and/or PRs

I've had contact with Automattic about this before, because gutenberg is not the only thing that breaks. Jetpack has been broken on my site for a long time. And the Customizer, too, does not work at all in a setup like this. Neither does Yoast's onboarding wizard and text link counter tool.

They told me this was related to a wontfix in core:
WP-API/WP-API#1898
https://core.trac.wordpress.org/ticket/34921

The above could be lived with (I have for some years now), but if the core editor in wordpress breaks, that's another story.

First question: is there a better way to create this setup (without getting a second hosting account)? If so, that might render the problem moot (at least for me).
Second question: If not, what can be done about this?

The text was updated successfully, but these errors were encountered:

kraftbj · 2017-07-06T13:57:23Z

For the sake of testing, what plugin are you using for the domain mapping or are you simply setting different domains in Settings->General?

hedgefield · 2017-07-06T14:38:32Z

Yes, I've changed it in settings. The domain itself is marked as an addon domain via Godaddy (so at the host level). I could grant someone access to my backend if it's hard to reproduce.

nylen · 2017-07-06T20:20:23Z

cc @rmccue - anything we can do about this? Seems like we should fix this case in general

hedgefield · 2017-07-20T09:55:36Z

☝️ bump.

hedgefield · 2017-08-07T10:52:50Z

Tested again today with v0.7.1, and the editor appears! Typing, inserting, adjusting settings, it seems to work. That's a big improvement, so great job, whoever has been working on this!

Only thing now is that I cannot save.

When it tries to autosave, it says "updating failed" and throws this error in the console (the ones with the numbers in front):

Same for manual saving. Demo post, new post, doesn't matter.

hedgefield · 2017-12-05T10:52:50Z

Tested again today with 1.8.1, and the editor appears for a brief moment, then the whole screen goes white, with these errors in the console:

youknowriad · 2017-12-22T13:09:25Z

I believe the hasClass error here is a metabox related issue that has been fixed. Could you reproduce this with the latest changes?

hedgefield · 2017-12-23T15:24:13Z

No, so that's fixed in 1.9.1. 👍 Now I'm back to the nonce errors during saving attempts. 🙃

devjack · 2018-02-17T09:07:22Z

I too have encountered this. The workaround seems to be getting the WP API to include "X-WP-Nonce" in the "Access-Control-Allow-Headers" header.

Something like this in a theme/plugin gets me a step further.

add_action( 'rest_api_init', function() {
	remove_filter( 'rest_pre_serve_request', 'rest_send_cors_headers' );
	add_filter( 'rest_pre_serve_request', function( $value ) {
		header( 'Access-Control-Allow-Headers: Authorization, X-WP-Nonce');
		header( 'Access-Control-Allow-Origin: *' );
		header( 'Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE' );
		header( 'Access-Control-Allow-Credentials: true' );
		return $value;	
	});
}, 15 );

Unfortunately, this leads me to get 403's on the API auth with an invalid nonce. My guess is that the different site_url invalidates the none. That would follow since the logged_in session cookie seems to be used in the validity check for the nonce. TLDR; I'm assuming API calls must be made to and from the same domain as the API for a valid nonce.

Given that the same install is running WP I wonder if gutenberg could somehow wrap get_rest_url() and encourage it strongly to return the current wp-admin hostname for API discovery (similar to renaming the base path via rest_url_prefix?

Since this is outstanding for a few months, I'm reproducing in current Gutenberg 2.2.0.

doug-gv · 2018-02-28T15:41:13Z

Experiencing this on my production blog right now. We serve on a subdomain and mount on our app using a reverse proxy. Some resources also seem to have problems.

Current workaround is to export from a staging blog, then import and publish using classic editor.

danielbachhuber · 2018-05-10T00:15:43Z

Hi folks,

Given the impact of this issue was a deliberate design decision for the REST API, it doesn't seem like something we're going to address in core at this point. Those affected by this issue can mitigate it by sending custom headers.

Let's move any future discussion back to the core Trac ticket: https://core.trac.wordpress.org/ticket/34921

Savageman · 2018-08-14T13:44:28Z

Here's what I did to make it work (I only have 1 site):

add_filter('rest_url', function($url) {
    $url = str_replace(home_url(), site_url(), $url);
    return $url;
});

TWGerard · 2019-01-17T21:58:00Z

This issue is breaking a production site for me now too. Thanks WordPress.

guidevine-devops · 2019-01-18T18:59:11Z

I can't imagine this is an uncommon use case.

I have a blog on wordpress
I want that blog to appear on my railswebsite.com/blog/slug

There's gotta be a way!

Right now we publish to Netlify, slurp down the static files with their end point distributed resources, and then save them to our public/blog directory

charlestonsoftware · 2019-02-12T13:41:41Z

An article on configuring nginx for sites that are installing WordPress in a subdirectory and have "pretty permalinks" (anything but 'Plain' permalinks set) in use. I found you must not only account for "pushing" requests to serve content to the /subdir/ via the web config but also rewrite the /wp-json/ URIs.

http://lance.bio/2019/02/12/nginx-installing-wordpress-in-a-subdirectory/

HTH.

doug-gv · 2019-02-13T14:45:31Z

Thanks for the tip. The problem is not that we can't mount the blog on our domain, it's that Gutenberg editor breaks when you do this — can't CRUD any blog posts. Do you know if this has an effect?

rahulkhosla · 2019-03-21T21:28:23Z

I found a CORS policy guide for a similar issue I was having — which seemed to work perfectly! 👍

It basically mentioned to the same URLs (www / non-www) in your code.

Hope this helps someone else too.

Kelderic · 2019-11-04T19:28:09Z

Here's what I did to make it work (I only have 1 site):
add_filter('rest_url', function($url) {
    $url = str_replace(home_url(), site_url(), $url);
    return $url;
});

I tried this with WP 5.2, and it did not work. However, after combining it with what I saw here, it did work!

add_filter('rest_url', function($url) {
    $url = str_replace(home_url(), site_url().'/index.php', $url);
    return $url;
});

SirLouen · 2020-01-14T10:45:54Z

I tried this with WP 5.2, and it did not work. However, after combining it with what I saw here, it did work!
add_filter('rest_url', function($url) {
    $url = str_replace(home_url(), site_url().'/index.php', $url);
    return $url;
});

Have you used multiple domains for this? Not working for me, same errors as the one stated in the issue.

Kelderic · 2020-01-14T11:02:24Z

I tried this with WP 5.2, and it did not work. However, after combining it with what I saw here, it did work!
add_filter('rest_url', function($url) {
    $url = str_replace(home_url(), site_url().'/index.php', $url);
    return $url;
});
Have you used multiple domains for this? Not working for me, same errors as the one stated in the issue.

I have only used it for one site, which was a local installation. Not sure if that would make a difference.

SirLouen · 2020-01-14T11:17:22Z

I have only used it for one site, which was a local installation. Not sure if that would make a difference.

Which was your issue exactly with more precision to have some context?

Kelderic · 2020-01-14T13:08:48Z

Which was your issue exactly with more precision to have some context?

I have a WP installation that is installed not in the direct web root folder, but in a sub folder called 'www'. GutenBerg wasn't updating. It was throwing an error, because the API wasn't responding properly.

SirLouen · 2020-01-14T13:14:38Z

I have a WP installation that is installed not in the direct web root folder, but in a sub folder called 'www'. GutenBerg wasn't updating. It was throwing an error, because the API wasn't responding properly.

But this doesn't seem to have anything to do with OP issue.

Kelderic · 2020-01-14T13:17:02Z

I have a WP installation that is installed not in the direct web root folder, but in a sub folder called 'www'. GutenBerg wasn't updating. It was throwing an error, because the API wasn't responding properly.

But this doesn't seem to have anything to do with OP issue.

The site URL not matching the home URL happens when the site is installed in a sub folder.

SirLouen · 2020-01-14T14:08:11Z

The site URL not matching the home URL happens when the site is installed in a sub folder.

But in your case the issue is related with a subfolder with the same domain.
The op scenario is based on two different domains, which seems to be a completely different case.
I happen to have the same config as the OP (two domains) and the rest_url filter doesn't solve the issue.

By the way, I've tested

add_filter('rest_url', function($url) {
    $url = str_replace(home_url(), $_SERVER['HTTP_REFERER'].'index.php', $url);
    return $url;
});

And doesn't work either, home_url is domain1.com and $_SERVER['HTTP_REFERER'] is domain2.com but the

Request header field x-wp-nonce is not allowed by Access-Control-Allow-Headers in preflight response.

Is still there

doug-gv · 2020-01-14T15:26:58Z

Moved to SquareSpace, and used a different domain. Problem solved. Can't wait to never use WP again. Wordpress is simply not worth the hassle and cost of ownership. May the universe save your souls.

…

On Tue, Jan 14, 2020 at 6:08 AM SirLouen ***@***.***> wrote: The site URL not matching the home URL happens when the site is installed in a sub folder. But in your case the issue is related with a subfolder with the same domain. The op scenario is based on two different domains, which seems to be a completely different case. I happen to have the same config as the OP (two domains) and the rest_url filter doesn't solve the issue. — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#1761?email_source=notifications&email_token=AEZYYLJDIGYDPPBLXRRROXDQ5XBMZA5CNFSM4DR6FZ32YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEI4XIAQ#issuecomment-574190594>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AEZYYLKGDDUXPV5UJHFZWSTQ5XBMZANCNFSM4DR6FZ3Q> .

isuke01 · 2020-03-08T17:18:44Z

Will it be ever fixed?
I have tested rest_url and it looks correct, but for some reason Gutenberg doing incorrect requests =,="

callum-veloxcommerce · 2020-04-09T12:07:08Z

It is absolutely bizarre that Gutenberg API calls are calling the site URL instead of the Wordpress installation URL!

Whats the point of having these 2 seperated fields if it doesnt even serve its basic purpose. It is leaving us unable to use the WP REST API as a standalone headless content service and still be able to preview and click links in the editor to view your posts, it is not user friendly at all. Seems such a simple issue to fix and this issue seems to have been open for a long time.

TWGerard · 2020-04-11T02:44:35Z

I haven't used WordPress in years, surprised to hear that this super basic thing is still an issue. Happy to have moved on!

…

On Thu, Apr 9, 2020 at 8:07 AM Callum Carolan ***@***.***> wrote: It is absolutely bizarre that Gutenberg API calls are calling the site URL instead of the Wordpress installation URL! Whats the point of having these 2 seperated fields if it doesnt even serve its basic purpose. It is leaving us unable to use the WP REST API as a standalone headless content service and still be able to preview and click links in the editor to view your posts, it is not user friendly at all. Seems such a simple issue to fix and this issue seems to have been open for a long time. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#1761 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABLSIMMUNKBRSPFYUXWG3VLRLW27XANCNFSM4DR6FZ3Q> .

amazingmarvin · 2021-05-31T09:44:45Z

Ran into this issue too. Had blog at https://blog.amazingmarvin.com and wanted to migrate to https://amazingmarvin.com/blog/. I guess this is a somewhat common use case! So I made a new subdomain, blogger.amazingmarvin.com, which is a cloudfront origin for amazingmarvin.com/blog/. I setup an nginx rewrite for /blog/xyz -> xyz. Then I setup nginx to 301 all the old links to the new links. So now WP_HOME is amazingmarvin.com/blog, and WP_SITEURL is blogger.amazingmarvin.com. That way I can continue to login and edit there, while my users are served via cloudfront. Everything works nicely except that all the wp-json requests are hitting cloudfront whereas I would have expected them to use WP_SITEURL!

The workaround didn't work for me (5.7.2), so I worked around by reverting to the Classic Editor plugin.

WillSquire · 2021-08-30T11:20:24Z

If you're using Root's Bedrock, you'll want to strip away the /wp too in the rest_url filter. See: https://wordpress.stackexchange.com/questions/348992/headless-wordpress-issue-with-plugin-path

u-till · 2021-09-07T15:11:23Z

Yo, how the frick is something fundamental as this not being addressed by Wordpress core team?? This renders Wordpress basically useless for headless use...

Also i had to append a "/" to the site URL for some reason..

add_filter('rest_url', function($url) {
  $url = str_replace(home_url(), site_url(). '/', $url);
  return $url;
});

philohelp · 2021-10-17T11:34:57Z

Hi, encountering the same problem here, are there any updates ?

moonmeister · 2021-12-13T21:38:23Z

Hi folks,

Given the impact of this issue was a deliberate design decision for the REST API, it doesn't seem like something we're going to address in core at this point. Those affected by this issue can mitigate it by sending custom headers.

Let's move any future discussion back to the core Trac ticket: https://core.trac.wordpress.org/ticket/34921

@danielbachhuber Can you explain why this was an intentional decision? Why would purposely break WP?

pinoceniccola · 2022-10-02T15:40:38Z

I spent a few hours on this too today. I can't believe this is considered a closed issue since this breaks the whole purpose of having a WP_SITEURL with a different WP_HOME.

mikeldoka1 · 2022-12-20T21:04:49Z

Why is this a closed ticket when this literally renders most headless setups useless

nylen added the [Type] WP Core Ticket Requires an upstream change from WordPress. Core Trac ticket should be linked. label Jul 6, 2017

hedgefield mentioned this issue Aug 2, 2017

Gutenberg conflicts with Grammarly chrome extention #2113

Closed

hedgefield mentioned this issue Oct 19, 2017

Preview link broken until post is saved for the first time #2544

Closed

2 tasks

hedgefield mentioned this issue Nov 6, 2017

How to debug "Updating failed" and "Publishing failed" #2565

Closed

aduth added the Core REST API Task Task for Core REST API efforts label Nov 8, 2017

jeffpaul modified the milestones: Merge Proposal, Core API Mar 24, 2018

vRobM mentioned this issue Mar 29, 2018

gutenberg_can_edit_post() may erroneously pass a WP_Post to current_user_can() instead of a post ID #5859

Closed

doug-gv mentioned this issue Apr 10, 2018

Custom HTML blocks don't load when WordPress is served out of a subdirectory #5374

Closed

2 tasks

danielbachhuber closed this as completed May 10, 2018

eliorivero mentioned this issue Aug 16, 2018

Gutenberg tries to access the WP Rest API using Site Address, not Wordpress Address #9044

Closed

youknowriad mentioned this issue Mar 27, 2019

Categories not showing when create a new post #14651

Closed

MattKevan mentioned this issue Mar 28, 2019

Error loading block: Cookie nonce is invalid getblocklab/block-lab#270

Closed

youknowriad mentioned this issue Apr 11, 2019

Unhandled promise rejection Error: "[object Object]" #12982

Closed

lukecarbis mentioned this issue Apr 14, 2019

Workaround for users with different Site Address and WordPress URL settings getblocklab/block-lab#285

Closed

drosendo mentioned this issue Jun 24, 2019

Cant work with gutenberg if site address diff #16266

Closed

isuke01 mentioned this issue Mar 25, 2020

Gutenberg uses wrong url for internal REST API requests #19459

Closed

moonmeister mentioned this issue May 20, 2021

[wpe-headless] Site URL conflict wpengine/faustjs#233

Closed

miscs mentioned this issue Sep 14, 2023

Problems when you define a site_url that is different from the home_url #54454

Open

justlevine mentioned this issue Oct 31, 2023

Settings not loading and JavaScript errors when site_url and home_url are on different domains AxeWP/wp-graphql-headless-login#95

Closed

3 tasks

Gutenberg breaks completely if site URL is not the same as wordpress URL #1761

Gutenberg breaks completely if site URL is not the same as wordpress URL #1761

Comments

hedgefield commented Jul 6, 2017 • edited Loading

Issue Overview

Steps to Reproduce (for bugs)

Expected Behavior

Current Behavior

Related Issues and/or PRs

kraftbj commented Jul 6, 2017

hedgefield commented Jul 6, 2017 • edited Loading

nylen commented Jul 6, 2017

hedgefield commented Jul 20, 2017

hedgefield commented Aug 7, 2017

hedgefield commented Dec 5, 2017

youknowriad commented Dec 22, 2017

hedgefield commented Dec 23, 2017

devjack commented Feb 17, 2018

doug-gv commented Feb 28, 2018

danielbachhuber commented May 10, 2018

Savageman commented Aug 14, 2018

TWGerard commented Jan 17, 2019

guidevine-devops commented Jan 18, 2019 • edited Loading

charlestonsoftware commented Feb 12, 2019

doug-gv commented Feb 13, 2019 • edited Loading

rahulkhosla commented Mar 21, 2019

Kelderic commented Nov 4, 2019

SirLouen commented Jan 14, 2020

Kelderic commented Jan 14, 2020

SirLouen commented Jan 14, 2020

Kelderic commented Jan 14, 2020

SirLouen commented Jan 14, 2020

Kelderic commented Jan 14, 2020

SirLouen commented Jan 14, 2020 • edited Loading

doug-gv commented Jan 14, 2020 via email • edited Loading

isuke01 commented Mar 8, 2020

callum-veloxcommerce commented Apr 9, 2020

TWGerard commented Apr 11, 2020 via email

amazingmarvin commented May 31, 2021

WillSquire commented Aug 30, 2021

u-till commented Sep 7, 2021 • edited Loading

philohelp commented Oct 17, 2021

moonmeister commented Dec 13, 2021 • edited Loading

pinoceniccola commented Oct 2, 2022

mikeldoka1 commented Dec 20, 2022

hedgefield commented Jul 6, 2017 •

edited

Loading

hedgefield commented Jul 6, 2017 •

edited

Loading

guidevine-devops commented Jan 18, 2019 •

edited

Loading

doug-gv commented Feb 13, 2019 •

edited

Loading

SirLouen commented Jan 14, 2020 •

edited

Loading

doug-gv commented Jan 14, 2020 via email •

edited

Loading

u-till commented Sep 7, 2021 •

edited

Loading

moonmeister commented Dec 13, 2021 •

edited

Loading