I am unable to use CoinGecko Library in a VUE application

84 Views Asked by At

I am migrating an old vue2 project to vue3 and now I am changing some backend functions.I am trying to change a function which takes a ticker/crypto and displays its value in USD using coingecko library.

This is what the old function used to do, save the data in a JSON file and retrieve it from there:

  try {
    rawdata = await CoinGeckoClient.coins.fetch('komodo', {}) // KMD, komodo
    data = {}
    data.current_prices = rawdata.data.market_data.current_price
    data.cex_spreads = rawdata.data.tickers
    saveJSON(data, "COINGECKO.KMD.json")
  } catch (error) {
    console.log("HANDLED BETTER")
  }

  try {
    rawdata = await CoinGeckoClient.coins.fetch('verus-coin', {}) // VRSC, verus-coin
    data = {}
    data.current_prices = rawdata.data.market_data.current_price
    data.cex_spreads = rawdata.data.tickers
    saveJSON(data, "COINGECKO.VRSC.json")
  } catch (error) {
    console.log("HANDLED BETTER")
  }


app.options("/getpricecoingecko", cors())
app.get("/getpricecoingecko", cors(), (req, res) => {
  console.info("GET /getpricecoingecko")
  let coin = req.query.coin
  fs.readFile('./COINGECKO.'+ coin + '.json', (err, data) => {
    if (err) {
    console.log("ERROR: Coin gecko price file not available")
        data = '{"error": "not available"}'
    }
    data = JSON.parse(data)
    res.json(
      data
    )
  })
})

Now what I want to do is to put this into the browser interface to fetch prices. remove the saveJSON, this is no longer required because it will remain in browser.

For this I have created a simple function:

export async function getFiatCoinGecko(ticker) {
  try{
    rawdata = await coinGeckoClient.coins.fetch(ticker)
    console.log(rawdata) // KMD, komodo
    data = {}
    data.current_prices = rawdata.data.market_data.current_price
    console.log(data)
    return data;
  } catch (error) {
    console.error(`Error fetching CoinGecko data for ${ticker}:`, error);
  }
}

This function is being used in my AppTraderView.vue component like the following:

 handleRefreshFiat: function() {
      console.log("AppTraderView.handleRefreshFiat")
      let refreshFiatBase = mm2.getFiatCoinGecko(this.wallets.base.ticker).then( response => {
        this.wallets.base.fiat = response.data.current_prices.usd
      }).catch((reason) => {
        console.log(reason)
      })
      let refreshFiatRel = mm2.getFiatCoinGecko(this.wallets.rel.ticker).then( response => {
        this.wallets.rel.fiat = response.data.current_prices.usd
      }).catch((reason) => {
        console.log("caught: " + reason)
      })
    },

I do get errors like the following:

mm2MiddlewareClient.…?t=1698710050193:77 Error fetching CoinGecko data for KMD: TypeError: process.emitWarning is not a function
    at Object._WARN_ (utilities.js:72:11)
    at Object.price (CoinGecko.js:591:89)
    at Object.getFiatCoinGecko (mm2MiddlewareClient.…1698710050193:74:48)
    at Proxy.handleRefreshFiat (AppTraderView.vue:315:33)
    at callWithErrorHandling (runtime-core.esm-bundler.js:173:22)
    at callWithAsyncErrorHandling (runtime-core.esm-bundler.js:182:21)
    at emit (runtime-core.esm-bundler.js:730:9)
    at Proxy.refresh (FiatPrice.vue:28:12)
    at _createVNode.onClick._cache.<computed>._cache.<computed> (FiatPrice.vue:4:35)
    at runtime-dom.esm-bundler.js:358:60
getFiatCoinGecko    @   mm2MiddlewareClient.…?t=1698710050193:77
handleRefreshFiat   @   AppTraderView.vue:315
refresh @   FiatPrice.vue:28
_createVNode.onClick._cache.<computed>._cache.<computed>    @   FiatPrice.vue:4
Show 8 more frames

and


mm2MiddlewareClient.js?t=1698711565540:74 Module "querystring" has been externalized for browser compatibility. Cannot access "querystring.stringify" in client code. See http://vitejs.dev/guide/troubleshooting.html#module-externalized-for-browser-compatibility for more details.
get @ browser-external:querystring:9
_buildRequestOptions @ CoinGecko.js:811
_request @ CoinGecko.js:838
fetch @ CoinGecko.js:135
getFiatCoinGecko @ mm2MiddlewareClient.js?t=1698711565540:74
handleRefreshFiat @ AppTraderView.vue:315
callWithErrorHandling @ runtime-core.esm-bundler.js:173
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:182
emit @ runtime-core.esm-bundler.js:730
refresh @ FiatPrice.vue:28
_createVNode.onClick._cache.<computed>._cache.<computed> @ FiatPrice.vue:4
(anonymous) @ runtime-dom.esm-bundler.js:358
callWithErrorHandling @ runtime-core.esm-bundler.js:173
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:182
callWithAsyncErrorHandling @ runtime-core.esm-bundler.js:192
invoker @ runtime-dom.esm-bundler.js:345
Show 12 more frames
Show less```
0

There are 0 best solutions below