上述的问题原因是我从网上找到的写的比较详细一些的，原文连接是：chrome浏览器iframe嵌套页面跨域无法获取cookie问题 简单来说就是因为谷歌的最新版本导致的该问题，在使用不同ip端口页面访问的时候，无法设置和获取到cookie 
因为在嵌套的页面对应的系统中，需要用到cookie去获取token用于接口查询等操作时的请求头中的参数项，所以如果获取不到的时候，就会出现异常，导致无法正常登录、接口无法正常查询 
上图是正常请求的情况，能够正常的响应数据，下图是异常的情况，没有传Authorization、Cookie等重要的信息： 
3. 解决方案 3.1. 因为无法获取到cookie，那么当将cookie中保存的一些信息都保存到sessionStorage或localstorage中的话，就不会存在该问题，所以我就将token信息保存到了sessionStorage中，当获取cookie中的token获取不到的时候，那么再去获取sessionStorage中的token，这样如果sessionStorage中保存了的话，该问题就解决掉了，具体的代码如下： import Cookies from "js-cookie";import cache from "@/plugins/cache";const TokenKey = location.host + "_DcAdmin-Token";const isDefaultLogin = process.env.VUE_APP_IS_DEFAULT_LOGIN;export function getToken() { let token = ""; if (!Cookies.get(TokenKey)) {token = cache.session.get(TokenKey); } else {token = Cookies.get(TokenKey); } return token;}export function setToken(token) { if (isDefaultLogin == "true") {cache.session.set(TokenKey, token); } return Cookies.set(TokenKey, token);}export function removeToken() { cache.session.remove(TokenKey); return Cookies.remove(TokenKey);} VUE_APP_IS_DEFAULT_LOGIN是设置的一个参数，用于设置是否默认登录，即自己在配置文件中设置默认登录的用户名和密码，实现自动登录，也可以是使用单点登录鉴权。在代码中增加“ if (isDefaultLogin == “true”) ”的判断还有一个原因是：不需要在所有情况下都保存到sessionStorage中，只有在需要内嵌系统页面的时候才需要存到sessionStorage，其他情况下不需要保存，保证了系统的安全性，避免被破解攻击，因为使用cookie的安全性比sessionStorage会更高一些。
plugins/cache的代码 const sessionCache = { set (key, value) {if (!sessionStorage) { return}if (key != null && value != null) { sessionStorage.setItem(key, value)} }, get (key) {if (!sessionStorage) { return null}if (key == null) { return null}return sessionStorage.getItem(key) }, setJSON (key, jsonValue) {if (jsonValue != null) { this.set(key, JSON.stringify(jsonValue))} }, getJSON (key) {const value = this.get(key)if (value != null) { return JSON.parse(value)} }, remove (key) {sessionStorage.removeItem(key); }}const localCache = { set (key, value) {if (!localStorage) { return}if (key != null && value != null) { localStorage.setItem(key, value)} }, get (key) {if (!localStorage) { return null}if (key == null) { return null}return localStorage.getItem(key) }, setJSON (key, jsonValue) {if (jsonValue != null) { this.set(key, JSON.stringify(jsonValue))} }, getJSON (key) {const value = this.get(key)if (value != null) { return JSON.parse(value)} }, remove (key) {localStorage.removeItem(key); }}export default { /*** 会话级缓存*/ session: sessionCache, /*** 本地缓存*/ local: localCache} 3.2. 在系统中，不光是token需要存储到cookie中，像用户名、密码等简单的一些信息可能也需要保存到cookie中，那么也需要我们将这些信息保存到sessionStorage中，所以需要写一个公共的设置，统一的设置cookie的信息，具体代码如下： // 设置cookie的值 解决跨域的问题export function getCookie(key) { let value = ""; if (!Cookies.get(key)) {value = cache.session.get(key); } else {value = Cookies.get(key); } return value;}export function setCookie(key, value) { if (isDefaultLogin == "true") {cache.session.set(key, value); } return Cookies.set(key, value);}export function removeCookie(key) { cache.session.remove(key); return Cookies.remove(key);}下面是设置sessionStorage后的效果： 
首先，Cookie、sessionStorage和localStorage都是用于在浏览器端存储数据的机制，但它们在用途、生命周期和存储容量等方面有一些区别。
Cookie:生命周期： 可以设置过期时间，可以是会话级的（浏览器关闭就失效）或持久性的（在指定过期日期前有效）。存储容量： 通常每个Cookie的大小受限制，一般为几KB。用途： 主要用于在客户端存储会话信息，如用户登录状态、购物车内容等。由于每次请求都会携带Cookie，可能会影响性能。 sessionStorage:生命周期： 存储在 session 中，页面会话结束时（例如关闭标签页或浏览器）数据被清除。存储容量： 比Cookie稍大，通常在5-10MB左右。用途： 适合临时保存一些页面会话期间需要用到的数据，不同页面之间无法共享。 localStorage:生命周期： 持久性的存储，除非被显式删除或页面被清除，否则数据将一直存在。存储容量： 比sessionStorage更大，通常在5-10MB左右。用途： 适合永久性地存储一些本地的用户设置、历史记录等信息，不同页面之间可以共享。 场景中的使用： Cookie： 适合在服务器和客户端之间传递小段数据，比如用户登录状态的保持，购物车信息等。 sessionStorage： 适合在同一个页面会话期间保持数据，比如表单临时数据，页面之间的传递。 localStorage： 适合永久性存储，如用户偏好设置、本地缓存数据等。 综上所述，选择使用哪种存储方式取决于你的需求，是临时性的、会话级的还是需要长期保存的。 4. 总结上述描述的内容就是我自己的解决方案，主要解决了谷歌浏览器高版本浏览器88或以上,引用iframe内嵌页面,因为浏览器的安全策略存在跨域，无法使用cookie获取到token信息，导致页面加载不出来的问题，还有其他的解决方案可以在下面给我留言，或者有不懂的地方也可以在下面留言，喜欢的话可以给个关注，会不定时的写一些在开发过程中遇到的一些问题^ - ^