At the moment I'm using Wordpress as a Headless CMS with the frontend using Nuxt.js. Most of the time I use Wordpress to write the data and Nuxt to fetch it into the client with the REST API of Wordpress (WP).
I'm currently working on a new blog. I made a coming soon page where users can subscribe to get notified when the blog is live. With the WP plugin JSON Basic Authentication
, I succeed to make a POST request to the WP backend with Postman:
However by implenting and trying the POST Request into the Nuxt frontend, the browser gives the error Failed to load resource: net::ERR_HTTP2_PROTOCOL_ERROR
. See image below:
submitSubscriber(email) {
var clientId = "....";
var clientSecret = "....";
var authorizationBasic = window.btoa(clientId + ':' + clientSecret);
var myHeaders = new Headers();
myHeaders.append("Authorization", "Basic " + authorizationBasic);
myHeaders.append("Content-Type", "application/x-www-form-urlencoded");
myHeaders.append("Cookie", "wordpress_test_cookie=WP+Cookie+check");
var urlencoded = new URLSearchParams();
urlencoded.append("fields[email]", "randomemail@hotmail.com");
var requestOptions = {
method: 'POST',
headers: myHeaders,
body: urlencoded,
redirect: 'follow'
};
fetch("https://domainname.nl/wordpress/wp-json/wp/v2/subscribers", requestOptions)
.then(response => response.text())
.then(result => console.log(result))
.catch(error => console.log('error', error));
}
I tried using different forms of the request (like with axios) and also changed the .htaccess
file of the Worpdress site to allow all origins (just for testing), but even that didn't work:
Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Headers "origin, x-requested-with, content-type"
Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /wordpress/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /wordpress/index.php [L]
</IfModule>
Hopefully someone can help me and maybe explain where it goes wrong. Thanks in advance
Top comments (0)