ฝัง
- เผยแพร่เมื่อ 26 ก.ค. 2018
- Spring Boot Rest Application: настраиваем Spring Security oAuth2 с авторизацией Google на нашем Vue.js фронтэнде.
В rest приложении недостаточно просто подключить авторизацию и сделать ссылку на страницу авторизации Google, также требуется потратить немного времени на доработку интерфейса: позаботиться о том, чтобы у JavaScript также была информация о том, авторизован ли пользователь, а также всё необходимое для отрисовки информации о пользователе на экране.
Ссылка на код из видео:
github.com/drucoder/sarafan/t...
В качестве ориентира при настройке авторизации мы продолжаем использовать официальный гайд по oAuth2 из блога проекта Spring:
spring.io/guides/tutorials/sp...
Первым шагом мы подключаем к проекту шаблонизатор Thymeleaf и заменяем нашу статичную стартовую страницу на шаблон, способный динамически подхватить информацию об авторизованном пользователе и список существующих сообщений.
Зависимости на необходимые в этом видео модули лежат тут:
gist.github.com/drucoder/06f3...
Далее мы немного дорабатываем наш JavaScript код для отображения приглашения авторизоваться, если пользователь не авторизован и кнопки, предлагающей разавторизоваться для авторизованных пользователей.
Когда авторизация успешно прошла, мы добавляем поддержку Spring Session для хранения сессий активных пользователей в БД. Это позволит избегать повторных запросов авторизации для пользователей после перезагрузки приложения.
Проперти, необходимые для Spring Session:
gist.github.com/drucoder/9f8c...
Видео настройки Spring Session для Sweater Application:
• Spring Boot: reCaptcha...
Использование oAuth2 авторизации вносит свои корректировки и нам необходимо немного изменить структуру таблицы, хранящей сессии пользователей.
Скорректированный скрипт таблиц для Postgres:
gist.github.com/drucoder/a1bd...
Личный кабинет в Google Developer Console, где создаются токены:
console.cloud.google.com/apis...
Ссылка на плейлист Sweater App (Spring MVC):
• Spring Boot: делаем пр...
➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖
➡ Твиттер: / letscodedru
➡ Чат в Discord: / discord
➡ Группа Вконтакте: letscodedru
➡ Канал в Telegram: t.me/letsCode_dru
➡ Чат в Telegram: t.me/joinchat/FeiP9xEhqHajfqh...
➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖
Поддержать проект:
➡ Patreon / letscodedru
➡ Яндекс.Деньги money.yandex.ru/to/4100145167...
➡ PayPal paypal.me/letscodedru
➡ Qiwi qiwi.me/letscode
➡ WebMoney/BitCoin funding.webmoney.ru/d/drucoder
➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖
➡ Ссылка на канал: / @letscodedru
➡ Ссылка на Яндекс.Дзен: zen.yandex.ru/media/id/5ac209... - วิทยาศาสตร์และเทคโนโลยี
было бы интересно и все другие типы авторизации типа jwt openid и остальные. и круто еще круто было увидеть как реализовать свой oauth2 сервак который будет хранить пользователей чтобы стороние приложения авторизовывались через наше. надеюсь запишите такие видосы, очень жду
курс лучше многих платных, спасибо!
Спасибо! Отличный и лаконичный материал!
Спасибо огромное!) Очень полезный урок!))
у вас все сработало в первой части видео?
С этой ошибкой провозился больше 2-х часов th-cam.com/video/B0887PLJuSY/w-d-xo.html, пока просто не забил и не решил досмотреть видео до конца, а потом свериться с исходным кодом автора, а тут 2 минуты видео и разгадка вот она... бывает. Автору однозначно спасибо, уроки очень помогают разбираться со многими незнакомыми вещами, начал смотреть sweeter - полез разбираться с spring и hibernate, столкнулся с REST решил просмотреть уроки по sarafan, пришлось углубиться в vue.js остановился на однофайловых компонентах и webpack - вернулся обратно к sarafan. Короче непознанного очень много, и с каждым видео находишь все новые и новые пробелы в знаниях, которые хочется заполнить.
Спасибо Дрю ♥♥♥
+ Плюсую за продолжение!!!
На следующей неделе уже будет :)
Уроки супер, все по полочкам разложено, просто идеально!
Но что с видео-уроков Sweater, что тут, мучает следующий вопрос:
Как увеличить max_inactive_interval, который по умолчанию создается Spring-ом в 1800с (пол часа всего). То есть если не проявлять никакой активности 30 минут, ты автоматически разлогиневаешься ;((
Еще раз спасибо за уроки!
Спасибо! Очень интересно и полезно. Когда ожидать продолжение?
Сейчас дела разгребаю и начинаю регулярно 2 раза в неделю спамить вам ленту :)
сколько разных интересных плюшек узнаю! =) дорвался до технологий
у вас все сработало в первой части видео?
@@YWNWA-ZXC у меня почему то профаил нулл
Спасибо!
Спасибо!)
Читаю про RabbitMQ
пример его использование - это когда у тебя приложение крутится например на AWS 2 (или больше) EC2 инстанса, спереди у тебя LoadBalancer и надо чтобы сессия между инстансами шарилась быстро, вот у нас RabbitMQ и Redis использовали для этого. А вопросы нагрузки решаются горизонтальным скейлингом апп слоя, что AWS умеет с коробки при если хорошо настроить.
нельзя просто взять и перестать лайкать видео автора... Спасибо большое!
Добрый день, а можете показать пример авторизации через jwt токены в связке с resfresh-токеном ?
Спасибо за наглядность. Вопрос такой, а можно ли к веб-верверу прицепить еще и Андроид? как авторизация с гуглом тогда работать будут?
👍
спс за сессии
не подскажешь как подключить сохранение сессий в reactive-redis для микросервисов на webflux и с oauth2resource авторизацией? Т е чтобы сессия шарилась между микросервисами и хранилась в редисе, а не так чтобы каждый микросервис в памяти хранил свою сессию.
Замечательный курс, премного благодарен! Нашел у себя такой баг: при добавлении строки org.springframework.session:spring-session-jdbc в билд скрипт, включается авторизация через встроенную spring авторизацию. выбрасывает в url /login с полями User & Password. Убрал данный пакет из билда, всё заработало нормально. Может я что-то неправильно понял?
thanks
Спасибо за целый курс, все просмотрел, начал делать проект и задумался расширить функционал добавлением приложения на телефон. и возник вопрос: "а что делать если фронтэнд это приложение для телефона, как там отловить переход на ссылку гугла для аторизации и ее отрисовать правильно ?"
thx
Пасеба
Здорово, но я делал изначально фронт на ангуляре как отдельный проект... У меня нет в ресурсах js файла, т.е. я не могу через шаблонизатор передать frontendData так просто. Кто может подсказать где что подправить чтобы нормально все заработало?
Всем привет! Кто нибудь может мне подсказать почему когда запускаю под java 11 все работает по 8 ошибка -"ERROR 6000 --- [nio-8080-exec-2] s.e.ErrorMvcAutoConfiguration$StaticView : Cannot render error page for request [/] and exception [An error happened during template parsing (template: "class path resource [templates/index.html]")] as the response has already been committed. As a result, the response may have the wrong status code."
А что сейчас лучше, или когда лучше что использовать? Сессионную авторизацию, или вкладывать в каждый запрос токен? С токеном мне кажется интереснее, потому что frontend можно отодрать, он может лежать где угодно. Но хз, как авторизацию делать..=)
"отодрать фронт энд" - звучит-то как! 😂
Вариантов много, но для любого отличного от использования cookie нужно будет писать свой фильтр для Spring security, а мы пока что эту тему не трогаем
Отличный туториал! Очень четко и доступно! Но есть вопрос - как бы обойтись без дополнительных шаблонизаторов? Т.е. ничего не имею против thymeleaf & so on, но основная тема, насколько понимаю, Rest + Vue.js.
Да легко. Шаблонизатор нужен только для того, чтобы в будущем сократить время отображения страницы пользователю. Можно все ресурсы захардкодить и раздавать разные страницы для прода и разработки. Просто надо отключить шаблонизатор в билд скрипте и убрать метод в контроллере, раздающий index
@@letsCodeDru Спасибо за ответ ! Точно, можно ведь через MvcConfig объявлять ресурсы)
@@letsCodeDru а если у меня фронт работает как отдельное приложение и при этом необходимо использовать oauth2? Необходимо делать редирект на бэкенд, при нажатии на ссылку авторизации либо это как-то по другому должно работать?
@@user-gj2tr1nc9v разобрались? а то похожая ситуация
Скажите, пожалуйста, надо ли как-то регистрироваться на Google Developer Console? Или просто заходишь и начинаешь работать?
Заходишь и работаешь
это нормальная практика мешать RESTful и обычные контроллеры? Или чисто в целях обучения?
Обычный контроллер здесь потому, что присутсвует шаблонизатор... "Выхлоп" от РЕСТа - JSON, передающийся в код JS, короче, как-то так
Ваши видео курсы очень понятные. А можно создать новую серию, где будет Webflux Angular 6 + авторизация и любая база данных?
WebFlux точно да, Angular - может быть. Остальное уже есть)
ну если будут, тогда уже и Mongo давайте заюзаем))
Раз principalExtractor сейчас больше не используется, то что использовать вместо него, чтобы так же получать в аннотации @AuthenticationPrincipal нашего юзера? И вообще, я правильно понял, что PrincipalExtractor влияет на того юзера, которого возвращает @AuthenticationPrincipal или это что-то другое?
А то у меня эта аннотация всегда возвращает null при использовании нашего класса User, независимо от того, вошел я или нет.
И как решил проблему?
ты конечно господь бог , можно только попросить , после завершения проекта рассказать как это все работает под капотом
ну зачем такие формулировки? Как это работает "под капотом" я хз, когда начну рассказывать, ибо тут даже просто "по верхам" пробежаться времени не хватает. Моя цель - дать представление о возможностях, показать, что есть в технологиях, с вас - вдумчивое чтение документации и разработка на примере. Зачитывать понятно и интересно документацию я не умею, сорян. Если находишь какую-то тему в спринге, которая не ясна и интересна - пиши (лучше в ВК или телеграм), народ подхватит - сниму видео. Так я выбираю о чём рассказать. Могу углубиться куда-то в одну их серьёзных тем, но не во все сразу, не всемогущ я)
Так что давай конкретно и продуманно.
Классное видео!! Единственное, что я не понял, зачем писать SQL скрипт самому???? Все ведь и без него работает.
Андрей же пояснил на 11:14
github.com/spring-projects/spring-session/blob/master/spring-session-jdbc/src/main/resources/org/springframework/session/jdbc/schema-mysql.sql
Хочется поблагодарить Андрея 👍, и заодно задать вопросик: А как будет выглядеть авторизация и через Oauth2 и Basic (логин, пароль с энкодером, верификация емэйл, вот это все) одновременно. Ведь как минимум ключи будут разных типов (в бэйсике лонг же). Делать отдельные сущности юзеров для каждого типа авторизации? Как тогда им доступ давать к одному и тому же аккаунту?
Да в одну таблицу пихаем, чего уж. А id от oauth ложим в поле с unique констрейнтом.
Делал в свое время приложение с авторизацией через почту и 7 разных социалок. Всё в одной таблице лежало нормально
Ого, отлично, спасибо, так и сделаю. А то чет не гуглилось это у меня никак.
А я хз, почему таких примеров нет. М.б. достану с полки исходники, да замучу видос по авторизации через много социалок.)
@@letsCodeDru ждемс =)
@@TheSaymonFenix Если получилось, то можешь, пожалуйста, скинуть свой исходник?
Просмотре видео, затем прошел обучалку по ссылке об oAuth2 авторизации. Удалось настроить авторизацию через facebook и google, но возник вопрос, как объединить oauth2 авторизацию с простой, как в свитере? чтобы пользователь мог или авторизоваться через сторонние сервисы, или зарегистрироваться на самом приложении. В статье по ссылке используют фильтр для каждого сервера авторизации по адресам "login/google" и "login/facebook" для фейсбука, вопрос как настроить spring security для входа в приложения по логину и паролю по принципу sweeter к по адресу к примеру "login/own" не используя oauth2?
Привет, помоги пожалуйста, сижу ломаю голову как сделать авторизацию одновременно через Google и Facebook. У тебя есть решение?
@@user-ml2et9iw2l Делал по туториалу spring.io/guides/tutorials/spring-boot-oauth2/, если с инглишем более-менее то можно разобраться. Для себя создал репозиторий с кодом, чисто с настройкой авторизации. github.com/Yakhnitsa/spring-tutorial__spring-secutiy-oauth2_advanced/, объяснений там нету, но при желании можно свиснуть для себя необходимые части кода, только в файлах конфигурации application.yml стерты ключи, если смотрел видос знаешь как их добавить через parameters при запуске. Там вся магия в SecurityConfig.java, не уверен что там нужен webjar.js но ничего не переписывал. И что-то мне подсказывает чтобы добавить свою авторизацию (с записанными в БД логинами и паролями) нужно допилить свой oauth2 сервет, тутор видел, но не хватило сил разобраться
@@user-ml2et9iw2l Пересмотрел код, библиотека jquery нужна только для ajax запросов, чтобы не подключать лишнего можно взять уже используемый Vue.resource
@@YuretsUA Спасибо! Да мне вообще для Android приложения надо, поэтому без JS) Я вроде тут немного разобрался и могу получать данные из Autication класса, но появилась проблема в том, что мне помимо google и facebook Надо VK, не пробовал ли ты случайно VK подключить через oAuth2?
@@user-ml2et9iw2l VK не пробовал, но думаю так как oAuth2 авторизация стандартизирована все сведется к простому добавлению настроек в application.properties и добавлением нового фильтра vkFilter и настройкой его конфигурации. С фейсбуком сам разобрался, тем-более vk девелоперская страница на русском.
Добрый день. Начиная с 5 серии никак не могу залогиниться через google. На конец 6 серии получаю 401 ошибку. Может ли проблема быть в прокси? И если да, не подскажите, где можно вписать?
Получилось решить? У меня такая же ошибка появилась.
@@stanislavdimitrenko Аналогичная и у меня ошибка как решили проблему?
@@stanislavdimitrenko Удалось решить проблему. Проблема была в Application.properties а именно в security.oauth2.client.clientSecret=PU7x84LgkniJmZltuLNJxMMh нужно подставлять свой clientSecret который можно взять в настройках oauth2
@@alexeyverishko915 Спасибо, надо будет попробовать. Я уже и забросил это, так как уперся в стену.
У меня получилось решить удалением всех куки и переавторизацией
Добрый день! У меня при попытке авторизоваться выдает ошибку:
There was an unexpected error (type=Internal Server Error, status=500).
Current user principal is not of type [org.apache.catalina.User]: org.springframework.security.oauth2.provider.OAuth2Authentication@3b6cedcf
В чем может быть проблема?
Неправильный импорт класса User
К автору есть просьба, нам для реальной сеточки надо две вещи
1--> WebSocet
2--> RabbitMQ (and ActiveMQ) можно в приципе любой брокер сообщений
Это для обмена сообщениями, и по другому просто ни как, большая нагрузка. Будут ли показаны варианты работы с этими технологиями.
Заранее спасибо.
"вэб сосёт" это пять))) спасибо за мегаопечатку))) будет
А очереди тоже будут, когда пример придумаю.
Но вот про "высокие нагрузки" больше никому не надо говорить без примера - засмеют или завалят на собеседовании. Особенно по поводу кролика. И в целом: очереди не решают проблем при высокой нагрузке, решает грамотная архитектура и методичное выискивание и устранение узких мест. :)
А activemq и подавно не тянет на спасителя при настоящих высоких нагрузках
WebSocket... Ну разумеется все зависит от тех задания если надо много и сразу то Kafka , да RabbitMQ и ActiveMQ ни агонь конечно , но с другой стороны а как часто нам надо держать нагрузку в 5 000 000 сообщений в секунду ??
Речь даже не об этом, дружище. В реальности мало кто может похвастаться настоящими высокими нагрузками. Очереди больше про взаимодействие компонент, про развязывание блоков логических. Это могут использовать и без больших нагрузок, например для распределенных приложений. Я использовал activemq как транспорт между сервером и десктопным приложением без больших нагрузок. В другом проекте нам нужна была система сбора данных с клиентов по всему миру, клиенты кидали раз в месяц небольшие текстовые файлы на ближайший сервер амазона, тот сливал это в единую очередь, которую обрабатывали воркеры в штабе. Тут большая нагрузка только один-два дня в месяц на воркерах была. Когда речь про нагрузки, начинают подбирать специфические бд, протоколы, сервера, системы хранения, дробят приложение. Иногда даже выпиливают очереди, заменяя транспорт на простой tcp, чтобы снизить накладные издержки.
Ты это, не думай, что я тут авторитетами давить пытаюсь, я добрый и не зануда (надеюсь) :)
Приходи общаться в ВК или телегу, нам там хорошие собеседники нужны :)
Почему контроллер не может отобразить index.html страницу?
Тоже самое. Вот текст ошибки There was an unexpected error (type=Internal Server Error, status=500).
Error resolving template [index], template might not exist or might not be accessible by any of the configured Template Resolvers. В чем может быть дело?
Разобрался: путь к файлу index.html должен быть resources/template/index.html. А у меня index.html лежал в resources/static/template
Когда подключаю код 401((((
Error:java: Illegal char at index 80: C:\Users\Evgeniy\Desktop\sarafan-AddOAuth2Client\Could not find com.sun.xml.bind:jaxb-core:jar.
Поднеми версию compile('org.springframework.security.oauth.boot:spring-security-oauth2-autoconfigure:2.1.6.RELEASE') и убери зависимости
compile('com.sun.xml.bind:jaxb-core')
compile('com.sun.xml.bind:jaxb-impl')
Ставь JAXB-core последней версии...
Что за ОС у Вас?
kubuntu 18.04
Так и не понялл причем тут REST
Для mysql
CREATE TABLE SPRING_SESSION (
PRIMARY_ID CHAR(36) NOT NULL,
SESSION_ID CHAR(36) NOT NULL,
CREATION_TIME BIGINT NOT NULL,
LAST_ACCESS_TIME BIGINT NOT NULL,
MAX_INACTIVE_INTERVAL INT NOT NULL,
EXPIRY_TIME BIGINT NOT NULL,
PRINCIPAL_NAME VARCHAR(300),
CONSTRAINT SPRING_SESSION_PK PRIMARY KEY (PRIMARY_ID)
) ENGINE=InnoDB ROW_FORMAT=DYNAMIC;
CREATE UNIQUE INDEX SPRING_SESSION_IX1 ON SPRING_SESSION (SESSION_ID);
CREATE INDEX SPRING_SESSION_IX2 ON SPRING_SESSION (EXPIRY_TIME);
CREATE INDEX SPRING_SESSION_IX3 ON SPRING_SESSION (PRINCIPAL_NAME);
CREATE TABLE SPRING_SESSION_ATTRIBUTES (
SESSION_PRIMARY_ID CHAR(36) NOT NULL,
ATTRIBUTE_NAME VARCHAR(200) NOT NULL,
ATTRIBUTE_BYTES BLOB NOT NULL,
CONSTRAINT SPRING_SESSION_ATTRIBUTES_PK PRIMARY KEY (SESSION_PRIMARY_ID, ATTRIBUTE_NAME),
CONSTRAINT SPRING_SESSION_ATTRIBUTES_FK FOREIGN KEY (SESSION_PRIMARY_ID) REFERENCES SPRING_SESSION(PRIMARY_ID) ON DELETE CASCADE
) ENGINE=InnoDB ROW_FORMAT=DYNAMIC;
@@LubluYoba Спасибо вам огромное
@LubluYoba @The Laszlo
Где можно найти для mysql? не смог перевести
У меня очень забавная ситуация: ОШИБКА: значение не умещается в тип character varying(100); nested exception is org.postgresql.util.PSQLException: ОШИБКА: значение не умещается в тип character varying(100)
Хотя нет ни одного varchar(100). Да, я знаю, где был раньше varchar(100), но ни разу я его 100 не ставил, а ошибка была изначально. compile('org.springframework.session:spring-session-jdbc')
- проблема с сессиями((((. В скриптах конечно же стоит varchar(300), там где комментарий автора о том, что раньше было 100
p.s. попытался сделать вывод, что ошибка о 100 это автоошибка, а надо поставить еще больше, чем 300, но все равно не помогло
Знаю, что пишу поздно, но может у других людей такая же проблема.
Просто удалите таблицы spring_session и spring_session_attributes. Спринг создаст их заново без ошибки (сначала не указали implements Serializable)
"...Я вот видосики пишу, вот такое лето..." - грусть в голосе, аж жалко стало(( //не туда написал... но коммент же не мешает тут ни кому.
why call channel 'lets code" the use some alien languages on tutorials......where do i get the english version
And why not? :)
@@letsCodeDru do you have an English one.....I want this tutorial but I can't understand
@@KayoleKnight oh... my English is not well)) I'm shure, there are many videos in English about Vue + Spring. Isn't it?
Ошибка 404 на моменте 4:43
в консоли браузера: Cross-Origin Read Blocking (CORB) blocked cross-origin response accounts.google.com/o/oauth2/v2/auth?client_id=105144023099-2psh7f9pr3vappvembgu5mk21d71ugme.apps.googleusercontent.com&redirect_uri=localhost:9000/login&response_type=code&scope=openid%20email%20profile&state=TBRHSu with MIME type text/html. See www.chromestatus.com/feature/5629709824032768 for more details
Спасибо! Отличный и лаконичный материал!
Спасибо! Отличный и лаконичный материал!
Спасибо! Отличный и лаконичный материал!