CoCart with Woocommerce

I know this maybe isn't related but I will try to ask anyway. I'm using this boilerplate for a customer and it works very well. But the customer wanted a simple cart with checkout so I installed woocommerce and used CoCart Plugin for getting API and it works well that to. But here is the issue...

When adding something to cart and then my friend adds something to his cart, I get his cart. I see in Cocart plugin that it creates a cookie named cocart_cart_key which works also, I can see in the database that it creates unique cookie for each user but somehow my friends cart adds the value to my cart with same products.

I'm using Vuex with getters and so on, just like your theme. And it looks like this.

import api from "../../api"; import from "lodash"; import * as types from "../mutation-types"; import { isNumber } from "util"; // initial state const state = { all: [], loaded: false, productitems: null }; // getters const getters = { allProductItems: state => state.all, allProductItemsLoaded: state => state.loaded, productitems: state => id => { let field = typeof id === "number" ? "id" : "slug"; let productitems = state.all.filter(productitems => productitems[field] === id); return !.isNull(.first(productitems)) ? .first(productitems) : false; }, someProductItems: state => { return state.all; } }; // actions const actions = { getCartItems({ commit }) { api.getCartItems(productitems => { commit(types.STORE_FETCHED_PRODUCTITEMS, { productitems }); commit(types.PRODUCTITEMS_LOADED, true); commit(types.INCREMENT_LOADING_PROGRESS); }); } }; // mutations const mutations = { [types.STORE_FETCHED_PRODUCTITEMS](state, { productitems }) { state.all = productitems; }, [types.PRODUCTITEMS_LOADED](state, val) { state.loaded = val; } }; export default { state, getters, actions, mutations };

And for adding products to the cart based on his Plugin this is the code:

axios.post('/wp-json/cocart/v1/add-item', { headers: { 'Access-Control-Allow-Methods': 'POST', 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept, Authorization' }, withCredentials: true, cart_item_data: { car: this.chosencar, model: this.chosenmodel, year: this.chosenyear, motor: this.chosenmotor }, product_id: item.id, quantity: 1 }) .then(response => { console.log(response); console.log('added'); this .$store .dispatch("getCartItems"); }) .catch(e => { console.log(e); });

And this is the function for getting the cart:

getCartItems(cb) { axios .get("/wp-json/vacart/v1/saved/", {withCredentials: true}) .then(response => { cb(response.data); }) .catch(e => { cb(e); }); },

Which in the PHP getting the cookie.

I have tried to fix this for weeks now and can't seem to figure it out. It works well when not using Vue js as theme. Anyone having an idea?

Is it not saving cookies in Vuex? Not storing sessions?

I managed to get it work with custom localstorage but I need to use the plugin if the checkout in woocommerce needs to work.

EvanAgee / vuejs-wordpress-theme-starter

CoCart with Woocommerce #73