50元求份JS判断代码

白龙君

需要一段JS代码判断浏览器是否支持显示webp，如果支持就加载外部1.js否则加载2.js

Salta

1. function WebpIsSupported(callback){
   
2.     // If the browser doesn't has the method createImageBitmap, you can't display webp format
   
3.     if(!window.createImageBitmap){
   
4.         callback(false);
   
5.         return;
   
6.     }
   
7. 
   
8.     // Base64 representation of a white point image
   
9.     var webpdata = 'data:image/webp;base64, UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoCAAEAAQAcJaQAA3AA/v3AgAA=';
   
10. 
    
11.     // Retrieve the Image in Blob Format
    
12.     fetch(webpdata).then(function(response){
    
13.         return response.blob();
    
14.     }).then(function(blob){
    
15.         // If the createImageBitmap method succeeds, return true, otherwise false
    
16.         createImageBitmap(blob).then(function(){
    
17.             callback(true);
    
18.         }, function(){
    
19.             callback(false);
    
20.         });
    
21.     });
    
22. }
    
23. 
    
24. WebpIsSupported(function(isSupported){
    
25.     if(isSupported){
    
26.         console.log("支持");
    
27.     }else{
    
28.         console.log("不支持");
    
29.     }
    
30. });

复制代码

把console.log("支持");或  console.log("不支持"); 改成输出你的JS就行了

蒂姆·库克

https://blog.csdn.net/weixin_33695450/article/details/89626831

然后自个改改代码就行

572149705

var isSupportWebp = function () {
  try {
    return document.createElement('canvas').toDataURL('image/webp', 0.5).indexOf('data:image/webp') === 0;
  } catch(err) {
    return false;
  }
}

isSupportWebp()







function check_webp_feature(feature, callback) {
    var kTestImages = {
        lossy: "UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA",
        lossless: "UklGRhoAAABXRUJQVlA4TA0AAAAvAAAAEAcQERGIiP4HAA==",
        alpha: "UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAARBxAR/Q9ERP8DAABWUDggGAAAABQBAJ0BKgEAAQAAAP4AAA3AAP7mtQAAAA==",
        animation: "UklGRlIAAABXRUJQVlA4WAoAAAASAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA"
    };
    var img = new Image();
    img.onload = function () {
        var result = (img.width > 0) && (img.height > 0);
        callback(feature, result);
    };
    img.onerror = function () {
        callback(feature, false);
    };
    img.src = "data:image/webp;base64," + kTestImages[feature];
}






const supportsWebp = ({ createImageBitmap, Image }) => {
  if (!createImageBitmap || !Image) return Promise.resolve(false);

  return new Promise(resolve => {
      const image = new Image();
      image.onload = () => {
          createImageBitmap(image)
              .then(() => {
                  resolve(true);
              })
              .catch(() => {
                  resolve(false);
              });
      };
      image.onerror = () => {
          resolve(false);
      };
      image.src = 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=';
  });
};

const webpIsSupported = () => {
  let memo = null;
  return () => {
      if (!memo) {
          memo = supportsWebp(window);
      }
      return memo;
  };
};

webpIsSupported()().then(res => {
    console.log("是否支持 webp", res)
}).catch(err => {
    console.log(err)
})

everdale

一搜一堆，5毛钱流量就够

白龙君

Salta 发表于 2022-1-10 17:35
把console.log("支持");或  console.log("不支持"); 改成输出你的JS就行了

妈的我眼瞎了，谢谢老哥我试试，可以了我私你。

572149705

572149705 发表于 2022-1-10 17:35
var isSupportWebp = function () {
  try {
    return document.createElement('canvas').toDataURL('ima ...

改改  这种还要花钱吗  百度阿铁铁

xuhao0080

https://cl1p.net/jsin
很简单的解决方法
stackoverflow找的

白龙君

Salta 发表于 2022-1-10 17:35
把console.log("支持");或  console.log("不支持"); 改成输出你的JS就行了

直接填js地址不行啊

Salta

白龙君 发表于 2022-1-10 17:51
直接填js地址不行啊

https://zhidao.baidu.com/question/718506054538000445.html