如何允许WebGL从本地载入资源
随着mono-design不断推广,用户越来越多,陆续有电话来询问“为什么3D展现的时候,是一团黑?”,针对这个问题,专门写个帖子说明原因并给出解决方案,并且在mono-design编辑器中加了判断功能,同时链接到这里,不用等到发现一团黑时,才知道出问题。
好了,言归正传,开始分析问题:
当发现3D展现是一团黑的时候,在控制台如果看到“Unable to get image data from canvas because the canvas has been tainted by cross-origin data.”的错误提示,这是因为浏览器的安全策略,“同源策略”。浏览器为了阻止欺骗,会追踪 image data。当你把一个“跟canvas的域不同的”图片放到canvas上,这个canvas就成为 “tainted”(被污染的,脏的),浏览器就不让你操作该canvas 的任何像素。
这个问题有两种解决方案
方案一:有服务器环境,将项目部署在web服务器上,最简单的tomcat。
mono-design的目录中并直接移动到例如apache-tomcat-6.0.37\webapps\ROOT\下,然后浏览器打开后输入http://localhost/mono-design/即可。
方案二:设置浏览器
On Windows:
Chrome:
1、得到Chrome的安装路径,例如:
C:\Users\-your-user-name\AppData\Local\Google\Chrome\Application
2、在命令行窗口,输入安装路径,加上–allow-file-access-from-files参数,例如:
Chrome installation path\chrome.exe --allow-file-access-from-files
,回车执行,启动Chrome
3、测试的一个临时方法::复制一个Chrome的快捷方式,右键->属性->目标的文本框中加上参数
--allow-file-access-from-files
,例如:
"Chrome installation path\chrome.exe" --allow-file-access-from-files
IE11:默认可以加载本地图片
Firefox:
1、Firefox的用户请在浏览器的地址栏输入“about:config”,回车
2、在过滤器(filter)中搜索“security.fileuri.strict_origin_policy”
3、将security.fileuri.strict_origin_policy设置为false
4、关闭目前开启的所有Firefox窗口,然后重新启动Firefox。
On Mac:
Chrome:从命令行窗口中启动,启动命令为
open /Applications/Google\ Chrome.app --args --allow-file-access-from-files
Safari:
1、Safari->偏好设置->高级->勾选“在菜单栏中显示‘开发’菜单”
2、开发->勾选“启用WebGL”
3、开发->勾选“停用本地文件限制”
Firefox:
1、Firefox的用户请在浏览器的地址栏输入“about:config”,回车
2、在过滤器(filter)中搜索“security.fileuri.strict_origin_policy”
3、将security.fileuri.strict_origin_policy设置为false
4、关闭目前开启的所有Firefox窗口,然后重新启动Firefox。
如何允许WebGL从本地载入资源的更多相关文章
- 【chrome】设置chrome允许WebGL从本地载入资源
找到chrome安装路径,然后创建一个快捷方式,右击该快捷方式,在 目标 输入框中加上-allow-file-access-from-files(前面加个空格),通过该快捷方式打开chrome就可以通 ...
- UE4异步载入资源
转自:http://blog.ch-wind.com/ue4%E5%BC%82%E6%AD%A5%E8%BD%BD%E5%85%A5%E8%B5%84%E6%BA%90/ 所有的“硬”指针指向的资源都 ...
- Charles学习(四)之使用Map local代理本地静态资源以及配置移动端代理在真机上调试iOS和Android客户端
前言 问题一:我们在App内嵌H5开发的过程中,肯定会遇到一个问题就是我不想在chrome的控制台中调试也不想在模拟器中调试,我想要在真机上调试,那么如何解决这个问题呢? 问题二:我们期待调试时达到的 ...
- Charles学习(三)之使用Map local代理本地静态资源以及配置网页代理在Mac模拟器调试iOS客户端
前言 问题一:我们在App内嵌H5开发的过程中,肯定会遇到一个问题就是我不想在chrome的控制台中调试,我想要在手机上调试,那么如何解决这个问题呢? 问题二:我们期待调试时达到的效果就是和Charl ...
- Charles学习(二)之使用Map local代理本地静态资源以及配置网页代理在Mac浏览器上调试移动端
前言 我们在开发的过程肯定是一边写代码,一边查看自己的代码写的是否存在问题,那么问题来了,有两种情况 情况一:我们可以本地起服务,那么我们就可以在本地检查自己的代码,查看运行结果 情况二:本地无法起服 ...
- 关于Cocos2d-x多线程异步载入资源的问题
我们通常使用CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile("xxx.plist" ...
- 使用 electron 和 electron-forge 加载 本地磁盘资源 img 的问题
最近在学习使用 electron 进行桌面开发一款图片压缩的软件.遇到了加载本地磁盘文件的问题.记录一下其解决方案. 使用 electron 加载本地磁盘文件 第一种方法 设置webPreferenc ...
- cocos2d-x 3.6版连连看载入资源
网上找了一个梦幻连连看的资源.大家能够百度一下.然后整理一下加到project里面去.包含声音和图片文件.后面解释怎样整理能够方便管理. 我不推荐在代码里面直接引用资源文件名称,我称之为硬编码. 做i ...
- 【原创】面向对象版本地CPU资源占用监控脚本
前期准备: 1.python2.7环境 2.相关第三方库下载安装 脚本工作过程: 1.根据输入的进程名判断进程是否存在,如果不存在则进行等待,直到检测到进程PID,中途进程退出抛出异常,键入enter ...
随机推荐
- 网络学习笔记:TCP/IP连网和Internet
1.网关 由硬件和软件组成,实现不同网段间的数据传送. 常用路由器充当网关. 网关通常维护一份路由表,但只有少量的编址信息.它用这些信息把数据转发到知道更多信息的网关. 组成互联网骨干的网关称为核心网 ...
- sar 找出系统瓶颈的利器 目前Linux上最为全面的系统性能分析工具之一 直接 sar -dur 1 30 即可看内存 CPU和IO占用
12. sar 找出系统瓶颈的利器 sar是System Activity Reporter(系统活动情况报告)的缩写.sar工具将对系统当前的状态进行取样,然后通过计算数据和比例来表达系统的当前运行 ...
- 类型配置命名空间 —— XML schema
对于基于 XML 的配置,Spring 2.0 以后告别 DTD 格式(Document Type Definition)的配置文件,开始采用 Schema 格式,Schema 的突出亮点即是可让不同 ...
- Linux 常用命令大全2
Linux 常用命令大全 [帮助命令] command —help man command man 2 command 查看第2个帮助文件 man -k keyword 查找含有关键字的帮助 info ...
- Spark GraphX 属性图操作
package Spark_GraphX import org.apache.spark.graphx._ import org.apache.spark.rdd.RDD import org.apa ...
- git 删除本地仓库
更新: 2017/06/27 修改格式,备注mac下的命令没测试过 windows: rm .git/ mac: sudo rm -rf .git/ 没验证
- bzoj 4809: 皇后【dfs】
爆搜卡线过 并不知道正解是啥 #include<iostream> #include<cstdio> using namespace std; const int N=40; ...
- bzoj 4297: [PA2015]Rozstaw szyn【瞎搞】
从叶子往上先拓扑一下,建立虚拟root,从root开始dfs.注意到每个点的最优取值一定是一个区间(中位数区间),从儿子区间推出父亲区间即可 #include<iostream> #inc ...
- 2017青岛网络赛1011 A Cubic number and A Cubic Number
A Cubic number and A Cubic Number Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 65535/3276 ...
- C# 类型转换方法
C# 类型转换方法 C# 提供了下列内置的类型转换方法: 序号 方法 & 描述 1 ToBoolean 如果可能的话,把类型转换为布尔型. 2 ToByte 把类型转换为字节类型. 3 ToC ...