3

this is the main problem:

: decodeURI(`https://disease.sh/v3/covid-19/countries​/${countryCode}`);

in console i get this:

App.js:59 GET https://disease.sh/v3/covid-19/countries%E2%80%8B/AI 404

the url somehow changes only upon doing the fetch(url), the countryCode when i console.log seems fine

there are these random letters %E2%80%8B inside the url that i dont want how do i remove it?

const onCountryChange = async (event) => {
    const countryCode = event.target.value;
    console.log('country info', countryCode) 

    const url = countryCode === 'worldwide' ? "https://disease.sh/v3/covid-19/all" : decodeURI(`https://disease.sh/v3/covid-19/countries​/${countryCode}`);
    
    await fetch(url)
    .then(response => response.json())

    .then(data => {
      setCountry(countryCode);
      setCountryInfo(data);

    })
  };
natisaver
  • 69
  • 1
  • 7

2 Answers2

2

%E2%80%8B is the correct URL encoding for Unicode Character 'ZERO WIDTH SPACE' (U+200B). The code you've shared contains an invisible space right before the slash:

countries​/${countryCode}
        ^^
Álvaro González
  • 142,137
  • 41
  • 261
  • 360
0

You might have to clean the event.target.value before you use it as a parameter in the URL.

If you do a simple regex clean on the input text, it should be solved:

const countryCode = event.target.value.replace(/[^\x00-\x7F]/g, "");

Similar question: Wordpress putting %E2%80%8E at the end of my url, howcome?

Samyok Nepal
  • 535
  • 3
  • 15
  • hi thanks for answering, the countryCode is fine however, the error only appears when on fetch(url) .then(response => response.json()) – natisaver Dec 27 '20 at 13:22