Пост-сообщение об аутентификации Instagram oAuth только с мобильными браузерами

1

У меня есть приложение Ionic 2 ("native"), которое также работает в браузере как для мобильных устройств, так и для настольных браузеров. Это приложение обеспечивает аутентификацию через Instagram, Google, Facebook и Twitter. На стороне API это обрабатывается hapi.js и плагином bell.

Теперь я занимаюсь проблемой аутентификации на Instagram, когда делаю это в мобильном браузере.

Когда это приложение работает в браузере вместо того, чтобы полагаться на предоставленные Ionic механизмы auth, мы реализуем резервные копии "браузера", чтобы сделать это.

У нас не было серьезных проблем с какой-либо из реализаций, кроме Instagram, которая ранее работала нормально.

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

На стороне приложения обработка этого переключателя табуляции и поведения связи выглядит примерно так:

private requestToken(tokenEndpoint, resolve, reject) {
    let messageReceived = false;
    let win = window.open(this.globals.BASE_URL + tokenEndpoint,
        '_blank', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=500, height=300');

    // Await auth message
    window.onmessage = (e) => {
        let credentials;
        messageReceived = true;

        try {
            credentials = JSON.parse(e.data);
        }
        catch (error) {
            credentials = e.data;
        }

        return credentials ? resolve(credentials) : reject();
    };

    let interval = window.setInterval(() => {
        try {
            // win is already null after closing first tab
            if (win == null || win.closed) {
                window.clearInterval(interval);

                if (!messageReceived) {
                    reject();
                }
            }
        }
        catch (e) { }
    }, 1000);
}

Мой API вернет необходимые данные в интерфейс:

<script>window.opener.postMessage('{0}', '*');window.close();</script>

где {0} - мои обязательные данные.

Для любой другой социальной сети это откроет новую вкладку с адресом about:blank и затем изменится на правильный url для ввода имени пользователя/пароля. Когда это будет сделано, сервер отбросит этот маленький скрипт, и телефон закрывает вкладку, передавая данные обратно в приложение. Он работает безупречно.

ОДНАКО,

Для Instagram поведение отличается. Откроется новая вкладка, она немедленно закроется, и появится новая, где я верну свои данные. Проблема в том, что к моменту, когда сервер вернется со сценарием, window.opener равно null, и ссылка на исходную страницу потеряна, что мешает мне вернуть данные auth.

Как я могу это преодолеть? Как заставить исходную вкладку не закрываться, а вести себя как другие и просто перейти на страницу входа в IG? Отправляет ли IG ответ 301 или 302? Если да, то я до сих пор не смог его поймать.

  • 0
    Привет, ты решил это? отмеченный ответ не работает для меня: \.
Теги:
authentication
oauth-2.0
instagram-api

1 ответ

0
Лучший ответ

Для тех, кто оказался здесь, решения заключались в том, чтобы использовать window.parent.parent.postMessage() а не полагаться на window.opener.postMessage()

Ещё вопросы

Сообщество Overcoder
Наверх
Меню