Почему Window.Opener Null при открытии всплывающего окна из приложения React (Localhost: 8000) к другому происхождению ( ⇐ Javascript

[Anonymous]

Я пытаюсь внедрить Microsoft SSO Login в фронтаре React (

Код: Выделить всё

"http://localhost:8000"

), открыв всплывающее окно на бэкэнд -сервер (

Код: Выделить всё

"http://localhost:3000"

), который обрабатывает auth redirect.
Вот настройка:

• Frontend (React, используя react-scripts start) работает на "http: // localhost: 8000"
• (node. "http: // localhost: 3000"
• После входа в систему бэкэнд перенаправляется на статический файл microsoft-login-success.html внутри public/

В код React я открываю покровитель PrettyPrint-Override ">

Код: Выделить всё

const popup = window.open(
"http://localhost:3000/microsoft-login-success.html",
"loginPopup",
"width=600,height=600"
);
< /code>
Внутри microsoft-login-success.html, я имею: (на самом деле этот скрипт в файле js, потому что политика браузера) < /p>

window.onload = () => {
alert("Loaded popup");
console.log("window.opener:", window.opener); // This logs "null"
window.opener?.postMessage("ready", "http://localhost:8000");
};

< /code>
Что я пробовал: < /p>

 Использование "*" или полного происхождения в postmessage () - без различия < /li>
 Подтвержденный CORS настроен правильно < /li>
. /> < /ul>
Проблема: < /p>
window.opener

является нулевым во всплывающей странице, поэтому postmessage () обратно на фронт, не работает/
Примечания:
Я подтвердил, что всплывающее окно открывается из window.open () , а не из тега . Это работает нормально, если я открываю window.open () между 2 обычными HTML -страницами. Только при запуске React через React-Scripts start dot window.opener становится нулевым во всплывающем окне. /> Это вызвано сервером Dev-Scripts Dev, перекрестными проблемами или заголовками безопасности?

Код: Выделить всё

app.use((req, res, next) => {
res.setHeader("Cross-Origin-Opener-Policy", "unsafe-none");
res.setHeader("Cross-Origin-Embedder-Policy", "unsafe-none");
next();
});

Я должен разрешить кросс-аоригин на стороне Be, чтобы они могли общаться через Postmessage.
Если вы хотите проверить ваш сайт, разрешен или нет, только F12, затем перейдите на вкладку сети, проверьте заголовок ответа/заголовок запроса

Подробнее здесь: https://stackoverflow.com/questions/797 ... host8000-t