Vue Axios Get requests - How to secure Apikey and ApiPass

Highlighted
New Member
1 0 0

I've been using Vue in shopify to make Get requests to get products and collections. I just realized after a long time, that i've been exposing my private app Apikey and Apipass making these reqeusts.

 

What is the best way to secure them. Or what should I do now instead? My code looks like this

 
var vm = new Vue({

    el: '#buffet-slider',
    data() {
      return {
        product: [],
      }
    },
    methods: {

    },
    mounted () {
      let config = {
        headers: {
          'X-Shopify-Access-Token': 'X-shopify-access-token',
        }
    }

    let  apikey = 'Apikey';
    let  apipass = 'Apipass';
    let  url = 'ebuffet-dk.myshopify.com';
    let  getrequest = '/admin/api/2020-01/products.json?collection_id=171270766731';
    axios.get('https://'+ apikey + apipass + '@' + url + getrequest, config)
      .then(response => {this.product = response.data.products).catch( error => { console.log(error); });
    },
    delimiters: ['${', '}']
});
 
0 Likes