瓜奇侧边栏音乐小组件如何简单的设置随机图片

发布于 更新于
3

相信大家在使用构建器时也觉得设置这个图片相当麻烦,这里我给大家提供一个简单的解决办法,就是随机图片api接口,只需要填写一个接口地址,每次刷新网页时显示的图片都会不一样,好了下面教程开始。

首先:搞一个放接口的站点,创建img文件夹,里面放你搜集好的webp格式的图片文件,然后再同级目录下创建api.php文件,将下方代码复制进去保存,访问这个接口就行。接口能正常访问后,这这个接口的地址填到构建器中就行。

注意:图片格式必须为webp,节省空间,如果没有的话可以从本站里面搜集,本站文章内容里面的图片都是webp格式的,整体来说很简单,只要浏览器访问接口可以直接返回图片就行。

代码区域

<?php
/**
 * 随机显示img文件夹中的WebP图片 API
 * 接口说明:
 * - 请求方式:GET
 * - 响应结果:直接输出WebP图片(浏览器可直接显示)
 * - 图片文件夹:与当前API文件同级的img目录
 */

// 设置响应头:允许跨域访问(生产环境建议限制具体域名)
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: GET");

// 定义图片文件夹路径(绝对路径,避免相对路径问题)
$imgDir = __DIR__ . '/img/';

try {
    // 1. 检查图片文件夹是否存在
    if (!is_dir($imgDir)) {
        throw new Exception('图片文件夹不存在', 404);
    }

    // 2. 检查文件夹是否可读
    if (!is_readable($imgDir)) {
        throw new Exception('图片文件夹没有读取权限', 403);
    }

    // 3. 查找所有WebP格式图片(区分大小写:.webp、.WEBP等)
    $webpFiles = glob($imgDir . '*.{webp,WEBP,WebP,wEbP}', GLOB_BRACE);

    // 4. 检查是否有WebP图片
    if (empty($webpFiles)) {
        throw new Exception('img文件夹中未找到WebP格式图片', 404);
    }

    // 5. 随机选择一张图片
    $randomFile = $webpFiles[array_rand($webpFiles)];

    // 6. 检查文件是否可读
    if (!is_file($randomFile) || !is_readable($randomFile)) {
        throw new Exception('选中的图片文件不可读或已损坏', 500);
    }

    // 7. 验证文件是否为有效的WebP格式(简单验证文件头)
    $fileHeader = file_get_contents($randomFile, false, null, 0, 4);
    $webpSignature = pack('H*', '52494646'); // WebP文件头标识(RIFF)
    if ($fileHeader !== $webpSignature) {
        throw new Exception('选中的文件不是有效的WebP格式', 500);
    }

    // 8. 设置图片响应头,输出图片
    header("Content-Type: image/webp");          // 声明WebP格式
    header("Content-Length: " . filesize($randomFile)); // 告诉浏览器文件大小
    header("Cache-Control: no-cache, no-store, must-revalidate"); // 禁用缓存(每次请求都获取新图片)
    header("Pragma: no-cache");
    header("Expires: 0");

    // 输出图片内容(高效读取文件,适合大图片)
    readfile($randomFile);
    exit;

} catch (Exception $e) {
    // 错误处理:返回对应HTTP状态码和错误信息
    http_response_code($e->getCode() ?: 500);
    header("Content-Type: text/plain; charset=utf-8");
    echo "错误:" . $e->getMessage() . "\n";
    echo "状态码:" . ($e->getCode() ?: 500);
    exit;
}

常见问题(FAQ)

0 / 600
欢迎参与讨论 登录/注册
0 条评论
热门最新
嗨,不要熬夜哦!
所有的成功,都源自一个勇敢的开始
我的会员
加入会员后,您将获得更多权益!
文章
描述文章的内容一般是一行详细的文字