Axios получает запрос с URL локального сервера из приложения React

#reactjs #express #url #get #axios

#reactjs #экспресс #url #получить #axios

Вопрос:

У меня есть сервер Typescript Express с маршрутом API, который также обслуживает приложение Typescript React в корне домена. Например.

  • https://myapp.test возвращает веб-приложение React
  • https://myapp.test/api/message возвращает некоторую строку сообщения

Внутри приложения React я использую axios для отправки запроса GET на маршрут API и получения сообщения:

 function App() {
    const [data, setData] = useState("");
    useEffect( () => {
        ( async () => {
            const message = (await axios("http://localhost:8000/api/message")).data as string;
            setData(message);
        })();    
    }, []); 
  return (
      <div>Message is: {data}</div>
  );
}
  

Могу ли я указать URL-адрес запроса как один относительно текущего URL-адреса? Например, что-то вроде "/api/message" . Если нет, то как мне следует настроить React, чтобы он мог надежно знать URL-адрес API, независимо от того, где он развернут (например, Heroku)?

Ответ №1:

           const message = (await 
          axios(window.location.host "/api/message")).data as string;