Communicate with my PHP API securely from ReactJS Axios - php

I’m wondering how we can make a secure call to our backend API. I created a form that sends the data to my backend API and which it does the processing. But what my question is that, even If I use JWT still the the Bearer token is visible in Header and can be stolen to make request with Postman or some-other applications. Is there any other way to communicate to my API securely. And kindly ask you to give solutions or articles or documentations linking to it. Or actually the following method is secure? Because there is no login form, it’s just a normal registration form for an event. I just need to store the data but communicate with my API securely from ReactJS.

Related

Could I benefit from jwt in my Vue app when using Vuex?

I am building a Vue app that uses pure PHP (no PHP framework) for its back-end. For my authentication system, I thought that using jwt(JSON Web Tokens) could help me. So I searched the web and found this article and also this one to help me build a login-register system with the help of jwt. I have no problem in implementing these articles in my front-part (Vue) and back-part (PHP) of my app. Currently I can send a request when the user register to the site and send back a jwt to the front-part with the help of firebase php-jwt library.
But the main question comes here. As I know from Vue ecosystem one of the reasons that we use Vuex is to store some data (state) globally in our apps and without calling a server we could use them anywhere (or in any route) in our Vue apps.
By reading one of that two articles, I noticed that finally the jwt is stored in Vuex and when the user wants to see an authorized page (a page that needs Authorization) the Vue app checks the Vuex to see if the token exists or not and if it exists, the app allows the user to see that page.
By reading the second one I noticed that jwt is useful when the user sends request to the back-part of site. In that case jwt is decoded and if it is valid (for example the expiration date is OK or ...), the user can access to an authorized page.
With the description above what is the benefit of using jwt in my Vue app? If I store just the id and user-name of user, it could do the same task for me. In other words, If I want to ask my question clearly, the problem is when I want to use Vuex and not send request every time to the server, I don't need and can't benefit from jwt (am I right?). Similarly when I want to use jwt, I could not benefit from Vuex. Because I must send request each time to find that the jwt is valid or not and after that decide about the user.
If I understood correctly and there is a contradiction for using both jwt and Vuex, why there are so many tutorials that speak about authentication a Vue app with jwt? Also if my understanding about jwt is correct, does that mean that when the jwt is expired I must ask the user to login again and again (regardless of using or not using Vuex)?
Could anyone please help me to have a better understanding about this problem to have better decision about my authentication system?
With the description above what is the benefit of using jwt in my Vue app?
JWT is used in authentication. You could use cookie sessions if you want.
I don't think it has an impact on your app. Probably save you some few round trips if your JWT happens to contain some data you need like user id.
the problem is when I want to use Vuex and not send request every time to the server.
I am not sure how these two are related.
If you need to make a request, then why would you use Vuex?
Vuex is a state management library.
If you need to do a request, then do a request.
Vuex does not relate to JWT in any way.
If you decided to put your JWT token in Vuex then that's your decision. Some put it in browser's localStorage or cookies.
Similarly when I want to use jwt, I could not benefit from Vuex. Because I must send request each time to find that the jwt is valid or not and after that decide about the user.
There's a lot of things you can store in Vuex that you don't need to do a request first:
Global component states e.g Login/Signup modals, NavMenu, Audio/Video player
Category filters like you see in Amazon or any shop-related apps
I am not sure what you are doing that you need to send request each time to find out if jwt is valid or not.
If something needs to be done on server-side then it has to be done on server-side whether you use jwt or cookies.
Also if my understanding about jwt is correct, does that mean that when the jwt is expired I must ask the user to login again and again (regardless of using or not using Vuex)?
JWT is a format. If you use OAuth2 for example, there's "access token" and "refresh token". You can get another "access token" automatically with "refresh token" and so that might mean you don't need to show login form again.
You could also just refresh your JWT token each time if you want. I'm not sure about the implications of that but there's a lot you can do.
These links might help you:
https://stackoverflow.com/a/36932032/10975709
https://stackoverflow.com/a/45214431/10975709
My question for you is:
If you were not to use JWT and instead just use cookies, how would things differ? (Aside from the technical aspects like needing to refresh tokens)
You are probably approaching/thinking/using JWT the wrong way.

