关于 qiankun 微前端本地跨域问题

最新推荐文章于 2024-08-03 10:34:23 发布

悠闲码

最新推荐文章于 2024-08-03 10:34:23 发布

阅读量1.5k

点赞数 1

分类专栏： qiankun 文章标签：前端 javascript

本文链接：https://blog.csdn.net/qq_53439433/article/details/132018231

版权

qiankun 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

登录后，访问子应用页面，出现跨域问题错误

需要修改 vue.config.js配置信息

const os = require('os');
/**
 * 获取本机的网络 IP 地址。通过使用 Node.js 内置模块 os 的 networkInterfaces() 方法来获取所有的网络接口信息。
 * 然后遍历每个网络接口，找到第一个 IPv4 地址，并确保它不是回环地址（127.0.0.1）和内部地址。
 * 将找到的 IP 地址存储在 needHost 变量中，并返回该值
 */
function getNetworkIp() {
    let needHost = ''; // 打开的host
    try {
        // 获得网络接口列表
        let network = os.networkInterfaces();
        for (let dev in network) {
            let iface = network[dev];
            for (let i = 0; i < iface.length; i++) {
                let alias = iface[i];
                if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
                    needHost = alias.address;
                }
            }
        }
    } catch (e) {
        needHost = 'localhost';
    }
    return needHost;
}

let devPublicPath = `//${getNetworkIp()}:${process.env.VUE_APP_MicroPort}`
let proPublicPath = `/${process.env.VUE_APP_MICRONAME}/`
module.exports = {
//...
 publicPath: process.env.NODE_ENV === "production" ? proPublicPath : devPublicPath,
}