Возвращенные данные отображаются вместо структуры страницы в Nuxt

#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