妙用vercel搭建一个随机背景图片API [复制链接]

帖子链接已复制到剪贴板
懋和道人 (UID: 1319) 3月前
帖子已经有人评论啦,不支持删除!

221 7

使用GitHub搭建一个项目,名称自定义;

其次编写一个/api/image.js文件,我是获取的哪里的图片,就不多余介绍

import fetch from 'node-fetch';

export default async function handler(req, res) {
  const action = req.query.action || 'list';
  const cacheDir = '/tmp/img';

  if (action === 'list') {
    // 获取分类列表
    const url = "http://cdn.apc.360.cn/index.php?c=WallPaper&a=getAllCategoriesV2&from=360chrome";
    try {
      const response = await fetch(url);
      const categories = await response.json();
      res.status(200).json(categories);
    } catch (error) {
      res.status(500).json({ error: 'Failed to fetch category list' });
    }
  } else if (action === 'get_images') {
    // 获取某个分类下的图片
    const cid = req.query.cid || '';
    if (!cid) {
      return res.status(400).json({ error: 'No category ID provided' });
    }

    const start = req.query.start || 0;
    const count = req.query.count || 10;
    const url = `http://wallpaper.apc.360.cn/index.php?c=WallPaper&a=getAppsByCategory&cid=${cid}&start=${start}&count=${count}&from=360chrome`;

    try {
      const response = await fetch(url);
      const data = await response.json();

      if (!data.data || data.data.length === 0) {
        return res.status(404).json({ error: 'No images found in the API response' });
      }

      // 随机选择一张图片
      const item = data.data[Math.floor(Math.random() * data.data.length)];
      if (item.url) {
        const imageResponse = await fetch(item.url);
        const imageData = await imageResponse.buffer();
        res.setHeader('Content-Type', 'image/jpeg');
        return res.status(200).send(imageData);
      } else {
        return res.status(404).json({ error: 'No valid image URLs found' });
      }
    } catch (error) {
      return res.status(500).json({ error: 'Failed to fetch images' });
    }
  } else {
    res.status(400).json({ error: 'Invalid action' });
  }
}

然后编写个/package.json文件

{
  "name": "名",
  "version": "1.0.0",
  "main": "index.js",
  "dependencies": {
    "node-fetch": "2.6.7"
  }
}

然后再写一个/vercel.json文件

{
  "version": 2,
  "builds": [
    {
      "src": "api/image.js",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/api/image",
      "dest": "/api/image.js"
    }
  ]
}

很明显上述步骤初步实现,目录结构如下:

image.png

参考项目地址:

https://github.com/wulintang/wulintangimg

项目在线演示:

https://www.taoisms.org.cn/

米表,www.dao.js.cn/mi
已有评论 (7)
提示:您必须 登录 才能查看此内容。
创建新帖
广告推广点击空位自助购买