CROSS ERROR

[Naveen-Crowdera]

im using this api on checkout while consuming its giving cross error, how i can handle this
my code : let getIP = await axios.get("https://ipapi.co/json/");
// .then(async (response) => {console.log("RESPONSE==>",response)})
geo_data = getIP
? getIP.data
: JSON.parse(localStorage?.getItem("visitor_data"));

[ipapi-co]

Hi @Naveen-Crowdera Do you mean CORS error ? We support CORS, and you can verify that by running this command (from a terminal)

curl -H "Access-Control-Request-Method: GET" -H "Origin: https://example.com/" --head https://ipapi.co/json/

The output should contain the string "access-control-allow-origin: https://example.com/". Can you please reach out to our support team at https://ipapi.co/contact/ to resolve this if the issue persists.

[raza2022]

Hi @ipapi-co I am facing the same error. @Naveen-Crowdera are you able to resolve it?

[ipapi-co]

@raza2022 Can you please drop us a message at https://ipapi.co/contact/ so that we can help you resolve it quickly.

[Naveen-Crowdera]

avoid using axios with using fetch api issue resolved

[raza2022]

I tried with both but not working it's just a simple create-react-app nothing fancy so if you are able to share your minimal code (whenever available/free) I appreciate it @Naveen-Crowdera
here is my below example I tried both fetch and axios

import React from "react";
import axios from "axios";
import logo from './logo.svg';
import './App.css';

function App() {
  axios.get(`https://ipapi.co/json/`)
      .then(res => {
        const location = res.data;
        console.log(location)
      })
      .catch(error => console.log(error));
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;

[Naveen-Crowdera]

hey check this my code looks like this and its working for me
const response = await fetch("https://ipapi.co/json/");
const getIP = await response.json();
geo_data = getIP
? getIP
: JSON.parse(localStorage?.getItem("visitor_data"));
visitor_data["location"] = geo_data;
visitor_data["ip"] = geo_data.ip;

[ipapi-co]

Can you please share a REPL for your code ?

I tried with both but not working it's just a simple create-react-app nothing fancy so if you are able to share your minimal code (whenever available/free) I appreciate it @Naveen-Crowdera here is my below example I tried both fetch and axios

import React from "react";
import axios from "axios";
import logo from './logo.svg';
import './App.css';

function App() {
  axios.get(`https://ipapi.co/json/`)
      .then(res => {
        const location = res.data;
        console.log(location)
      })
      .catch(error => console.log(error));
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
      </header>
    </div>
  );
}

export default App;