uni-app引入Cesium报错，Failed to execute 'texImage2D' on ...

Failed to execute 'texImage2D' on 'WebGLRenderingContext': The image element contains cross-origin data, and may not be loaded. uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ FFFKKC 已于 2022-03-0318:45:07 修改 1846 收藏 3 分类专栏： Cesium uni-app 文章标签： javascript 前端 于 2022-03-0318:40:42 首次发布 版权声明：本文为博主原创文章，遵循CC4.0BY-SA版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/FFFKKC/article/details/123260850 版权 Cesium 同时被2个专栏收录 1篇文章 0订阅 订阅专栏 uni-app 1篇文章 1订阅 订阅专栏 Failedtoexecute‘texImage2D’on‘WebGLRenderingContext’:Theimageelementcontainscross-origindata,andmaynotbeloaded uni-app引入cesium，在vue页面的视图层引入cesium后，在h5端正常显示cesium地图，在app端或者手机模拟器端不显示地图，无法加载地图，报Failedtoexecute‘texImage2D’on‘WebGLRenderingContext’，显示其中有图片跨域所以无法加载。

解决办法一 版本不符合问题 使用cesium1.83版本测试下；安卓版本或者手机webview不符合； 解决办法二 直接修改cesium源码，添加r.crossOrigin=“anonymous”。

