• Как работает роутинг в связке angular2 + express?

    zo0m
    @zo0m
    full stack developer
    предположим приложение у нас состоит из back и front папочек, которые компилятся в /dist/*

    let root = process.cwd();
            let nodeModules = '/node_modules/';
            let clientFiles = '/dist/front';
    
            application.use(express.static(path.join(_root , nodeModules)));
            // настраиваем express, указывая ссылку на папку с билдом фронтенда вот так
            application.use(express.static(path.join(_root , clientFiles)));
            // теперь экспресс будет знать где искать статику, т.е. наш front + node_modules папку
    
            // конфигурим API роутер, 
            router = express.Router();
            router
              .route('/todos')
              .get(TodoController.getAll)
              .post(TodoController.createTodo);
    
            // прячем все вызовы к api в отдельную ветку
            application.use('/api', router);
            // API ошибки будем обрабатывать своим JSON ответом
            application.use('/api', function (error: any, req: express.Request, res: express.Response, next: express.NextFunction){
                    res.status(statusCode).json({error});
            }); 
    
            application.all('*', (req: any, res: any) => {  // все остальное отправляем в dist/front/index.html/angularRoute
                res.status(200).sendFile(path.join(root, clientFiles, '/index.html'));
            });


    Прикол в том что ваше api не знает ваших front-овых роутов.
    Поэтому когда в express попадает роут: '/users/1' и он его не находит, он отправляет его в index.html => index.html/users/1 , теперь ангуляр смотрит есть ли у него такой роут, и если нет, то тогда рисует страницу с ошибкой.
    Однако api это чисто back-ендовские роуты, соответственно для этой ветки, мы эррор хендлер повесили.
    Ответ написан
    Комментировать
  • Как работает роутинг в связке angular2 + express?

    maxfarseer
    @maxfarseer
    https://maxpfrontend.ru, обучаю реакту и компании
    А как вы вообще планируете использовать express ? MEAN стэк подразумевает, что ваш бэкэнд - это только REST API, если не ошибаюсь. Следовательно - у вас все запросы на youhost.com/api/, например, идут в express и там он разруливает роуты, а все остальные запросы идут в клиентское приложение и там разруливает ангуляр.
    Ответ написан
    Комментировать