阿浪
阿浪
  • 发布:2021-02-01 10:09
  • 更新:2021-02-01 11:25
  • 阅读:554

H5画板画图,hbuildX可以生成, 在Chrome和真机里出现图片资源跨域

分类:HBuilderX

发生环境

HbuildX (3.0.7), Win10,OSS

问题

用uni.createCanvasContext()生成画布对象后,生成画板图片时,引用图片资源产生跨域报错。
HbuildX里不报错 ,在Chrome和真机里报错。
尝试了转换成base64和在放置在项目本地。都还是同样的问题。

具体代码如下:

let cv = uni.createCanvasContext("canvasOne");  
   uni.getImageInfo({  
    src:"../../../static/img/shareBg.jpg",  
    success:(resBg)=>{  
      cv.drawImage(resBg.path,0,0,1080,1920);  
      cv.save();  
      cv.draw(false,setTimeout(()=>{  
       uni.canvasToTempFilePath({  
        canvasId:"canvasOne",  
        fileType:"jpg",  
        success:(res)=>{  
         this.imgPath = res.tempFilePath;  
         this.canvasStatus = true;  
         uni.hideLoading();  
        },  
        fail:(err)=>{  
         uni.hideLoading();  
         this.$util.Tips({  
          title:"绘制失败,请退出重试"  
         })  
        }  
       })  
      },400));  
     })  
    },  
    fail:(errBg)=>{  
     uni.hideLoading();  
     this.$util.Tips({  
      title:"获取背景失败,请退出重试"  
     })  
    }  
   })

报错如下:

Chrome报错

2021-02-01 10:09 负责人:无 分享
已邀请:
DCloud_UNI_GSQ

DCloud_UNI_GSQ

HBuilderX 为了调试方便允许了跨域,在其他浏览器或者线上项目请配置好你的 oss 允许跨域的域名

  • 阿浪 (作者)

    已解决,阿里OSS跨域配置错误导致的。Thanks♪(・ω・)ノ


    2021-02-01 19:40

该问题目前已经被锁定, 无法添加新回复