I want to use 3rd party function (actually, it is mine, but written in different time and different file), which requests data via fetch function.
In my Vue + Vite application I import that function and call it. However by default in Vite environment I get CORS error (localhost -> fandom.com
connection)
In case of CORS errors Vite suggests to create small proxy via its config file. However this proxy listens only to localhost requests, whilst my “3rd-party function” already calls to specific outbound address, and I cannot change it inside Vue code.
In .vue I have this line:
import fetchWikiData from "@sancho-pansa/parse-wiki-data";
let cardsTable = await fetchWikiData(5); // Calls for data about cards from 5th expansion of the game
That fetchWikiData()
function makes call to https://leagueoflegends.fandom.com/api.php
and by default that site name is immutable from Vue application.
So, my question is: what should I do inside Vite settings or in app in general to overcome this type of CORS error?
I tried to look for solution in Vite config documentation, but it only provides examples for localhost proxy, for example, I make http://localhost/proxy
request and it redirects me to fandom.com/api.php
. However in my case I have complete function, which sends and processes request, so I cannot basically interfere with it and change address in it to some localhost/proxy
.