Приложение Vite React зависло при попытке получить данные из старого API локального хоста (ERR_CONNECTION_REFUSED) послеJquery

Программирование на jquery
Ответить
Anonymous
 Приложение Vite React зависло при попытке получить данные из старого API локального хоста (ERR_CONNECTION_REFUSED) после

Сообщение Anonymous »

Название

Приложение Vite React зависло при попытке получить данные из старого API локального хоста (ERR_CONNECTION_REFUSED) после миграции на Supabase
Body

Я переношу серверную часть своего проекта React + TypeScript (Vite) с локального сервера (http://localhost:8080) на серверную часть Supabase.

Я полностью заменил axios на клиент @supabase/supabase-js и удалил все ссылки на старый URL-адрес локального хоста в своей кодовой базе. Однако мой браузер все еще пытается отправить запросы GET к старому локальному серверу, что приводит к сбою моего приложения.
Ошибка в консоли:

Консоль постоянно отображает следующие ошибки, и, как ни странно, они указывают на минимизированный файл сборки (index-DiTxxjc7.js), хотя я запускаю сервер разработки:
Plaintext

Не удалось загрузить ресурс: net::ERR_CONNECTION_REFUSED localhost:8080/food:1

GET http://localhost:8080/food net::ERR_CONNECTION_REFUSED index-DiTxxjc7.js:11

Мой текущий код:

Вот как я настраиваю клиент Supabase (src/supabase.ts):
TypeScript

Код: Выделить всё

import { createClient } from '@supabase/supabase-js';

const supabaseUrl = import.meta.env.VITE_SUPABASE_URL;
const supabaseKey = import.meta.env.VITE_SUPABASE_ANON_KEY;

export const supabase = createClient(supabaseUrl, supabaseKey);
А вот специальный перехватчик, использующий @tanstack/react-query, где я делаю запрос (src/hooks/useFoodData.tsx):
Typescript

Код: Выделить всё

import { useQuery } from "@tanstack/react-query";
import { supabase } from "../supabase";
import type { FoodData } from "../interface/FoodData";

const fetchData = async (): Promise => {
const { data, error } = await supabase.from('food').select('*');
if (error) throw new Error(error.message);
return data as FoodData[];
};

export function useFoodData() {
const query = useQuery({
queryFn: fetchData,
queryKey: ['food-data'],
retry: 2
});
return { ...query, data: query.data };
}
Что я уже пробовал (устранение неполадок):

Чтобы убедиться, что это не простая проблема с кэшированием или оставшаяся строка, я сделал следующее:
Глобальный поиск: запустил глобальный поиск в VS Code для 8080 и localhost. Найдено результатов: 0.
Переменные среды: проверены все файлы .env. Старых URL-адресов не осталось.
Жесткое обновление и инкогнито: протестировано в совершенно новом окне инкогнито с использованием жесткого обновления. Ошибка сохраняется.
Удалена папка сборки: вручную удалена папка dist, чтобы убедиться, что она не обслуживает старую производственную сборку.
Очистен кеш Vite: остановлен сервер и запущен npm run dev -- --force, чтобы очистить кеш зависимостей .vite внутри node_modules.
Правильный порт: гарантирован доступ к приложению строго через Vite по умолчанию http://localhost:5173, а не через VS Code Live Server.
Несмотря на все это, приложение по-прежнему действует так, как будто где-то в коде записан axios.get('http://localhost:8080/food'). Почему мини-файл (index-DiTxxjc7.js) все еще выполняет этот старый запрос и как я могу полностью удалить этот призрачный код из своей среды Vite/React?

Подробнее: https://stackoverflow.com/questions/799 ... ction-refu
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Jquery»