Передача аутентификации в другой домен Iframe
У меня есть разные приложения, требующие одинаковой аутентификации, и я пытаюсь передать свою аутентификационную информацию из localStorage из одного приложения в другое без двойного входа пользователя в систему. Я пытаюсь использовать следующее руководство, но я не уверен, как действовать дальше:
Это информация, которую я хочу передать в свой Iframe:
token: 1234567890abcdef
user: someUserName
expires: 987654321
Мой компонент выглядит следующим образом:
<template>
<v-container grid-list-md text-xs-center>
<v-content>
<div>
<ToolBar/>
</div>
<vue-friendly-iframe id = "frame" name = "frame" src = "http://localhost:8081"></vue-friendly-iframe>
</v-container>
</template>
<script>
import ToolBar from '@/components/component/ToolBar'
const domains = [
"http://localhost:8080",
"http://localhost:8081"
]
export default {
name: 'Dashboard',
components: {
ToolBar
},
data () {
return {
//
}
},
}
</script>
Не совсем уверен, как действовать здесь
Да. Я никогда не использовал nginx, и я новичок в veu в целом, они оба работают на локальном хосте, на портах 8080 и 8081 соответственно. Как бы я поступил по этому коду?
Ответы 1
TLDR: There is really no perfect solution for this.
Сказав это, есть несколько подходов, которые вы можете предпринять.
Использование обратного прокси
Как предложил @David, используйте обратный прокси-сервер, такой как Nginx или HAPorxy, для обслуживания обоих приложений из одного домена — protocol://host:port. Все три вещи должны быть равными.
Использование файлов cookie вместо LocalStorage
Если вы используете файлы cookie вместо LocalStorage, то порты хоста не участвуют в определении политики сайта. Таким образом, два приложения, работающие на одном хосте, но с другим портом, будут совместно использовать файлы cookie без какой-либо дополнительной работы. Чтобы защитить файл cookie, используйте файл cookie только для HTTP, файл cookie того же сайта.
Использование URL для обмена — только IFrame
Если вы используете iFrame, вы можете использовать URL для обмена токеном. Когда внешнее окно загружает iFrame, отправьте эту информацию с помощью хеша, например http://localhost:8081/somepage#token=1234
Использование хеша позволит странице отправлять данные на внутреннюю страницу без отправки по сети.
Использование window.postMessage — только IFrame
Используя window.postMessage, вы можете просто передать необходимые данные во внутреннее окно/iFrame. Пока вы контролируете обе конечные точки, вы можете легко выполнять междоменную отправку сообщений.
В конце концов, это действительно зависит от ваших требований к безопасности, простоте обслуживания и т. д.
Я использовал последний метод postMessage с фреймами. Я смог войти на другую страницу страницы, передав сообщение аутентификации через почтовое сообщение, однако на самом деле это не сохраняет информацию о моем локальном хранилище, но пока это помогло. спасибо приятель.
Вы контролируете оба приложения? Если это так, проще всего использовать прокси (nginx и т. д.), чтобы дополнительно обслуживать приложение во фрейме через маршрут в основном домене. Я делаю именно это в своем приложении для той же цели, и это делает все намного проще.