这是一个创建于 732 天前的主题，其中的信息可能已经有所发展或是发生改变。
iframe 标签的 src,那个 url 链接的请求需要 token 有办法在里面携带 token 吗?
场景：现在有一个客服弹窗，这个弹窗是 iframe 标签根据 src 内嵌的。
问题：我登录了，我点击客服，弹窗出现，但是会报 未登录（因为发送请求并未携带 token ）
想法：既然没有 token ，那我给它加上 token 不就好了吗？
难点：不知道通过什么方法给 iframe 标签的 src 链接，放上一个 token 带过去。。。。 对了，不要参数拼接。。。。。
大佬们，有办法解决吗？
 |
1
lazyfighter 2022-11-14 09:45:03 +08:00
先说明需要怎么携带，cookie 同一个域里面应该能携带呀
|
 |
2
OkabeRintaro OP @lazyfighter 像请求拦截器一样在 headers 里面携带
config.headers["Token"] = localStorage.getItem("token"); config.headers["Accept"] = "*/*"; |
 |
3
lynan 2022-11-14 09:55:18 +08:00
首先要确定一件事：未登录错误是否是 iframe src 的 DOC 请求返回的？
如果是：我不懂，留给楼下 如果不是：你应该从 iframe 客服应用如何设置 token 的环节上去解决你的问题 |
 |
4
libook 2022-11-14 09:56:46 +08:00  13
1. 打开 Google ；
2. 搜索关键词“set header for iframe src”； 3. 点击第一条结果“Is it possible to add Request Headers to an iframe src request?”； 4. 滚动到高赞答案，表示使用 JS 带 Header 请求目标地址，然后使用 URL.createObjectURL()生成 ObjectURL 赋给 iframe ； 5. MDN 上搜索 URL.createObjectURL()阅读文档。 |
 |
5
DICK23 2022-11-14 09:57:56 +08:00
通过 postmessage 传递数据?
|
 |
6
NjcyNzMzNDQ3 2022-11-14 10:17:49 +08:00
我猜楼主在本地调试 iframe 跨域了，线上环境没有·未登录·问题。
|
|
7
OkabeRintaro OP @libook 3Q 这就去看
|
|
9
OkabeRintaro OP <template>
<div> <iframe id="iframe" src="" style="width: 500px; height: 500px" /> </div> </template> <script> export default { created() { setTimeout(() => { var iframe = document.querySelector("#iframe"); this.populateIframe(iframe, [["Token", localStorage.getItem("token")]]); }, 0); }, methods: { populateIframe(iframe, headers) { var xhr = new XMLHttpRequest(); xhr.open("GET", "api/home.chat/chat?type=1"); xhr.responseType = "blob"; headers.forEach((header) => { xhr.setRequestHeader(header[0], header[1]); }); xhr.onreadystatechange = () => { if (xhr.readyState === xhr.DONE) { console.log(xhr.response); if (xhr.status === 200) { iframe.src = URL.createObjectURL(xhr.response); } } }; xhr.send(); }, }, }; </script> <style></style> |
|
10
OkabeRintaro OP 现在能成功连接到客服了,但是样式,图片的全部失效了,因为里面用的是相对地址,我也不知道为啥会没有样式,图片,所以决定不采用 heards 携带 token 了,直接 URL 拼接 token 试下
|
Select Language