Docker Compose部署随机图API
Docker Compose部署随机图API
平时我们部署博客的时候,为了考虑美观会考虑使用随机图来作为文章的封面,现在有很多大佬愿意提供随机图API,通过API我们可以很方便地部署随机图,不必自己寻找图片,考虑带宽支出
不过很多时候一些公益API访问速度很慢,其中很多图片并不是我们所想要的,这时候我们就要考虑自建随机图API了,我参考了很多教程,他们中的很多都是基于宝塔来实现的,但其实我们不必要安装宝塔面板,完全可以在Docker内实现
前置准备
首先我们先建立一个文件夹来方式我们的docker-compose
和其他的随机图文件,并且进入该文件夹内:
mkdir random-pic && cd random-pic
之后上传随机图的php
文件,在这里有三个版本,其中一个版本我尝试过无法使用(可能是我没有正确使用?
原理介绍
随机图的基本实现是通过新建一个站点,通过向站点发送请求,站点文件将请求重定向(301)到随机图所在图链,从而实现随机图切换:
图片准备
获取到原始图片之后,我建议你对图片继续压缩处理,常见的诸如将图片转换成webp
,这能有效减小文件体积,加快用户端的加载速度,如果你使用的是对象存储或者套了CDN的话,这能减小带宽和费用压力
在这里推荐一下来自Google的Squoosh,是一个很全能的图片压缩程序,不用下载,直接在浏览器中就可以使用:网址
基本上支持了常见图片类型的转换和压缩:
版本1(不支持桌面与移动端切换
<?php
//存放api随机图链接的文件名img.txt
$filename = "img.txt";
if(!file_exists($filename)){
die('文件不存在');
}
//从文本获取链接
$pics = [];
$fs = fopen($filename, "r");
while(!feof($fs)){
$line=trim(fgets($fs));
if($line!='' && substr($str , 0 , 1) != '#'){
array_push($pics, $line);
}
}
// 从数组随机获取链接
// $pic = $pics[array_rand($pics)];
$pic = $pics[random_int(0, count($pics) - 1)]; # 真随机
//返回指定格式
$type=$_GET['type'];
switch($type){
//JSON返回
case 'json':
header('Content-type:text/json');
die(json_encode(['pic'=>$pic]));
default:
die(header("Location: $pic"));
}
?>
此时你要在该文件夹内新建一个img.txt
文件,用来保存随机图的图链,这里的图链就决定了你图片加载的速度,请务必选择一些速度比较快的图床,这能够有效提高使用体验和加载速度:
此时你的文件结构应该如下,有img.txt
和random.php
两个文件
.
├── img.txt
└── random.php
版本2(支持桌面与移动端切换
<?php
// 函数:访客设备
function is_mobile() {
if (empty($_SERVER['HTTP_USER_AGENT']) ||
strpos($_SERVER['HTTP_USER_AGENT'], 'iPad') !== false) {
// 因为iPad有类似于PC的长宽比,所以我设置为电脑端
$is_mobile = false;
} elseif ( strpos($_SERVER['HTTP_USER_AGENT'], 'Mobile') !== false
|| strpos($_SERVER['HTTP_USER_AGENT'], 'Android') !== false
|| strpos($_SERVER['HTTP_USER_AGENT'], 'Silk/') !== false
|| strpos($_SERVER['HTTP_USER_AGENT'], 'Kindle') !== false
|| strpos($_SERVER['HTTP_USER_AGENT'], 'BlackBerry') !== false
|| strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mini') !== false
|| strpos($_SERVER['HTTP_USER_AGENT'], 'Opera Mobi') !== false ) {
$is_mobile = true;
} else {
$is_mobile = false;
}
return $is_mobile;
}
// 电脑与手机用不同的壁纸
if(is_mobile()){
// 手机壁纸
$filename = "img_mobile.txt";
}else{
// 电脑壁纸
$filename = "img.txt";
}
//存放api随机图链接的文件名img.txt
if(!file_exists($filename)){
die('文件不存在');
}
//从文本获取链接
$pics = [];
$fs = fopen($filename, "r");
while(!feof($fs)){
$line=trim(fgets($fs));
if($line!='' && substr($str , 0 , 1) != '#'){
array_push($pics, $line);
}
}
//从数组随机获取链接
$pic = $pics[array_rand($pics)];
//返回指定格式
$type=$_GET['type'];
switch($type){
//JSON返回
case 'json':
header('Content-type:text/json');
die(json_encode(['pic'=>$pic]));
default:
die(header("Location: $pic"));
}
?>
使用这种方法,你需要额外添加一个img_mobile.txt
文件来放置用于移动端的图片,文件内容同img.txt
此时你的文件结构应该如下:
.
├── img_mobile.txt
├── img.txt
└── random.php
版本3(尚未成功
此版本需要引用Mobile_Detect.php
,用于检测用户的设备类型(如手机、平板、桌面等),你需要自行去GitHub上下载源码,并且将它放置到此文件夹内:
- 访问 GitHub 仓库:
- 下载 ZIP 文件:
- 在仓库页面上,点击绿色的 “Code” 按钮,然后选择 “Download ZIP” 以下载整个仓库的压缩包。
- 解压并找到
Mobile_Detect.php
:- 解压下载的 ZIP 文件,在解压后的目录中,找到
src/Mobile_Detect.php
文件。
- 解压下载的 ZIP 文件,在解压后的目录中,找到
- 将文件放到正确的位置:
- 将
Mobile_Detect.php
文件放置到你的项目目录中,例如/root/random-pic/
。
- 将
之后random.php
的内容为:
<?php
/*
* 函数:访客设备
* 博客园:https://www.cnblogs.com/freephp/p/13979503.html
* Github: https://github.com/serbanghita/Mobile-Detect
*/
function is_mobile(){
require(__DIR__ . '/MobileDetect.php'); // 修正文件路径
$MobileDetect = new Mobile_Detect();
if ($MobileDetect->isTablet()) {
// 平板定义为PC类
return false;
} elseif ($MobileDetect->isMobile()) {
return true;
} else {
return false;
}
}
// 电脑与手机用不同的壁纸
$filename = is_mobile() ? "img_mobile.txt" : "img.txt";
// 存放api随机图链接的文件名
if(!file_exists($filename)){
die('文件不存在');
}
// 从文本获取链接
$pics = [];
$fs = fopen($filename, "r");
while(!feof($fs)){
$line = trim(fgets($fs));
if($line != '' && substr($line, 0, 1) != '#'){ // 修正变量名
array_push($pics, $line);
}
}
fclose($fs);
// 从数组随机获取链接
$pic = $pics[random_int(0, count($pics) - 1)]; // 真随机
// 返回指定格式
$type = $_GET['type'] ?? '';
switch($type){
// JSON 返回
case 'json':
header('Content-type: application/json'); // 修正 Content-type
die(json_encode(['pic' => $pic]));
default:
die(header("Location: $pic"));
}
?>
此时还是需要添加img_mobile.txt
,同版本2
此时文件结构如下:
.
├── img_mobile.txt
├── img.txt
├── MobileDetect.php
└── random.php
Docker Compose部署
为了部署这个站点,在这里我们直接使用Docker Compose进行操作:
version: '3.8'
services:
web:
image: nginx:latest
ports:
- "9000:80"
volumes:
- /root/random-pic:/usr/share/nginx/html
- ./default.conf:/etc/nginx/conf.d/default.conf
container_name: random-pic
depends_on:
- php-fpm
networks:
- mynetwork
php-fpm:
image: php:7.4-fpm
volumes:
- /root/random-pic:/usr/share/nginx/html
networks:
- mynetwork
networks:
mynetwork:
driver: bridge
这里为了方便测试我们不占用80端口,而是使用9000端口,之后使用Nginx或者其他工具进行反代即可
此时不要急着启动容器,我们还需要定制一下Nginx
的配置文件:
此时新建一个default.conf
server {
listen 80;
server_name localhost;
root /usr/share/nginx/html;
index random.php;
location ~ \.php$ {
include fastcgi_params;
fastcgi_pass php-fpm:9000;
fastcgi_index random.php;
fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
}
}
写入后保存,你的文件结构应该是这样的:
.
├── default.conf
├── docker-compose.yaml
├── img_mobile.txt
├── img.txt
└── random.php
之后正式启动容器
docker compose up -d
之后访问域名+端口即可看到随机图效果
后语
个人感觉给随机图域名套上CDN还是有意义的,因为这个严格来说也算个静态网站,如果有CDN缓存的话随机图的切换速度会变快很多
如果你对类似项目感兴趣的话,不妨访问我的小站小树 | Docker Compose部署随机图API
Docker Compose部署随机图API的更多相关文章
- 在Windows Server 2019通过Docker Compose部署Asp.Net Core
一.安装Docker Enterprise 安装文档是: https://docs.docker.com/install/windows/docker-ee/ 安装完成后,如下图 二.首先,拉取一个W ...
- Docker Compose 部署前后端分离应用
部署前后端分离应用 容器化 Abp 应用 关于 Abp 应用的容器化,其实和普通的 ASP.NET Core 应用差不多,大家可以参考我此前的文章. 唯一需要注意的是:因为 Abp 解决方案中有多个项 ...
- 使用Docker Compose 部署Nexus后初次登录账号密码不正确,并且在nexus-data下没有admin,password
场景 Ubuntu Server 上使用Docker Compose 部署Nexus(图文教程): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/ ...
- Docker Compose 部署 Redis 及原理讲解 | 懒人屋
原文:Docker Compose 部署 Redis 及原理讲解 | 懒人屋 Docker Compose 部署 Redis 及原理讲解 4.4k 字 16 分钟 2019-10-1 ...
- 使用Docker Compose部署基于Sentinel的高可用Redis集群
使用Docker Compose部署基于Sentinel的高可用Redis集群 https://yq.aliyun.com/articles/57953 Docker系列之(五):使用Docker C ...
- Docker Compose部署项目到容器-基于Tomcat和mysql的项目yml配置文件代码
场景 Docker-Compose简介与Ubuntu Server 上安装Compose: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/deta ...
- Ubuntu Server 上使用Docker Compose 部署Nexus(图文教程)
场景 Docker-Compose简介与Ubuntu Server 上安装Compose: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/deta ...
- Docker Compose部署Nexus3时的docker-compose,yml代码
场景 Docker-Compose简介与Ubuntu Server 上安装Compose: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/deta ...
- Docker Compose部署GitLab服务,搭建自己的代码托管平台(图文教程)
场景 Docker-Compose简介与Ubuntu Server 上安装Compose: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/deta ...
- 使用Docker Compose 部署Nexus后提示:Unable to create directory /nexus-data/instance
场景 Ubuntu Server 上使用Docker Compose 部署Nexus(图文教程): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/ ...
随机推荐
- C/C++ GOTO妙用
目录 GOTO 语句 跳出多层循环 循环首次部分跳过 GOTO 语句 C/C++ 的 goto 语句用来在一个函数内进行任意跳转,用起来也是很方便.示例如下: int a() { int x = 0, ...
- 记录一次关于使用leaflet draw 插件叠加图层删除绘制层无法删除的问题
问题描述 业务逻辑是这样的:再地图上已经绘制了一个多边形区域,然后需要再绘制的区域下再绘制下级区域,使用插件可以正常绘制并保存绘制数据,然后再回显编辑的时候,此时地图展示了上级多边形区域(该区域未追加 ...
- 使用word模板的科研论文编写
编写SCD论文等的时候,可能出现官网的论文模板不够全面.一般我们使用latex作为论文编写模板,格式等都方便控制和编写,而word模板操作起来较为复杂.但是官网有些时候可能找不到latex的模板内容, ...
- Assignment to property of function parameter 'XXX' no-param-reassign 记录
在react项目中写了一个工具方法将两个数组数据进行整合,用了双重for循环,但是在提交代码时报了eslint的no-param-reassign 结果效果是有了,但是报lint错误,图片中已是解决后 ...
- 实现领域驱动设计 - 使用ABP框架 - 应用程序服务
应用程序服务 应用程序服务是一种无状态的服务,它实现应用程序的用例.应用程序服务通常获取和返回dto.它由表示层使用.它使用并协调领域对象(实体.存储库等)来实现用例 应用程序服务的常见原则如下: 实 ...
- 构建窗体--java进阶day03
1.窗体对象Jframe 要创建窗体就需要Jframe对象,窗体创建好不会自己显示,还需要我们自己写一段代码让其显示 2.设置窗体可见--setVisible(true) 该方法用于显示窗体 3.窗体 ...
- 感觉程序员要被 AI 淘汰了?学什么才有机会?
感觉程序员要被 AI 淘汰了?学什么才有机会? ️ 推荐观看视频版:https://www.bilibili.com/video/BV1i9Z8YhEja AI 会淘汰程序员么? 我的答案是 &quo ...
- C# LINQ 快速入门实战指南,建议收藏学习!
前言 因为咱们的.NET EF Core快速入门实战教程经常会用到 LINQ 去查询和操作 MySQL 中的数据,因此我觉得很有必要对 LINQ 的一些使用技巧.常用方法.特性做一个详细的介绍,让大家 ...
- 记一次 .NET某固高运动卡测试 卡慢分析
一:背景 1. 讲故事 年前有位朋友找到我,说他们的程序会偶发性卡慢 10s 钟,在某些组合下会正常,某些组合下就会出现问题,解释不了其中的原因,让我帮忙看下怎么回事?截图如下: private vo ...
- Sentinel源码—1.使用演示和简介
大纲 1.Sentinel流量治理框架简介 2.Sentinel源码编译及Demo演示 3.Dashboard功能介绍 4.流控规则使用演示 5.熔断规则使用演示 6.热点规则使用演示 7.授权规则使 ...