Как добавить метод POST в Angular SSR — Server?

Я пытаюсь сделать несколько попыток с новым "@angular/ssr": "^18.0.4", я хочу создать собственную логику входа на стороне сервера, а затем опубликовать в ней данные из Angular.

Я добавил использование маршрутизации аутентификации следующим образом в server.ts:

  // Parse JSON bodies
  server.use(express.json());

  // Use auth routes
  server.use('/api', authRoutes);
  
  // Serve static files from /browser
  server.get('**', express.static(browserDistFolder, {
    maxAge: '1y',
    index: 'index.html',
  }));

  // All regular routes use the Angular engine
  server.get('**', (req, res, next) => {
    const { protocol, originalUrl, baseUrl, headers } = req;

    commonEngine
      .render({
        bootstrap,
        documentFilePath: indexHtml,
        url: `${protocol}://${headers.host}${originalUrl}`,
        publicPath: browserDistFolder,
        providers: [
          { provide: APP_BASE_HREF, useValue: baseUrl }
        ],
      })
      .then((html) => res.send(html))
      .catch((err) => next(err));
  });

  return server;
}

auth.routes выглядит так:

import { Router } from 'express';
import { login } from './auth.controller';

const router = Router();

router.post('/login', login);

export default router;

Затем я пытаюсь вызвать API в Angular следующим образом:

  async loginWithCredential(credential: Credential): Promise<void> {
    try {
      const session: Session = await fetch('/api/login', {
        method: 'POST',
        body: JSON.stringify(credential)
      }).then(res => res.json());

      if (session) {
        this.redirectToUrl(session);
        return;
      }

      throw new Error("User not found!");
    } catch (error: any) {
      throw new Error(error.message);
    }
  }

Но похоже, что Angualr все еще пытается управлять маршрутизацией /api/ самостоятельно, вместо того, чтобы управлять ею через Express, поскольку я получаю эту ошибку:

ОШИБКА RuntimeError: NG04002: невозможно сопоставить ни один маршрут. URL-сегмент: 'API/логин' в Recouncer.noMatchError (e:/GitHub/GAB-Auth/node_modules/@angular/router/fesm2022/router.mjs:3774:12) при оценке (e:/GitHub/GAB-Auth/node_modules/@angular/router/fesm2022/router.mjs:3813:20) при оценке (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/operators/catchError.js:10:39) в OperationSubscriber.OperatorSubscriber._error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/operators/OperatorSubscriber.js:23:21) в OperationSubscriber.error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/Subscriber.js:40:18) в OperationSubscriber._error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/Subscriber.js:64:30) в OperationSubscriber.error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/Subscriber.js:40:18) в OperationSubscriber._error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/Subscriber.js:64:30) в OperationSubscriber.error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/Subscriber.js:40:18) в OperationSubscriber._error (e:/GitHub/GAB-Auth/node_modules/rxjs/dist/esm/internal/Subscriber.js:64:30) {код: 4002} 11:23:11 [vite] Ошибка предварительного преобразования: не удалось загрузить URL /api/polyfills.js (разрешенный идентификатор: /api/polyfills.js). Имеет ли файл существовать? 11:23:11 [vite] Ошибка предварительного преобразования: не удалось загрузить URL-адрес. /api/main.js (разрешенный идентификатор: /api/main.js). Файл существует?

Только что увидел, что о такой проблеме еще сообщалось на GitHub: github.com/angular/angular-cli/issues/26323

NiceToMytyuk 20.06.2024 11:51
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
1
1
95
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Как упоминалось в этой проблеме на GitHub, использование ng serve игнорирует server.ts, поэтому для запуска SSR мне нужно было запустить эти команды в двух отдельных терминалах:

npm run watch

и

npm run serve:ssr:projectName

Другие вопросы по теме

Развертывание хостинга приложений Firebase завершается неудачей для веб-приложения Angular 18 с сообщением «Невозможно определить приложение для развертывания»
Токен внедрения DOCUMENT для угловой службы SSR вызывает ошибку NotYetImplemented
Angular 17. Требуется ли отписка для подписки на valueChanges FormControl?
Angular: атрибут cdk-virtual-scroll-viewport-scrollWindow не работает в angular ssr (универсальный), выдает ошибку: документ не определен
Как получить параметры запроса с помощью angular 17 ssr на стороне сервера?
Возникает ошибка при импорте модуля браузера, который уже импортирован вместо commonModule, анимацияBrower также показывает ошибку при открытии раскрывающегося списка p
Ошибки компиляции Typescript при сборке Angular с помощью SSR + pnpm + saveSymlinks
Невозможно выполнить функции на стороне клиента Angular 17 с помощью ssr
Angular SSR жалуется на модули, не относящиеся к ESM, в моем коде Express API
Angular 17: страница входа мигает при каждом обновлении страницы/перенаправлении на другую страницу при включенном SSR