functionloadImageElement(e,t,i){ varr=newImage; r.crossOrigin="anonymous";//添加这行代码 r.onload=function(){ i.resolve(r) },r.onerror=function(e){ i.reject(e) },t&&(TrustedServers.contains(e)?r.crossOrigin="use-credentials":r.crossOrigin=""),r.src=e } //差不多3026行 FFFKKC 关注 关注 1 点赞 踩 3 收藏 打赏 4 评论 uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ Failedtoexecute'texImage2D'on'WebGLRenderingContext':Theimageelementcontainscross-origindata,andmaynotbeloaded 复制链接 扫一扫 专栏目录 Cesium等高线插件 08-29 Cesium等高线插件 "Failedtoexecute'texImage2D'on'WebGLRenderingContext':taintedcanvasesmaynotbeloded." 热门推荐 guoguicheng的博客 04-16 1万+ 出现这错误是因为threejs内部没有处理图片跨域问题，设置图片TextureLoader为允许跨域就可以了varloader=newTHREE.TextureLoader(); loader.setCrossOrigin("Anonymous"); 评论 4 您还未登录，请先 登录 后发表或查看评论 threejs文件包，uniapp里使用echarts、threejs、地图插件等 03-17 threejs文件包，uniapp里使用echarts、threejs、地图插件等 在uni-app中使用Cesium.js 1H1R1M的博客 08-10 2128 #1）背景 最近在做结合uni-app和Cesium.js的webgis开发项目，希望达到写一套前端代码应用（适配）到不同端（web，android，ios，小程序等）的项目。

遇到一些问题，记录下来加强记忆，也希望能帮助到一些同学。

下面罗列一些背景和工具： 框架介绍：什么是uni-app？；第三方库：Cesium.js； 目的：主要用Cesium做一个三维GIS系统，并使其可以在其他移动端运行； 开发工具：HBuilderX； #2）遇到的问题 web端引入... Cesium入门----5行代码快速搭建第一个CesiumApp GISer小康的博客 05-06 1023 Cesium入门----5行代码快速搭建第一个CesiumApp 工具： Cesium1.63.1 nodejs+npm+http-server Vscode 安装Nodejs与http-server 官网下载nodejs，安装即可： https://nodejs.org/en/ nodejs安装完成后自带npm，使用npm安装http-server 控制台： npminstall-g... Failedtoexecute'texImage2D'on'WebGLRenderingContext 叶巷的博客 05-16 1万+ "Failedtoexecute'texImage2D'on'WebGLRenderingContext"报这个错误是渲染模式的问题，应该把渲染模式转变为canvas就可以了 "renderMode":0, //"renderMode"setstherenderertype,onlyusefulonweb: //0- DOMException：Failedtoexecute‘texImage2D’on‘WebGLRenderingContext’ qq_34838790的博客 06-18 2812 UncaughtDOMException:Failedtoexecute‘texImage2D’on‘WebGLRenderingContext’:Theimageelementcontainscross-origindata,andmaynotbeloaded. 解决方法1： 将图片转换为Base64编码，直接有效。

可通过以下地址进行在线转换。

http://www.jq22.com/demo/baseToImage201807250139/ 可直接将您代码调用图片的地 Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘:Theimageelementcontainscross-origin a123789999的博客 04-01 4678 UncaughtDOMException:Failedtoexecute‘texImage2D’on‘WebGLRenderingContext’:Theimageelementcontainscross-origindata,andm... three.js:Failedtoexecute'texImage2D'on'WebGLRenderingContext解决方案 weixin_30917213的博客 11-29 4081 three.js加载图片时，出现Failedtoexecute'texImage2D'on'WebGLRenderingContext.Taintedcanvasesmaynotbeloaded.的错误 跨域安全问题。

解决办法： 1如果你用的是纹理题图：如： varloader=newTHREE.TextureLoader(); 加上： loader.... Failedtoexecute'texImage2D'on'WebGLRenderingContext':Taintedcanvasesmaynotbeloaded. 菜鸟karroy 03-13 7486 three.js:27461DOMException:Failedtoexecute'texImage2D'on'WebGLRenderingContext':Taintedcanvasesmaynotbeloaded. atTHREE.WebGLState.texImage2D(file:///H:/3d_demo/demo6/js/three.js:274... cocosjs显示跨域图片的办法 9527的专栏 11-02 7950 在cocosjs中若要显示一张网络上的图片会遇到以下问题UncaughtSecurityError:Failedtoexecute'texImage2D'on'WebGLRenderingContext':thecross-originimageathttps://www.baidu.com/img/baidu_jgylogo3.gifmaynotbeloaded.虽 cesium备忘录 qq_42751928的博客 04-12 147 适配ie //适用于ie模型出不来，且报错， if(!Uint8Array.prototype.slice){ Uint8Array.prototype.slice=function(){ returnnewUint8Array(this).subarray(this.arguments); } }; //选用其中一个就可以 if(!String.prototype.startsWith){ String.prototype.startsWith=function(search cesium云端服务器部署出现跨域问题 qq_44964344的博客 03-27 428 初学cesium，申请了cesium和天地图的token。

在本地使用nodejs发布服务，浏览器可以正常加载地球，天地图影像加载也都正常。

但当我把相同的东西部署到云端的虚拟主机上之后，就不行了，无法加载地球，出现了如下提示： Anerroroccurredwhilerendering.Renderinghasstopped. SecurityError:Failedtoexecute'texImage2D'on'WebGLRenderingContext':Theimage threejs加载纹理图跨域 最新发布 weixin_46352558的博客 08-03 149 threejs加载纹理图报错Failedtoexecute'texImage2D'on'WebGL2RenderingContext':Theimageelementcontainscross-origindata,andmaynotbeloaded 什么是跨域？解决egret图片跨域报错 Sclifftop-保安大队长 09-07 525 什么是跨域？解决egret图片跨域报错解决图片请求跨域egretAccesstoimageat‘.jpeg’fromorigin‘http://****’hasbeenblockedbyCORSpolicy:The‘Access-Control-Allow-Origin’headerhasavalue‘https://****’thatisnotequaltothesuppliedorigin. uniapp+ruoyi完成websocket即时通讯 qq_29384639的博客 04-28 3497 1、pom.xml中添加 org.springframework.boot spring-boot-starter-websocket 2、创建如下包 视频在H5游戏中的应用 weixin_34256074的博客 04-11 253 前言 游戏中如果需要使用一些预先录制好的动画，动画格式可以选择gif文件和视频文件，视频文件和gif文件相比，size更小（相同质量，gif文件比mp4文件大５倍以上）。

如果视频能在canvas中或者webgl中播放，这样视频可以和其它游戏元素整合，实现以前需要很复杂的方式才能实现的功能，比如在一个旋转的3D立方体中播放视频... “相关推荐”对你有帮助么？ 非常没帮助 没帮助 一般 有帮助 非常有帮助 提交 ©️2022CSDN 皮肤主题：深蓝海洋 设计师：CSDN官方博客 返回首页 FFFKKC CSDN认证博客专家 CSDN认证企业博客 码龄3年 暂无认证 2 原创 128万+ 周排名 146万+ 总排名 4374 访问 等级 39 积分 1 粉丝 3 获赞 6 评论 8 收藏 私信 关注 热门文章 父子组件的生命周期执行顺序 2519 uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ 1843 分类专栏 Cesium 1篇 uni-app 1篇 最新评论 uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ 慢慢敲代码吧: 1.93的版本可以嘛 uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ m0_53697539: 有是有不过被注释了 uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ FFFKKC: 你可以在cesium.js中找一下这个方法loadImageElement。

uni-app引入Cesium报错，Failedtoexecute‘texImage2D‘on‘WebGLRenderingContext‘ m0_53697539: 在那添加呀 父子组件的生命周期执行顺序 看完就攒已成习惯Cc: 问一下博主，第三个执行的是不是父组件的beforeMount周期 您愿意向朋友推荐“博客详情页”吗？ 强烈不推荐 不推荐 一般般 推荐 强烈推荐 提交 最新文章 父子组件的生命周期执行顺序 2022年2篇 目录 目录 分类专栏 Cesium 1篇 uni-app 1篇 目录 评论 4 被折叠的  条评论 为什么被折叠? 到【灌水乐园】发言 查看更多评论 打赏作者 FFFKKC 你的鼓励将是我创作的最大动力 ¥2 ¥4 ¥6 ¥10 ¥20 输入1-500的整数 余额支付 (余额：--) 扫码支付 扫码支付：¥2 获取中 扫码支付 您的余额不足，请更换扫码支付或充值 打赏作者 实付元 使用余额支付 点击重新获取 扫码支付 钱包余额 0 抵扣说明： 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。

2.余额无法直接购买下载，可以购买VIP、C币套餐、付费专栏及课程。

余额充值