如何识别IE11的WebGL兼容性（clearStencil，着色器）正确

Question

在IE11版11.0.9600.16428和下面一些WebGL的方法是无法正常工作（如这里提到的：https://github.com/mrdoob/three.js/issues/3600）

一个例子是方法clearStencil。问题是该方法存在，但它不能正常工作。我想检测并给用户一些反馈。我尝试了Three.js中的Detector.js，但它仅检查浏览器和图形卡是否支持WebGL，而不支持所有相关功能。

我试图做一个WebGL的检查是这样的：

var supportsWebGL=function(){ 
    if(Detector.webgl){ 
     var _canvas = document.createElement('canvas'); 
     var _gl = _canvas.getContext('webgl') || _canvas.getContext('experimental-webgl'); 
     try{ 
      _gl.clearStencil(0); 
     }catch(e){ 
      return false; 
     } 
     return true; 
    }else{ 
     return false; 
    } 
} 

在IE11（11.0.9600.16428）supportsWebGL返回true，但给了我这样的错误方法：

WEBGL11095：无效 - 操作：clearStencil：方法当前不支持 。

现在我想我的方法supportsWebGL检测到不兼容性并返回false。有谁知道如何做到这一点？

Answer 1

我发现了一个办法做到这一点通过使用_gl.getError()

var supportsWebGL=function(){ 
    if(Detector.webgl){ 
     var _canvas = document.createElement('canvas'); 
     var _gl = _canvas.getContext('webgl') || _canvas.getContext('experimental-webgl'); 
     var errors=undefined;   
     try{ 
      _gl.clearStencil(0); 
      errors=_gl.getError(); 
     }catch(e){ 
      return false; 
     } 
     return errors==0; 
    }else{ 
     return false; 
    } 
} 

只有errors等于零该方法将返回true。如果您有其他方法需要检查，只需将它们添加到try/catch区块。

如果你需要，没有three.js所工作的解决方案，检查了这一点：

var supportsWebGL=function(){ 
    if(!window.WebGLRenderingContext)return false; 
    try{ 
     var _canvas = document.createElement('canvas'); 
     var _gl = _canvas.getContext('webgl') || _canvas.getContext('experimental-webgl'); 
     _gl.clearStencil(0); 
     var errors=_gl.getError(); 
     return errors==0; 
    }catch(e){ 
     return false; 
    } 
} 

Answer 2

我现在可以想到的最好方法是检查浏览器及其版本。

把这个代码片段以获取浏览器的名称和它的版本（仅适用于专业）：

var browserInformation = (function() { 
var temporal = undefined; 
var userAgent = navigator.userAgent; 
var matches = userAgent.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []; 
if (/trident/i.test(matches[1])) { 
    temporal = /\brv[ :]+(\d+)/g.exec(userAgent) || []; 
    return 'Internet Explorer ' + (temporal[1] || ''); 
} 
if (matches[1] === 'Chrome') { 
    temporal = userAgent.match(/\bOPR\/(\d+)/); 
    if (temporal != null) 
     return 'Opera ' + temporal[1]; 
} 
matches = matches[2] ? [matches[1], matches[2]] : [navigator.appName, navigator.appVersion, '-?']; 
if ((temporal = userAgent.match(/version\/(\d+)/i)) != null) 
    matches.splice(1, 1, temporal[1]); 
return matches.join(' ');})(); 

这个片段将在格式[Browsername版本]，即Internet Explorer 11返回一个字符串。