FortAwesome / wordpress-fontawesome

Font Awesome Official WordPress Plugin
Other
56 stars 19 forks source link

Can not update settings #36

Closed R3dRidle closed 5 years ago

R3dRidle commented 5 years ago

When I try to save the settings I get an error "Update failed". In the console log I get the following:

Failed to load resource: the server responded with a status of 405 () /wp-json/font-awesome/v1/config:1

Wich is odd since I am logged in with an admin.

Please advice

mlwilkerson commented 5 years ago

Hi @R3dRidle, thanks for the report. What version of WordPress are you running when you see this problem?

It sounds like maybe the REST API server isn't running, which is required for this plugin to function correctly. Newer versions of WordPress should have the REST server running by default.

R3dRidle commented 5 years ago

version 5.1

mlwilkerson commented 5 years ago

Can you check in the JavaScript console what you get when you look at the api_url our plugin is trying to use? You could run this in the JavaScript console when this plugin is loaded, preferably while you're on the plugin's options page.

window['wpFontAwesomeOfficial'].api_url
R3dRidle commented 5 years ago

"https://www.dev2.webtonproject.nl/wp-json/font-awesome/v1"

Note: on the moment we don't have an SSL certificate active, don't know if that could be the issue?

mlwilkerson commented 5 years ago

Let's just confirm that the REST API is running as expected. I think you should be able to do this and get a HTTP 200 responses for each of these. What kind of responses do you get?

curl -i https://www.dev2.webtonproject.nl/wp-json/wp/v2/posts

curl -i https://www.dev2.webtonproject.nl/wp-json/font-awesome/v1

R3dRidle commented 5 years ago

Yes, 2 times status 200 when I visit them with my browser. Knipsel

mlwilkerson commented 5 years ago

OK, can you show me the response in that Network pane when you get the 405?

I'm curious what the server is reporting along these lines:

The server MUST generate an Allow header field in a 405 response containing a list of the target resource's currently supported methods.

So I wonder what the response headers look like on that 405 response.

R3dRidle commented 5 years ago

Ofcouse I can: knipsel2

R3dRidle commented 5 years ago

More info:

Knipsel4 Knipsel3

mlwilkerson commented 5 years ago

🤔

R3dRidle commented 5 years ago

Hope you can figure out why it is happening, I can make a duplicate and give you access to test it out?

mlwilkerson commented 5 years ago

I'm not able to reproduce the problem in my environment. It makes me think there may be something going on with your web server configuration. The error seems to indicate that it's the HTTP PUT method that it doesn't allow.

If you run the following in your JavaScript console, it should show you what methods the Font Awesome plugin has routes for handling. When I do this in my environment, it results in both GET and PUT. What do you get?

fetch('https://www.dev2.webtonproject.nl/wp-json').then(response => response.json()).then(json => console.log(json.routes['/font-awesome/v1/config'].methods))
R3dRidl3 commented 5 years ago

Allso both: get-put

R3dRidle commented 5 years ago

Sorry, wrong account

R3dRidle commented 5 years ago

When i visit the link:https://www.dev2.webtonproject.nl/wp-json/font-awesome/v1/config manualy i get:

{"code":"rest_forbidden","message":"Je hebt geen toestemming om dat te doen.","data":{"status":401}}

And when i click on it in the console: (network tab) Method Not Allowed The requested method PUT is not allowed for the URL /wp-json/font-awesome/v1/config.

R3dRidle commented 5 years ago

Allso checked if it was one of the activated plugins or my theme, neither of both was the issue. The issue still persists.

Is it possible that the hosting is blocking this someway?

mlwilkerson commented 5 years ago

OK, I want to make sure that the PUT method works for WordPress in general with your current web server set up.

fetch('https://www.dev2.webtonproject.nl/wp-json/wp/v2/settings', { method: 'PUT', headers: {'X-WP-Nonce': window['wpFontAwesomeOfficial'].api_nonce, 'content-type': 'application/json'}, body: JSON.stringify({posts_per_page:7}) }).then(response => { console.log(`HTTP status: ${response.status}`); return response.json(); }).then(json => console.log(json.posts_per_page) )

This just makes a trival change to WordPress's general setting posts_per_page. You can see that setting in the normal admin UI under Settings->Reading: "Blog pages to show at most".

So you might want to check what the original setting is first, and then see if you can execute that command from your JavaScript console to change it. The command I've pasted above sets it to 7 and reports the status and the new value once changed. You could experiment with any number like you.

mlwilkerson commented 5 years ago

What do you see in the JavaScript console if you execute that command?

R3dRidle commented 5 years ago

Hm this is interesting, perhaps I don't understand fully, but https://www.dev2.webtonproject.nl/wp-json/wp/v2/users/me is giving me an error that I am not logged in.

R3dRidle commented 5 years ago

When I execute the code: Uncaught TypeError: Cannot read property 'api_nonce' of undefined

That is the response.

mlwilkerson commented 5 years ago

That Uncaught TypeError is due to something else: the fact that it can't find window['wpFontAwesomeOfficial']. You'll need to be on the options page of the Font Awesome plugin in order for that to work. Can you make sure you're on that page and then try again?

R3dRidle commented 5 years ago

Looks like i needed to do this on the FA settings page. So i did, it did not change the settings.

Response in console was: HTTP status: 405 VM183:1 Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0 at fetch.then.response (:1:315) fetch.then.response @ VM183:1 Promise.then (async) (anonymous) @ VM183:1

And when i look in the network tab and click on the executed code: The requested method PUT is not allowed for the URL /wp-json/wp/v2/settings

mlwilkerson commented 5 years ago

OK, so that's what I suspected: as far as I can tell, this doesn't have to do with our plugin. Because that REST API request was a PUT to /wp-json/wp/v2/settings, which is a WordPress core endpoint. Avoids our plugin entirely on the server.

I don't know why your server configuration isn't allowing PUT requests on the WordPress REST API, but that seems to be the problem, as far as I can tell at this point.

In other words, if you can't send a PUT to the core WordPress API, then you won't be able to send one to ours either.

R3dRidle commented 5 years ago

Ok, so I will contact out hosting tomorrow and report back to you.

mlwilkerson commented 5 years ago

Thanks. I'm interested to see how this turns out.

mlwilkerson commented 5 years ago

Also, you mentioned that https://www.dev2.webtonproject.nl/wp-json/wp/v2/users/me told you that you're not logged in. Bear in mind that authenticating with the WordPress REST API requires both that your login cookie is sent with the request, along with that X-WP-Nonce header that you see in my example fetch() above.

In the example, the cookie isn't mentioned because it's being sent implicitly when running fetch() from the JavaScript console. But if you try to hit that endpoint in some other way that doesn't send the login cookie, then don't expect authentication to succeed.

You can find the key and value for that cookie once you're logged in if you look under Application->Storage->Cookies->(relevant domain). Look for a cookie with a name like: wordpress_logged_in_47f007a56d426107bc5b52c10342db67

You can make sure your requests are sending that cookie by inspecting the request headers (as in your screenshots above), looking for that login cookie to be included in the Cookie request header.

R3dRidle commented 5 years ago

Turned out that the hosting indeed had not these functions enabled by default in the Apache configuration. Thank you for you helpd, you can set this to resolved.