search

micro-zoe / micro-app

A simple, efficient and powerful micro front-end framework. 一款简约、高效、功能强大的微前端框架
https://micro-zoe.github.io/micro-app/
MIT License
5.63k stars 572 forks source link

基座下业务应用动态创建script标签资源跨域 #377

Closed Jedanny closed 1 year ago

Jedanny commented 2 years ago

问题描述

基座下单个业务用到了腾讯地图，业务应用单独访问正常，基座下访问动态加载远程js跨域 ，怀疑动态创建script 挂载在body 下基座代理fetch执行安全策略拦截掉了

复现步骤

  1. 使用 qqmap-plus 初始化腾讯地图 
    import qqmapPlus from 'qqmap-plus'
 qqmapPlus.init('api-key', () => {
        const options = {
          center: new qq.maps.LatLng(position.coords.latitude, position.coords.longitude),
          zoom: this.zoom
        }
        this.map = new qq.maps.Map(container, options)
      }, ['geometry'])

上传截图

请上传代码截图、控制台、终端等截图以帮助我们了解您的问题。 正常访问类型为script image 跨域为fetch image

image 正常无origin 头 image 基座下执行带有origin头，跨域 image

复现仓库

请提供一个精简的代码仓库，然后上传到自己的 github，以帮助我们复现您的问题。

环境信息

xiangxinji commented 2 years ago

静态文件需要自己做代理

bailicangdu commented 2 years ago

可以将地图js放在基座中加载避免这个问题

Jedanny commented 2 years ago

放在基座下算是个临时解决方案 不优雅 业务的职能由基座去承载了一部分 官方后续这块有计划调整么

bailicangdu commented 2 years ago

地图js属于第三方文件，无法要求第三方设置跨域，所以只能采用降级方案，放入基座或者下载到本地

Jedanny commented 2 years ago

妥妥的

huchaolin commented 2 years ago

25 Apr

请问这位同学你最后找到解决方法了吗， 我这就算作代理， 自定义fetch拦截之后做代理拿到资源之后也没有正常加载script

chylhos commented 1 year ago

25 Apr

请问这位同学你最后找到解决方法了吗， 我这就算作代理， 自定义fetch拦截之后做代理拿到资源之后也没有正常加载script

请问解决了吗，我是第三方js资源，设置mode: 'no-cors'确实能拿到，但是实际上并没有生效

xiangxinji commented 1 year ago

25 Apr

请问这位同学你最后找到解决方法了吗， 我这就算作代理， 自定义fetch拦截之后做代理拿到资源之后也没有正常加载script

请问解决了吗，我是第三方js资源，设置mode: 'no-cors'确实能拿到，但是实际上并没有生效

no-cors 只是 fetch 不会爆跨域的错误, 但是拿到的内容依然是空的, 可以用个 node 或者什么做个转发比较好

raoenhui commented 1 year ago

把地图js下载下来，放入基座或者放在子应用服务器中加载

iYogic2 commented 11 months ago

按此操作 do like this: https://github.com/micro-zoe/micro-app/issues/1009