要檢測瀏覽器是否支持WebP格式,可以使用JavaScript來獲取瀏覽器的功能并將其發送到PHP
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WebP Support Check</title>
</head>
<body>
<script>
function checkWebPSupport() {
const tester = new Image();
tester.onload = function () {
if (tester.width === 2 && tester.height === 1) {
document.location.href = 'check_webp.php?support=true';
} else {
document.location.href = 'check_webp.php?support=false';
}
};
tester.onerror = function () {
document.location.href = 'check_webp.php?support=false';
};
tester.src = 'data:image/webp;base64,UklGRiIAAABXRUSOQVQ4lAAACAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA';
}
checkWebPSupport();
</script>
</body>
</html>
這段代碼會嘗試加載一個WebP圖像。如果成功,說明瀏覽器支持WebP格式,然后將用戶重定向到check_webp.php
文件并附加support=true
參數。如果失敗,將用戶重定向到check_webp.php
文件并附加support=false
參數。
<?php
$webp_support = isset($_GET['support']) && $_GET['support'] == 'true';
if ($webp_support) {
echo "瀏覽器支持WebP格式";
} else {
echo "瀏覽器不支持WebP格式";
}
?>
這段PHP代碼會檢查URL參數support
的值,如果為true
,則表示瀏覽器支持WebP格式,否則表示不支持。
現在,當用戶訪問index.html
時,頁面會自動檢測瀏覽器是否支持WebP格式,并顯示相應的結果。