I am attempting to build a headless woocommerce app. Backend is woocommerce, front end is React.
When I query the woocommerce API from insomnia all the required cookies for basket management are coming back, so I am able to get products, add items to cart and get current cart with ease as the cookies are being set properly.
However, when I use axios to call the API I am not getting any cookies through. This means I cant maintain a basket etc.
I tried manually setting cookies as a test but the browser won't allow it, but to be honest I wouldn't want to do that anyway as I need woocommerce to set the cookies to be dynamic.
When I go to the normal wordpress site the cookies are there.
How can I get the cookies to come through when I call it by axios?
If it works in insomnia then it should also work in axios/React?
Many thanks
Related
I am Practicing on a Project and using Rails as a api backend and React as Front end framework. I have implemented Authentication in React but now how I am got stuck at the question of how to implement authorization.
We know in Rails we use cancancan or other gem for authorization which is session based but I cant use cancancan now because My whole front-end is in rails. Are there any ways of doing this work?
If all the permissions are at the backend part, some of requests must return 401 and your frontend part must respond accordingly (render a popup e.g, show a message).
If you are trying to hide some unavailable parts (menu items, buttons, pages) beforehand, your frontend part must get a list of user roles / permissions from the back beforehand and render page using this infromation. You can provide this along with authentication request or as a separate request.
I, personally, prefer pundit over cancancan
I'm having trouble understanding how session cookies work. I have an Adonisjs Api and a React app.
In my login / Register components, I fetch the data with post request and credentials set to true. Everything work fine and the adonis-session cookie is set in the browser.
But, after that, I want to be redirected to the homepage and fetch users' posts but I get 401 unauthorized response.
Can someone help me understand what I need to do? How can I check if the user is logged in with this adonis-session token? Use the context API?
I'm using Django on my backend and React on my frontend. I want to consume the OpenWeatherMap API. For security reasons, I want to keep my API key on the backend. Currently, I have this working on my Django app. When a POST request is made, the Django view renders the information required from OpenWeatherMap. How can the user type the query in React, send the query to to the backend and get the results on the frontend?
I have a very hacky way of doing this currently:
I POST (using axios) the city that the user enters in React to a REST API that I built in Django.
The backend queries the OpenWeatherMap API with the city that the user enters and POSTs the data that it gets from OpenWeatherMaps back to my API.
After this, the frontend uses a GET request on my API to show the information to the user.
I'm pretty sure this isn't the correct way to do this but I couldn't find any other questions on this, and I'm pretty new to web development.
First two steps are just fine. Instead of step 3. return the response from OpenWeather as a response to POST request from step 1. and resolve it in your React code.
On the second thought and to be fine with REST guidelines:
use GET to call your API with user's provided city name (POST is usually called to create a new resource - it's just a convention)
inside your API call OpenWeatherMap API with the city name
return the result to your React app as a response to GET from point 1.
More on REST API guidelines: https://restfulapi.net/
I'm new to WordPress & Woocommerce and have been trying to get cart content using cocart's for a website running on a different domain to sync the cart between a Woocommerce website and a React Application
I've added some products in the cart from the shop website and calling the "mydomain.com/wp-json/cocart/v1/get-cart" REST API from Postman but getting an empty array in the response.
From their doc, they mentioned a Cart Key and Cookie: wp_cocart_session_, but I'm confused on how to get the Cart Key.
Any kind of help will be highly appreciated.
Thanks in advance
use this plugin
https://wordpress.org/plugins/cart-rest-api-for-woocommerce/
or you can save the product id in sqlite and fetch data from woocommerce rest api to every product in the sqlite database and count the total
I had the same problem. Cookies apparently need to be sent with the request as well as the cart_key.
I solved this by installing the Postman Interceptor browser extension.
In Postman, click "Cookies" and it should ask if you want to setup Interceptor for the domain that you are requesting from. It will install a browser extension and get the cookies and add them to your Postman requests.
Postman provides an assisted step-by-step setup of Interceptor and cookie capture, but to manually access cookie capture settings click the icon in the upper right of Postman that says "Capture requests and cookies with Postman". That's where those setting are.
More about Interceptor here: https://learning.postman.com/docs/sending-requests/capturing-request-data/interceptor/#installing-interceptor
I have a working rails RESTful api-only app.
I use Postman to consume that api. Now, to use the api the user have to login to http://localhost:3002/authenticate first by setting content-type to application-json in Header then Email and Password's value in body. After sending the POST request to the server I get auth-token as a json response. Then after successful login I have to pass that auth-token as a Authorization key in each GET request to get respective data.
Now, I want to build a UI for that back-end api as I learn React js. But till now all tutorials I could find was how to send GET requests without any authorization factor. And they are using axios, redux etc.
Can any-one please guide me on where should I start or how to
approach this problem?
Do I necessarily have to use a third-party library for this purpose?
If so which will be better axios or redux??
Any beginner friendly tutorial link would be of tremendous help
How start
Securing React Redux Apps With JWT Tokens - Rajaraodv explains how you get a jwt token and how to keep it in the front end app. I think this way will fits for you.
Keep the auth-token
Rajaraodv uses localStorage to keep the jwt token, you can use the same or keep directly in redux store, it's your choice, the best manner that fits you.
Ajax call
You can use Axios to make Ajax calls, or use fetchApi from the browser as Rajaraodv did, it's up to you.
Explains
"If so which will be better axios or redux??" these two libraries are totally different, each with it's own purpose.