Блог

Кто-нибудь может объяснить мне этот код:

 this.router.navigate(['/login'], { queryParams: { returnUrl: state.url } });
 

Что делает этот код. Что такое returnUrl ? Я искал документы Angular, но не смог найти больше об этом, где это рассказано.

Редактирование добавлено после получения такой большой помощи и основано на моем понимании :: returnUrl — это определенный программистом запрос, который returnUrl используется для того, чтобы пользователь переходил к URL, к которому он пытался получить доступ после входа в систему. Например, сначала пользователь может пытаться перейти к панели мониторинга, но ему это не будет разрешено, поскольку он защищен от авторизации. но при входе в систему параметры запроса returnUrl используются, чтобы помочь пользователю вернуться к панели мониторинга.

returnUrl не задокументировано в документации Angular, поскольку оно определено как queryParam . Это может быть просто все, что вы там передаете.

Затем он будет частью URL-адреса, например:

 foo://example.com:8042/over/there?returnUrl=login
_/   ______________/_________/ _____________/ 
 |           |            |            |
scheme    authority      path        query
 

В вашем случае: он будет использоваться в качестве ссылки, куда направлять пользователя, когда человек (не) может войти в систему. state.url скорее всего, это строка, и queryParams они обрабатываются как строки, поэтому добавление returnUrl=true приведет к stringified true: 'true' .

Другой пример:

 // Navigate to /results?page=1
this.router.navigate(['/results'], { queryParams: { page: 1 } });
 

Здесь будут показаны только результаты первой страницы. Смотрите Документацию Angular о параметрах запроса внутри UrlCreationOptions.

Скорее всего, компоненту, который загружается /login после успешного входа в систему, может потребоваться перенаправить пользователя на URL, указанный в returnUrl .

A redirectUrl обычно используется на экранах входа в систему в качестве маршрута перенаправления после успешного входа в систему.

Итак, рассмотрим это:

В вашем приложении много разных экранов, которые загружаются в результате навигации по множеству разных маршрутов. Некоторые из этих маршрутов могут быть защищены, и пользователю может потребоваться войти в систему, прежде чем он сможет получить доступ к этим маршрутам.

Таким образом, некоторая логика (обычно в Route Guard) может проверять, вошел ли пользователь в систему или нет, при попытке перейти к этим маршрутам. И когда пользователь не вошел в систему, они могут перенаправить пользователя на /login маршрут, который загружает LoginComponent . На этом этапе вам может потребоваться знать маршрут, по которому пользователь пытался перейти. И вы можете LoginComponent сообщить об этом, передав его как queryParam .