How to sync authentification between Frontend, Backend and API?

I have a CodeIgniter App that is made of 3 parts:
The API, basically is a separate entity, with its own location
The CodeIgniter back-end that renders the pages
The FrontEnd of the app, mostly jQuery.
I have a login system based on session and cookies. Basically the authentification data is stored on the client (browser).
A user authentificates with email and password. The backend looks for a authentification cookie and knows if it is logged in or not. If I make an AJAX request to the API directly, the API also knows if the user is authentificated.
Problem: I want to render some data server-side (That means I need to make a call to the API from the backend. It's a server to server communication. They are located on the same machine. ).
The API tells the backend that it's not authentificated, because obviously no cookie is set on the backend.
How do you pass authentification data from backend to api?
I might pass the userID via a secure endpoint that can be accessed only via the server to server communication, but I don't like the idea.
Any solutions to this? I read about oAuth and JWT but don't understand how they might help me.
the API should be built on top of the back-end. meaning the request is handled by API, then activates a function in the back-end and sends a response back to the client who sent the request(according to the result of the function in the back end). JWT json web token, is a token provider which means once you log in you get back a token "string" that is stored in the data base, in the request for the API you add the token to the header named Authorization instead of sending user and password everytime and you can extract the user info out of the token itself.but still there is need to check the validity of user and pass somehow at the first time.
basically you should send from client to API, API to server and then for response server to API and API to client. by server i mean back-end.

Rest API security without authentication on external requests

I'm working with the WordPress REST API for the first time.
The idea behind the project is that once a POST request has been made to a custom endpoint, the data is escaped/cleaned up and then saved into the database through WP's own functions. I'm basically just collecting feedback submitted through a form on a site ( plus many other sites ) and send the data to another site (my own one).
How would you handle security in this case? I can't use oauth. What I'd like to do is just make sure the request has been genuinely made from that form.
Any ideas?
I recommend you use token authentication, use a signed token to validate the identity of the user who make a request. In this case JWT, you can choose the PHP JWT library you feel better using.

REST API backend for mobile application (android/iOS)

I am developing a backend for mobile app. I have developed a user authentication module where, the app will be sending the username and password as basic auth and if the user is authenticated I will sent back a jwt token which can be used in the rest of the requests.
On the client side, once after a user is logged in, the app shows him a feeds screen which contains some data.
Now do I need to seperate these two APIs? Like once a user is logged in successfully, he will be sent back the jwt token and well some user details. Should I sent the data which is required for the dashboard screen as well as a response for login? In that the case the app will get datas in a single api request (login) and doest have to make another call to my API.
Is this a right approach?
Ideally it should be kept seperately but I think that depends. If making that single request is (and will ever be) the only thing the application does, I see no reason for making 2 requests. You can simplify things by making just 1 request.
But, if your application is going to be extended or if its already got other features i think it is best to keep them seperate. Since then you'll have more flexibility with your application.
Yes ,You should separate those two authentication and dashboard REST API as-
It could be possible that there should be more client app using your Rest API in future and they may not require dashboard data.However you can have mechanism to share user detail in authentication API itself as you are anyway authenticating user .However share access token in authentication api along with it's expiration timestamp .Some of Client app which are using your REST API might have use case of autologout from app based on accesstoken get expire.In such case expiration time would help.

Preventing unauthorized access to my custom app

I am making a mobile application, and I have created an API to send JSON data to the app. The thing is if we called the API with www.domainname.com/example.php?listid=1 this will bring all the list information that has the id of 1. The issue I am having is figuring out how I can prevent an unauthorized user from accessing the API. I want the users to only be able to view the lists that they have created.
I am using PHP
You need to include a secure authentication token with all API requests.
(and validate it on the server)
You should probably also use SSL.

Categories