IP Address Tracker with React typescript

Community feedback

• 

  Awais Ahmed•180

  @its-awaisPosted 10 days ago

  look miss, your project is not working because of cross orgin property, you have to define your proxey in your vite file.

  0

  ---

  

  Chyka•90

  @CrownedTechiePosted 10 days ago

  @its-awais Hey there, please I'd like more details on what exactly is not working. Is it breaking? a blank page or something? Because I opened the deployed link and it's working fine on my end. So I'm confused

  0

  

  Awais Ahmed•180

  @its-awaisPosted 10 days ago

  @CrownedTechie look when i want to look at your project you did not use proxy, because of that your frontend want to access your backend then there port is different, so because you are using react,so you need to define proxy in your vite app so that your frontend access you json file where you get your data

  export default defineConfig({

  plugins: [react()],
  server: {
    proxy: {
      "/api": "http://localhost:8000",
    },
  },
  });
  

  and use this

  const response = await axiosInstance.get<TData>(`/api${url}`, {
    params: {
      ...params,
      apiKey: API_KEY, // Optional, if needed
    },
    signal: controller.signal,
  });
  

  look now i see i use /api over there so now its fixed but change it because i never use typescript i use js so,but your website have cors issue

  0

  

  Chyka•90

  @CrownedTechiePosted 9 days ago

  @its-awais Thank you for the suggestion. Just to clarify, my project isn't a full-stack app; I'm simply fetching data from a free external API to show on the frontend, so the proxy setup in Vite isn't needed since there's no local backend server.

  And I’m not actually running into any CORS issues since the data is displaying just fine on the frontend. If there were any issues, the data wouldn’t show up at all. Or are you experiencing otherwise?

  0

  

  Awais Ahmed•180

  @its-awaisPosted 9 days ago

  @CrownedTechie i know your project is not an full stack i already know, because i create these project so i know, oky i just tell you what i seen so you understand what i am saying,

  ross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://geo.ipify.org/api/v2/country,city?apiKey=at_OnpuI5H6sjJjQyTFJafQ0hAown9Wt. (Reason: CORS request did not succeed). Status code: (null)
  

  know you understand what is problem in your code, so what i mean to say that when you get the data from external api, then external api work as backend, and you're creating frontend so there "cors" is that so they can trust each other.

  0

  

  Chyka•90

  @CrownedTechiePosted 9 days ago

  @its-awais Alright, no problem. Thank you for your feedback

  1