AXIOS post request - missing url param - reactjs

I set a react webpage that has is structured as follow:
MAIN PAGE www.localhost:3000.com,
OTHER PAGES www.localhost:3000.com/services, www.localhost:3000.com/about, www.localhost:3000.com/contactMe.
I'm using axios from www.localhost:3000.com/contactMe to perform a post for a contact form that will send data thru my backend/nodemailer.
Using Postman to verify the post status, the post method is NOT working from www.localhost:3000.com/contactMe/api/contact and it works correctly for localhost:3000/api/contact and localhost:5000/api/contact.
How could I fix this Request failed with status code 404 from www.localhost:3000.com/contactMe/api/contact?
HOST: localhost:3000
SERVER: app.use('/api,...)
CONTROLLER: pouter.post('/contact',...)

One solution could be to just use the base URL and send the POST request to www.localhost:3000.com/api/contact from any page.
So even if the user is on www.localhost:3000.com/contactMe, it still sends the request to www.localhost:3000.com/api/contact.
A quick way to get it is using window.location.hostname.
Another way is just putting a / in the beginning of the URL you're putting in your POST request axios.post('/api/contact', ...) and it should send it directly to ${baseURL}/api/contact from any page

Related

405 HTTP error after being redirected from payment gateway

we are using Vercel for making development fast .
in our react app , after payment page when payment redirect to our given url it gives 405 http error, how can we handle this?
I finally found the problem , it is coming from PayTabs's side
followings are the logic they are handling wrong:
when nothing is received from callback url , they should not redirect us with given redirect url
when we are giving an invalid callback url it make a GET request to given redirect url
when we are giving an valid callback url which returns 200 to them it make a POST request to given redirect url which is not supported by browser.
This error happens when your page does not use next js serverside rendering. I had same issue but solved it by converting the page from a static page to a server rendered page using getServerSideProps

Can a POST request be redirected as another GET request

I am working on a react application, where there is a need to send the object parameters inside a body because of confidentiality. So I am making a POST request from the react app client-side to the backend server like this
axios
.post('htps://java.backend.xyz/path1', {
data: password,
})
.catch(function (error) {
handle(error);
});
After making this POST request there is a preflight request with "method = OPTIONS" and "URL= 'htps://java.backend.xyz/path1'"...to which java-backend-server responds with status_code=200.
After the above preflight request, java-backend-server addresses the POST request and instead of sending a response the java-backend-server respond with a GET request (i.e redirect) as for example:
https://express-app.xyz/path2?query_para1=abc&query_param2=123, requestMethod=GET
And in response to the above GET request, the express app responds with status_code=200
But immediately after this GET request, there is a preflight request with request Method=OPTIONS and having the same URL as above i.e
https://express-app.xyz/path2?query_para1=abc&query_param2=123, requestMethod=OPTIONS
and for this above OPTIONS request express server responds with a status_code=204 which means that the client doesn't need to navigate away from its current page...this is something prohibiting my app to make a final redirect i.e after the backend server responds with a GET request, my react app is not able to make a redirect even search engine does not update the redirect URL which is
https://express-app.xyz/path2?query_para1=abc&query_param2=123
So, here Is this even possible? I am assuming that the preflight request after the GET request prohibits the client side to be able to make a final redirect. Can someone please help me with this scenario
I am not sure if I understand your problem correctly but what you can do is send a post response which will which will indicate client to redirect to specific location.
This can be achieved by sending response with status code 302 and location in header (location:redirect_url)
For more info :- https://en.m.wikipedia.org/wiki/HTTP_302

How to create a 302 GET request with postman?

In postman I want to create a GET request that returns a 302 status code (along with a Location response header). I have been trying to replicate the original request from the browser inspector, but I always get a 200 response (and no Location response header).
How can I get the desired response with the Location response header?
Please try to turn off automatical redirects (File->Settings: General Tab):
What is probably happening is that Postman receives a 302 status code, but is configured to redirect in this case, so it automatically redirects after which Postman receives a 200 status code, which is what you end up seeing.
Apparently turning off "automatically follow redirects" should offer you a solution.
https://learning.getpostman.com/docs/postman/launching_postman/settings/
View postman request when redirects

Method Not Allowed Error after redirecting in AngularJS

So what is going on is I have integrated the PayU payment gateway in my angular app. It has a success and failure url to which it gets redirected to according to the payment response. Now those urls are client's url where the client receives the response from PayU after payment success/failure. It is sent as a POST with few query parameters that are to be parsed.
Now the problem is that since the request is a POST request on a localhost url(with the same port on which I am already running the app), the console says that 'Method is not Allowed'.
The success url is http://localhost:8005/#!/payment/success
My app is running on http://localhost:8005 (which is the same).
Now I tried to define the url in app.js so as to receive the response as follows -
.state('successScreen',{
url:'/payment/success/',
templateUrl:'partials/successScreen.html',
controller:'paySCtrl'
});
but it doesn't work.
when I am redirected to the url(http://localhost:8005/#!/payment/success) after payment, I am getting that 'Method Not Allowed' error.
The same url is working with GET request though but it cannot be a GET request as it is a response from third party so cannot change it from POST to GET.
So can anyone please help me with how can I overcome this thing or a work around maybe?

CakePHP: post data disappears after redirecting to login page

When I test submitting my form (by the post method) with a logged in user, it sends data correctly, but when I am not logged in, it redirects to the login page.
But this if statement in beforeRender() of app_controller.php returns false:
if ($this->RequestHandler->isPost())
In fact, $this->data is empty. Where is the problem?
Yes, indeed. POST data cannot be retained through a redirect. The HTTP protocol simply doesn't allow for it* and CakePHP doesn't do anything to work around this limitation. The browser sends a POST request to the server, the server responds with a 302 Found redirect with a Location header, the browser issues a GET request to the given Location. The browser does not send the POST data again.
See Stack Overflow question Post data again after authorization for a manual workaround.
* HTTP allows it using a 307 Temporary Redirect, but no browser seems to implement this correctly.

Resources