iframe免密登录cookie
时间: 2023-11-20 12:59:51 浏览: 48
为了实现iframe免密登录,可以将token存储在cookie中,然后在第三方系统中读取该cookie。具体步骤如下:
1. 在当前系统中,将token存储在cookie中。可以使用js-cookie库来实现,代码如下:
```javascript
import Cookies from 'js-cookie'
Cookies.set('token', token)
```
2. 在iframe中打开第三方系统的指定页面,并将当前系统的cookie传递给第三方系统。可以使用以下代码:
```html
<iframe src="https://third-party.com/page" onload="sendCookie()"></iframe>
<script>
function sendCookie() {
const token = Cookies.get('token')
const message = { type: 'set-cookie', cookie: `token=${token}` }
const targetOrigin = 'https://third-party.com'
parent.postMessage(message, targetOrigin)
}
</script>
```
这段代码会在iframe加载完成后自动执行,将当前系统的cookie发送给第三方系统。其中,`parent.postMessage()`方法用于向父窗口发送消息,`targetOrigin`参数指定了消息接收方的域名,只有在该域名下的窗口才能接收到该消息。
3. 在第三方系统中,监听来自iframe的消息,并将cookie存储到头部中。可以使用以下代码:
```javascript
window.addEventListener('message', event => {
if (event.origin !== 'https://current-system.com') return
const message = event.data
if (message.type === 'set-cookie') {
const cookie = message.cookie
document.cookie = cookie
}
})
```
这段代码会在第三方系统加载完成后自动执行,监听来自iframe的消息。当接收到类型为`set-cookie`的消息时,将消息中的cookie存储到头部中。