Магистраль + Марионетка + RequireJS + Сеанс (Аутентификация)

Question

Обновление - 2013-07-31

Итак, быстрое обновление того, что я сделал, чтобы осуществить это. Для эффективной работы потребуется 4 компонента (только Marionette/Backbone, вам все еще понадобится веб-служба, отвечающая на запросы сеансов). Я создал Gists для всех желающих. Не стесняйтесь обновлять списки, и я вытащу код, если в нем нет ошибок.

Я использую jQuery, require.js, текстовый плагин require.js, руль и moment.js. main.js включает в себя все ловушки для использования рулей для загрузки шаблона с диска или из кэша, вместо того, чтобы встраивать их в HTML во время выполнения, и предоставляет помощника для использования моментов в шаблоне. Если у вас есть какие-либо вопросы, не стесняйтесь размещать их.

Гистс: https://gist.github.com/dkleehammer/6126639

Обновить!!

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

Оригинал!!

У меня проблемы с обработкой сеансов на стороне сервера и с опорой + марионетка. У меня есть модель сеанса, на которой я основываю это приложение. Сеанс содержит такие данные, как аутентифицированный флаг, идентификатор сеанса, идентификатор пользователя и т. Д.

Я пытался сделать это многими способами, но я все еще сталкиваюсь с единственной проблемой; проблема с разделением во времени, когда мы ожидаем, что сервер ответит текущим состоянием сеанса, и маршрутизатор пытается решить, нужно ли нам отправлять его на страницу входа или просматривать в определенном регионе. После аутентификации (разумеется, после входа в систему) меня отправляют в хэштег индекса, но если я обновлю страницу, то в течение доли секунды модель возвращается как неопределенная и возвращается в хэштег входа. Это проблема для всего, что использует данные модели сеанса во время рендеринга.

Каков наилучший способ создания серверного сеанса с марионеткой? У кого-нибудь есть хороший пример использования маршрутизации и сеанса на стороне сервера с backbone+marionette?

Answer 1

Для тех, кто заинтересован, я создал рабочий пример серверного сеанса с использованием Backbone Marionette, основанный на моей недавней работе.

Репозиторий с инструкциями для запуска примера: https://github.com/michael-lee/loopback-example-backbone-marionette

В этом примере бэкэнд использует LoopBackJS, который является сервером Node.js. с поддержкой аутентификации, но любой другой бэкэнд, который предоставляет REST API входа в систему и защищает доступ к данным с помощью токена авторизации, будет в порядке. Когда пользователь не вошел в систему или срок действия токена истек, запросы к бэкэнду завершаются с ошибками HTTP 401.

Приложение Marionette сохраняет токен, возвращенный в ответе на вход в систему, и отправляет этот токен во всех последующих запросах. Он сохраняет токен, используя jquery.cookie, и поэтому сохраняется при перезагрузке страницы и перезапуске браузера. Перед запуском приложения оно сначала проверяет, есть ли у него действующий токен. Затем запускается приложение и роутер. Если у него есть действительный токен, он сразу переходит на страницу с проверкой подлинности. После проверки подлинности в любой момент времени, если возникает ошибка 401 (например, истекает сеанс), приложение перехватывает ошибку, используя $.ajaxSetup, и возвращает пользователя обратно на страницу входа.

Answer 2

Я бы решил эту проблему, напечатав данные сеанса (флаг аутентификации, идентификатор сеанса, идентификатор пользователя и т. Д.) На странице вместо выполнения дополнительного запроса AJAX.

window.userdata = {"username": Marcus, "password": 'user_id': 12343} 'и т. д.

И удалите это после того, как вы использовали его в своем скрипте.

Answer 3

Вы можете отправить синхронный запрос на сервер благодаря функции jjery ajax и опции async: false:

$.ajax
  ({
    type: "GET",
    url: "login.php",
    dataType: 'json',
    async: false,
    data: '{"username": "' + username + '", "password" : "' + password + '"}',
    success: function (){
      // go wherever you want...
    },
    error: function(){
      // go to login page
    }
});