Wordpress REST API authentication - ajax

I'm struggling with Wordpress REST API & authentication, I've went through tons of documentation and articles and videos, but still can't find answer that will clarify some things for me.
So here is what I'm trying to accomplish - I want to integrate Wordpress into existing static website (want to bring only recent posts to my homepage) and as advised in this post Integrate Wordpress recent posts into existing website i went for Wordpress REST API, which is very powerful and I managed to pull out only recent posts, but.......
Security issues:
If i use GET method in my AJAX call - it brings posts to my homepage right away easily.
If i use POST method - it asks for authentication.
Now from reading all articles I'm not even sure if it is safe to use GET method for this simple request or i have to use POST method?
Also, lot of people mentioned that if I use POST method without SSL (http instead of https) that it is not safe as well.
Is my website compromised if someone can see endpoint route in my request (e.g. http://somewebsite.com/wp-json/wp/v2/posts)?
Is it possible that someone can advise what is the best practice for my scenario?
GET or POST
Http or Https
Which authentication if i have to use one?
If i have to authenticate, where to store username and password - cookie or local storage?
Just keep in mind that i don't want to edit/add/delete any posts, just want to show them on my homepage, nothing else.
Please have understanding, since I am kind of a rookie when it comes to REST API
Thanks in advance

Generally it is always best to have SSLs on your sites.
If you are just attempting to display posts via an AJAX request you want GET request, and it is perfectly safe to use a GET request.
A POST request is used to create new content, which is why it is requiring authentication.

Related

using authenticated session/user for REST API in eXist-db

I have a public website running from an eXist app. I am now developing an interface for logged in users to edit certain documents through HTML forms and AJAX. I've set up a module in eXist to receive AJAX POST requests through the eXist REST interface (ie. http://www.example.com/exist/rest/db/myapp/api/myxquery.xql). However this module does not seem to be aware of the fact that the user is already logged in!
How do I get the REST module to use the session/authentication of the logged in user?
Am I required to store the user/password in the browser to pass with each REST API request?
If this is not the preferred model for passing data from the browser under user/password, what is eXist's recommended solution?
Many thanks in advance.
(A variation on this question was asked two years ago but received no solutions.)
In order to use the REST-API from existdb you can only authenticate each request using HTTP Basic Authentication. Also mentioned in the question you referenced.
If you decide to handle AJAX request in your app's controller.xql you will need to:
Add routes for your AJAX requests to the controller
Make sure you call login:set-user for the user session to be picked up
Make sure the AJAX request sends the cookie:
For instance, the fetch function will send the authorisation cookie
only if send-authorization is true.
Look at the output-method and serialization settings, since you will likely want to respond in JSON-format. useful blog post about this

A working way of authenticating and authorising Vuejs apps (with a Laravel Backend)?

I am making a VueJS app with a Laravel backend. I see Laravel has Passport which is used to authenticate/authorize APIs. (Sincerely I have not yet succeeded in integrating Passport. I have not understood where the starting point is. Will post that question separately).
I have done a lot of searching and still have not found the best/easiest way of doing authentication and authorization, and also interface control depending on permission. (I know "best" is subjective but basically means a method that is easy to integrate, understand and use).
Anyone who has been there and used one that worked really well?
I generally use JSON Web Tokens for my web and mobile apps. It's simpler to set up than Oauth and is a better fit for many applications.
Basically, the user sends a POST request containing their authentication details to the appropriate endpoint and receives a token in response. The user can then include that token in the Authorization header of future requests to authenticate them.
The token also includes a timestamp for when it expires, and it can be decoded on the client side so that an application can refresh the token before it expires.
There's an excellent implementation of JWT for Laravel which I use all the time and can highly recommend. There are also client-side libraries for handling JWT with pretty much every framework under the sun.
#MatthewDaly, I followed your recommendation and I stumbled on a VueJs-Laravel JWT implementation here: http://jimfrenette.com/2016/11/laravel-vuejs2-jwt-auth/
I followed through the Tutorial and was able to make it work for my case. (Caveat: The post is slightly old (using Laravel 5.2), but with good understanding of Vue and Laravel, you can be able to follow and implement it easily).

How to attach jwt token on every page after successful authentication?

I followed this code and implemented the jwt authentication successfully. I am using this authentication in my web application. I am able to get the token on the login page. After that how to attach that token to the header of all the subsequent requests. I stored the token in local storage, but when I navigate to next page after successful login before js loads, the page getting loaded with 401 error.
How should I achieve this?
The problem is you're trying to use token based security with the Web MVC architecture. I did a quick search for any tutorials on how to do it that way and all I was able to find is examples of REST APIs that use token based security.
The reason is that with Spring MVC, each link you click is going to redirect you to a controller endpoint that is going to render the HTML and send it back to the browser. Unless you somehow made every link on your site include the token in a header or perhaps used a cookie to store the token, you'll get a 401 error because the token isn't present in the request.
If you were to use Angular JS (or your favorite front end framework) with a REST backend, you'll be able to use the JS to put whatever you need in the header to make sure the user is authenticated and has access to the resource. There a lot of example projects out there that demonstrate how to do this.
Disclaimer I haven't been able to find a reliable source that definitively says that token based security is for REST only. I'm basing this on experience and readily what I see out there in terms of tutorials and how to articles.
Ich totally agree to the answer from blur0224, you have to set the token in the request header of every link on your pages. I don't know how to achieve this. Furthermore I think that JWT token based authentication is not the right way for MVC based app. I would use it in SPAs build with frameworks like Angularjs.
Why don't you use the 'standard' Spring authentication?

Sending authenticated ajax from another domain

Maybe this is not possible...
I have one site, we'll call it club.com
And I have another site called store.com
I have control of both domains. club.com is powered by a Django project, and store.com is a shopify site.
If you're a member of club.com, you get a discount on store.com
We want to do it so that integration is seamless. No need to enter your club.com credentials to store.com, we want the page to do that for you.
How do I implement this?
I already tried simply putting an ajax call on store.com pointing to club.com, and it seems to work with one exception: The browser is not sending the proper cookies along with the request, so when club.com gets this ajax request it can't authenticate it.
You should consider OAuth2 to achieve what you need.

Using AngularJS, how to make a cross-domain ajax request with basic authentication?

New to AngularJS, and trying to hit a web service with basic auth using either $http or $resource. I haven't written any services or directives and basically just trying to do a call in my controller. Initially I prepended my url with the user/pw separated by an '#' symbol and I also have a callback that does a console out on the returned payload. Now I'm trying to change the $http.defaults.headers.common['Authorization'], but I feel like I should be using $resources. Any assistance on how to do basic auth with $resource (or $http) would be greatly appreciated. Thanks.
$resources is a higher level abstraction that utilizes $http, so regardless of which one you choose to use, adding the Authorization header is a valid solution. Head over to the angular $http docs for information on how to do that.
If you're doing anything more than hard coding a user/password into your application, you might want to take a look at response interceptors as a way to catch 401s and have your user log in. I've studied this blog post in the past when I was looking for a way to build fluid authentication into my app. I'd definitely recommend it if you're thinking about going down that path.

Resources