Sending data from frontend to backend in shopify

zahraazeem98
Tourist
9 1 0

Hi! I'm developing an app with node and react. In this app, I have created a scriptTag using the fetch function to get customer id and product id whenever a specific button is pressed. Now when I have fetched that data, I want to store it in my firebase database, which I cannot import in my script tag file because it's on the front end. Therefore, I need to send the data from my frontend to the backend of the app but I'm confused that if I use the fetch function to make POST and GET requests, what URL should I use? Moreover, can the fetch function even post the variable values or not?

 

const header = $('header.site-header').parent();

header.prepend('<div>Hello this is coming from the public folder </div>').css({'background-color':'orange', 'text-align': 'center'})

function addWishList(customer, productid){
/*
  fetch(`url`, {
    method: 'POST',
    headers: {
      'Content-Type': ,
      "X-Shopify-Access-Token": ,
    },
    body: 
    }})
  })

*/

    console.log('adding item to the wishlist!!')
}

function removeWishList(){
    console.log('removing item from the wishlist!!')
}
 var wishbtn = document.querySelector('.wishlist-btn')
 wishbtn.addEventListener('click', function(){
     if(this.classList.contains('active')){             //condition to check if the button is already pressed
        removeWishList();
        this.classList.remove('active');
        this.innerHTML = 'Add to wishlist'
     }
     else{
        var customer = wishbtn.dataset.customer;
        if(customer == null || customer == ''){
            console.log('Please log in to add this item to your wishlist')
        }
        else{
            var productid = wishbtn.dataset.product;
            this.classList.add('active');      //when the user presses add to wishlist button, it add active to the button's class
            this.innerHTML = 'Remove from wishlist'
            addWishList(customer, productid);
        }
     }
     
 })

 

0 Likes