webp实践的javascript检测方案
function hasWebp () {
// 查看Cookie,如果没有则进行以下逻辑
var img = new Image();
img.onload = handleSupport;
img.onerror = handleNotSupport;
img.src = 'data:image/webp;base64,UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAsAAAABBxAREYiI/gcAAABWUDggGAAAADABAJ0BKgEAAQABABwlpAADcAD+/gbQAA==';
// 否则根据Cookie执行handleSupport或者handleNotSupport
}
function handleSupport() {
setCookie('swebp', 'true', 2592000); // 30天过期
}
function handleNotSupport () {
setCookie('swebp', 'false', 2592000);
}
下面是 localStorage版本
function detectWebp () {
if (!window.localStorage || typeof localStorage !== 'object') return; var name = 'webpa'; // webp available
if (!localStorage.getItem(name) || (localStorage.getItem(name) !== 'available' && localStorage.getItem(name) !== 'disable')) { var img = document.createElement('img'); img.onload = function () {
try {
localStorage.setItem(name, 'available');
} catch (ex) {
}
}; img.onerror = function () {
try {
localStorage.setItem(name, 'disable');
} catch (ex) {
}
};
img.src = 'data:image/webp;base64,UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAsAAAABBxAREYiI/gcAAABWUDggGAAAADABAJ0BKgEAAQABABwlpAADcAD+/gbQAA==';
}
}
webp实践的javascript检测方案的更多相关文章
- Javascript检测浏览器对CSS属性的支持 /* supports */
//检测浏览器对CSS属性的支持 supports = (function() { var div = document.createElement('div'), vendors = 'Khtml ...
- JavaScript检测之basevalidate.js
上篇文章「JavaScript检测原始值.引用值.属性」中涉及了大量有用的代码范例,为了让大家更方便的使用这些代码,博主特意把这些代码重新整理并托管到 GitHub,项目地址是:https://git ...
- javascript检测当前浏览器是否为微信浏览器
<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...
- 如何用Javascript检测到所有的IE版本
如何用Javascript检测到所有的IE版本 function GetIEVersion() { var sAgent = window.navigator.userAgent; var Idx = ...
- JavaScript检测数据类型
JavaScript检测数据类型 标签(空格分隔): JavaScript function valType(value) { return Object.prototype.toString.cal ...
- 用 JavaScript 检测浏览器在线/离线状态(JavaScript API — navigator.onLine)
如今HTML5 移动应用或 Web app 中越来越普遍的使用了离线浏览技术,所以用 JavaScript 检测浏览器在线/离线状态非常常见. 无论浏览器是否在线,navigator.onLine 属 ...
- Linux入侵痕迹检测方案【华为云技术分享】
背景说明 扫描是一切入侵的基础,通过扫描来发现目标主机是否为活动主机.操作系统是什么版本.开放了哪些服务等.扫描技术纷繁复杂,新的扫描技术也层出不穷,不可能穷举所有扫描技术,下面按入侵步骤对主机扫描. ...
- 文件上传——客户端检测绕过(JavaScript检测)(一)
前言 通常再一个web程序中,一般会存在登陆注册功能,登陆后一般会有上传头像等功能,如果上传验证不严格就可能造成攻击者直接上传木马,进而控制整个web业务控制权.下面通过实例,如果程序只进行了客户端J ...
- LCD显示器缺陷自动化检测方案
很牛的测试 参考: 1.https://www.radiantvisionsystems.com/ 2.https://www.radiantvisionsystems.com/node/275 LC ...
随机推荐
- 关于T/G/M/K
//扫盲贴 K, G, T,都是表数量,只是个数字,在不同的场合下表示的不同.在计算机行业中,这几个量可用来表示数据传输速度和容量,下面分别讨论,希望不了解的朋友不要被某知道上的误解了.如果有什么错误 ...
- 冲刺Two之站立会议7
今天我们把软件的基本功能完成之后,又对所有的界面进行了统一规范化并进行了相应的优化.
- File类操作文件
简单示例: public static void main(String[] args) { // 列出系统所有的根路径 File[] listRoots = File.listRoots(); fo ...
- Beta阶段敏捷冲刺②
1.提供当天站立式会议照片一张. 每个人的工作 (有work item 的ID),并将其记录在码云项目管理中: 1.1昨天已完成的工作. 姓名 昨天已完成的工作 徐璐琳 完成设置界面的排版 祁泽文 实 ...
- Linux命令(二) 复制文件 cp
cp命令用来复制文件或目录,当复制多个文件时,目标文件参数必须为已经存在的目录,否则将出现错误. cp命令默认不能复制目录,复制目录必须使用 -R 选项.cp命令具备了 ln命令的功能. 命令格式: ...
- POWERSHELL 计划任务的创建,收集DC中失败的登录信息并邮件通知
(注:本文参考以下前辈文章修改而来,源文章连接:http://itadmindev.blogspot.hk/2011/07/powershell-ad-dc-failed-logins-report. ...
- UML时序图学习
定义 时序图主要用于展示对象之间交互的顺序. 时序图将交互关系表示为一个二维图.纵向是时间轴,时间沿竖线向下延伸.横向轴代表了在协作中各独立对象的类元角色.类元角色用生命线表示.当对象存在时,角色用一 ...
- Java微信二次开发(一)
准备用Java做一个微信二次开发项目,把流程写在这里吧. 第一天,做微信请求验证 需要导入库:servlet-api.jar 第一步:新建包com.wtz.service,新建类LoginServle ...
- C#中几种创建对象的方式的对比
最近学习了msil,发现了很多好玩的,今天介绍一个用IL来创建对象的方式 1.最常见的两种创建对象方式 public static T Create<T>() where T : new( ...
- 一本通1635【例 5】Strange Way to Express Integers
1635:[例 5]Strange Way to Express Integers sol:貌似就是曹冲养猪的加强版,初看感觉非常没有思路,经过一番艰辛的***,得到以下的结果 随便解释下给以后的自己 ...