JavaScript - межсайтовый скриптинг - в доступе отказано

Question

У меня есть веб-приложение, для которого я пытаюсь использовать функцию OAuth в Twitter. Это приложение имеет ссылку, которая запрашивает у пользователя учетные данные Twitter. Когда пользователь нажимает эту ссылку, новое окно открывается через JavaScript. Это окно служит диалогом. Это достигается примерно так:

MainPage:

<div id="promptDiv"><a href="#" onclick="launchDialog('twitter/prompt.aspx');">Provide Credentials</a></div>

...

function launchDialog(url) {
  var specs = "location=0,menubar=0,status=0,titlebar=0,toolbar=0";
  var dialogWindow = window.open(url, "dialog", specs, true);
}

Когда пользователь нажимает на ссылку, он перенаправляется на сайт Twitter со страницы prompt.aspx. На сайте Twitter пользователь может ввести свои учетные данные в Twitter. Когда они предоставят свои учетные данные, они будут перенаправлены обратно на мой сайт. Это достигается с помощью URL обратного вызова, который может быть установлен для приложений на сайте Twitter.

Когда происходит обратный вызов, пользователь перенаправляется на «/twitter/confirm.aspx» на моем сайте в диалоговом окне. Когда это происходит, я хочу обновить содержимое «promptDiv», чтобы сказать «Вы успешно соединились с Twitter», чтобы заменить ссылку и закрыть диалоговое окно. Это служит для уведомления пользователя об успешном завершении этого шага. Я могу успешно закрыть диалоговое окно. Однако, когда я пытаюсь обновить HTML DOM, я получаю сообщение об ошибке «Ошибка: в доступе отказано в доступе к свойству Window.document». При попытке обновить HTML DOM я попытался использовать следующий скрипт в "/twitter/confirm.aspx":

// Error is thrown on the first line.
var confirmDiv = window.opener.document.getElementById("confirmDiv");
if (confirmDiv != null)
{
  // Update the contents
}                
window.close();

Затем я просто попытался прочитать HTML-код, чтобы посмотреть, смогу ли я вообще получить доступ к DOM с помощью следующего скрипта:

alert(window.opener.document.body.innerHTML);

Когда я пытался это сделать, я все еще получал ошибку «Отказано в доступе». Я знаю, что это как-то связано с межсайтовым скриптингом. Однако я не знаю, как решить это. Как мне решить эту проблему? Я неправильно структурирую свое приложение? Как обновить HTML DOM после того, как пользователь был перенаправлен обратно на мой сайт?

Спасибо за помощь!

Answer 1

Когда всплывающее окно открывает страницу авторизации в Твиттере, вы теряете свою первоначальную возможность общаться с winodw, потому что изменился домен документа и был сброшен window.opener.

Чтобы обойти это для очереди SiteFen NetFlix, я использовал таймер и опросил всплывающее окно на предмет изменения его местоположения (к которому вы можете продолжить доступ). Если он перешел на страницу ошибки или страницу успеха, я знал об этом и мог закрыть всплывающее окно (у вас есть контроль над окном, но не DOM) и изменить содержимое главной страницы, чтобы отразить статус авторизации.

Мы также проверили закрытие окна - в случае, если пользователь не авторизует и не закрывает всплывающее окно.

Мы не могли использовать обратный вызов, потому что это было сделано в Adobe AIR, и не было никакого сервера для «обратного вызова», что создавало дополнительное препятствие.