VK авторизация функция window.open и window.opener

245
09 декабря 2017, 09:01

Доброго времени суток. Написал авторизацию на стороне сервера (php), без использования JS библиотек предлагаемых в API. При нажатии на кнопку "войти через VK", я открываю минивкадку с помощью window.open

Вопрос, как получить ответ об успешной авторизации, чтобы обновить контент через аякс и закрыть окно? Закрыть то понятно window.close, но когда именно это сделать, вот в чем вопрос. Я порылся и нашел функцию window.opener (она вроде-как отправляет ответ из мини окна на основное, если я правильно понял), но о ней мало инфы и как с ней работать мне не донца понятно. Может кто-то имеет опыт с самописной авторизацией через соц сети на JS?

Спасибо.

Answer 1

Выполнил поставленную задачу так, универсальный скрипт, кому-то пригодится:

P.S. Весь процесс авторизации проходит на стороне сервера, в любом случае, прошел авторизацию пользователь или нет - возвращается window.close();, который закрывает окошко с авторизацией в соц.сети. Если пользователь прошел успешно авторизацию, то в дополнение к возвращаемой window.close(); мы еще создаем сессию.

//Авторизация через соц. сеть, вспомогательная функция
function soc_auth(url) {
    var popup = function(options) {
        var
            screenX = typeof window.screenX != 'undefined' ? window.screenX : window.screenLeft,
            screenY = typeof window.screenY != 'undefined' ? window.screenY : window.screenTop,
            outerWidth = typeof window.outerWidth != 'undefined' ? window.outerWidth : document.body.clientWidth,
            outerHeight = typeof window.outerHeight != 'undefined' ? window.outerHeight : (document.body.clientHeight - 22),
            width = options.width,
            height = options.height,
            left = parseInt(screenX + ((outerWidth - width) / 2), 10),
            top = parseInt(screenY + ((outerHeight - height) / 2.5), 10),
            features = (
                'width=' + width +
                ',height=' + height +
                ',left=' + left +
                ',top=' + top
            );
        this.active = window.open(options.url, 'soc_openapi', features);
    };
    var p = new popup( {
        width: 620,
        height: 470,
        url: url
    });
    //Проверяем, закрыта или нет минивкладка, с авторизацией в соц.сети
    var popupCheck = function() {
        try {
            //Если закрыта, то выполняем аякс и смотрим, создалась ли сессия на стороне сервера.
            if (p.active.closed) {
                //Смотрим, существует ли сессия
                $.ajax({
                    type: "POST",
                    url: "../login/soc/",
                    success: function(data) {
                        //Вызываем коллбек логина
                        if(data == "loginTrue") {
                            user_auth_call();
                            $.magnificPopup.close({
                                items: {
                                    src: '#login-form'
                                }
                            });
                            call_func();
                        } else {
                            alert("Вы не авторизованы в соц. сети!");
                        }
                    },
                    error: function(xhr, str){
                        alert("Возникла ошибка: " + xhr.responseCode);
                    }
                })
                return true;
            }
        } catch(e) {
            return true;
        }
        setTimeout(popupCheck, 100);
    };
    setTimeout(popupCheck, 1000);
}
READ ALSO
Выбрать атрибут для парсинга

Выбрать атрибут для парсинга

ЗдравствуйтеИспользую Simple HTML DOM Parser

211
Безопасный update базы через ajax

Безопасный update базы через ajax

Вношу изменения в базе через ajax(post method) на php файлНа данный момент как я понимаю каждый может прислать post запрос на мой php файл и изменить значение...

220
Сохранение промежуточных результатов

Сохранение промежуточных результатов

Я пытаюсь заюзать GridViewДанные подтягиваю для каждого столбца отдельно лямбдой

203
Laravel доступ к файлам

Laravel доступ к файлам

Что сделано:

205