#vue.js #nuxt.js
#vue.js #nuxt.js
Вопрос:
Я пытаюсь вернуть данные в формате JSON с сервера express для маршрута. Данные возвращаются нормально, но когда я открываю страницу NUXT в браузере, вместо HTML страницы выводятся данные JSON.
Обратите внимание, что экспресс-маршрут совпадает с маршрутом страницы. Я знаю, что маршруты конфликтуют друг с другом. Нужно ли мне иметь сервер и интерфейс на разных портах? Что-то не так, что я здесь делаю?
Спасибо
Комментарии:
1. при использовании express в качестве api лучше использовать префикс для ваших маршрутов api.
Ответ №1:
Чтобы избежать подобных конфликтов, вам следует использовать префикс like /api/
или /api/v1/
что-то в этом роде
В nuxt.config.js
вам необходимо определить промежуточное программное обеспечение вашего сервера
serverMiddleware: ["~/api/index.js"]
Этот файл является вашим сервером. Внизу вам нужно экспортировать их следующим образом:
module.exports = {
path: "/api",
handler: app
}
Обратите внимание: app
является ли ваше приложение Express, если вы используете express.js.
Это здесь: const app = express();
Если все сработало, ваш корневой каталог вашего API должен быть доступен в host:port/api/
Ответ №2:
вы не можете этого сделать, если маршруты для серверной части и внешнего интерфейса абсолютно одинаковы. это правила маршрута, которые они должны быть уникальными, и это не проблема с бэкендом или интерфейсом, например. у вас могут быть два маршрута с одинаковым URL в express (api), nuxt тоже.
если мы скажем, что приложение, например, является почтовым отделением, маршрут — это путь к домашнему адресу (контроллер или действие), поэтому у нас может быть два пути для получения дома, но его путаница имеет один и тот же путь (URL или маршрут) и разные дома.
простые решения:
- как вы сказали, разделите api и front на разные порты или разные домены или даже установите префикс для ваших экспресс-маршрутов
- в express обрабатывать их все означает возвращать представление или страницу с необходимыми данными вместо данных json