oss php sdk+laravel搭建图片处理静态网站

背景和目标

接着上两篇继续写oss php sdk+laravel搭建静态网站。 主要说下静态网站的重要部分图片服务,现在很多的网站上都会用到大量的图片, 图片在网页传输中占据很大的数据量, 图片处理也是影响网站性能的重要因素。
这篇文章主要结合oss的图片处理功能介绍如何利用oss + laravel搭建一个低成本高性能的静态服务器。

静态网站图片服务架构简单回顾

静态网站图片服务器架构可能经历了如下几个阶段:

  1. 网站初期可能我们业务和图片服务都在一台服务器, 图片访问也不多, 要访问的图片个数也有限, 我们可以把所有要用到的图片放到服务器某个images/目录下, 然后根据图片名来匹配就可以满足需求。
  2. 随着网站的发展, 图片服务和其他应用访问量和数据量也越来越大, 一个网站一台服务器早已满足不了需求,我们需要把图片服务拆分成单独的图片处理服务器甚至图片处理集群。
  3. 有了图片处理服务器或着图片处理集群, 我们可以为图片服务配置更高端的硬件,并为图片服务增加独立访问域名增加浏览器加载图片速度。这些都突破了IO瓶颈,大大提升了网站性能。
  4. 收之桑榆失之东隅,当图片服务是一个服务器集群时,我们再也不可能拥有原来那么简单的图片服务架构了。现在我们至少要考虑图片服务的负载均衡、数据同步、扩容、容灾和数据迁移。

总之, 性能和功能巨大提升的同时,系统复杂度也巨大的增加了。对中小型网站来说,受限于开发运维能力和成本,图片服务上云可能是个很不错的选择。

oss图片服务

很多中小网站后端使用php写的,图片处理的框架很可能是nginx+php+fastcgi+imagick, 使用imagick做图片处理,这种框架对少量的图片处理可以work,但大量图片下对服务器的IO、cpu、网络带宽都有很大压力。而使用oss的图片服务可以完全把这些压力剥离出去。
先看一个不使用和使用oss图片服务的静态网站框图的对比,然后我们再以laravel+oss php sdk做后端,写一个最简单的可以work的图片处理服务的demo。

oss图片服务版本的静态网站

  1. 蓝色的路径为不使用oss图片服务的静态网站框架,用户的一个图片请求例如简单的把某张图片旋转90度并加水印后在浏览器展示,这样大量的请求会对静态网站的图片服务器带来IO和CPU的压力,同时会对路径6带宽带来压力。
  2. 而使用oss图片服务后服务器只需要向用户回复一个静态页面,静态页面中填入oss图片服务的url,然后由浏览器加载,即可完成上面的效果。因此,改进后的静态网站完全可以不需要图片服务器或服务集群,图片服务器完全可以由oss胜任,静态网站只需要保留普通业务服务器。

demo

我们通过一个demo来展示上面的说明,为了简单起见我们继续使用上两篇文章中搭建的oss php sdk+laravel+php-fpm+nginx的环境,不同的是向用户展示的图片不落本地服务器,对图片的旋转、模糊处理、打水印也全都不经过本地服务器。
同样,我们这里只说明过程先不考虑代码的异常分支,严谨的代码可以放到下篇文章中。
步骤如下:

  1. vim routes/web.php, 修改为:
  2. 增加resources/views/gitshow.blade.php文件, 内容为:

url : 'http://image-demo.oss-cn-hangzhou.aliyuncs.com/example.jpg?x-oss-process=image/rotate,90/blur,r_10,s_10/watermark,type_d3F5LXplbmhlaQ,size_30,text_SGVsbG8g5Zu-54mH5pyN5YqhIQ'
这实际上是一个oss相关的url。

3.浏览器访问http://www.test_laravel.com:8080/(环境问题可以翻看前面两篇文章)效果如下:

就是这么简洁的几行代码。概括下上面的过程,静态网站的开发人员把所有需要的原图都存储在oss上,本地服务器只处理业务相关的逻辑。当用户需要访问图片时,服务器不需要返回给用户实际的图片内容,而只是把图片在oss上的存储的位置返给用户,浏览器拿到这个资源后,再访问oss加载图片,蓝色路径6完全不需要大的带宽,实际图片内容传输由oss保证。像上面的demo一样,图片业务不需要返回给用户处理后的图片内容,只需要把图片变换的参数加到url后面返回给用户, 例如旋转90度就在url后加[rotate,90], 这个url请求到oss后,oss会做相关的图片处理。这样本地"图片服务器"就彻底变成了对url的"拼写"操作, 所有图片变换oss都帮你自动完成。更丰富复杂的oss图片服务参考https://help.aliyun.com/document_detail/44686.html?spm=5176.doc48884.6.944.vbQcYs
前面提到图片服务器要考虑的负载均衡、数据同步、扩容、容灾和数据迁移,这些对oss来说都不是问题或者直接有完整的云上解决方案。

总结

通过一个最简单的例子来介绍静态网站如果使用oss的图片服务,实际上oss现成的解决方案能满足你想到的大多数场景,例如权限管理、数据安全、web或者移动端直传、cdn加速,上云让你更关注核心业务本身。有兴趣参见https://help.aliyun.com/document_detail/31920.html?spm=5176.doc31920.6.626.mxhEwk

时间: 2024-11-09 00:29:47

oss php sdk+laravel搭建图片处理静态网站的相关文章

oss php sdk+laravel搭建一个简单网站

背景 目前中小型网站最流行的还是采用php搭建自己的web服务器,一个web服务器都会做动静资源分离,静态资源流量小的话,静态文件可以统一放单独目录用域名独立访问,流量稍大的时候,可以直接托管到阿里云OSS上,需要静态资源时从oss拉取,对请求延时苛刻的还可以用CDN做缓存和加速. 目的 介绍如何如何在30分钟内搭建一个简单的web服务器,采用nignx+php-fpm+laravel+oss-php-sdk 框架 ,静态资源托管到阿里云oss上.实现通过浏览器展示一张图片. 简单的服务器框图

Yii2.0使用阿里云OSS的SDK上传图片、下载、删除图片示例

之前从没接触过Yii,借助的各方资源来做的这个整合阿里云OSS的SDK上传图片实例,如果有不正之处请指出! 前面参照了weinirumo 的介绍,大家可以自行去查看. 好了,下面开始进入主题: 准备工作:需要使用composer执行命令,如果没有安装composer的需要提前安装,参考文档:composer安装流程 1.项目目录结构 我使用的是基础版,只有后台目录,请自行对照自己的项目目录结构,会用到以下的几个目录: 2.在项目根目录下运行cmd命令 3.执行composer命令 切换到中国国内

快速使用云存储搭建静态网站

背景 随着时代进入DT时代,更低廉的成本和更加易于扩展的特点都是应该成为我们关注的重点.如果您有一个网站,网站的访问量很大.很稳定,恭喜您,请继续保持使用我们的ECS服务器.如果您的网站才刚成立或者网站的平时流量较小,偶尔会有大流量的情况.那么问题来了,继续租一台ECS服务器,流量不敢设置太小了,最低配置加上4Mb的带宽,是不是觉得成本有点高了? 但是换个思路,换成用OSS作服务器话,就可以很好的应对大流量的那几天的访问,而且平时几乎没用费用产生,并且没有带宽限制,真正的按流量掏钱,成本急剧降低

Linux下使用Aliyun OSS C SDK

OSS C SDK依赖curl.apr.aprutil.mxml四个第三方库.基于OSS C SDK的应用,依赖于C SDK和四个第三方库,共五个库.四个第三方库和SDK的安装,请参考 OSS C SDK安装 . 本文中的示例程序,在附件oss-c-sdk-demo.tar.gz中.示例是个简单的OSS C SDK应用,您可以参考.引用或直接使用. C/C++程序,从源代码到执行,需要经过编译.链接.运行三个步骤.OSS C SDK应用亦是如此,下面分别对这三个步骤详细说明. 编译 编译,将源代

Nginx服务器上搭建图片缓存服务的基本配置解析_nginx

最近准备用nginx搭建了一个图片服务器,看中的就是nginx超强的静态文件处理能力. 由于图片量比较大,和web服务器(也是nginx)分开运行,虽然web服务器调用图片没用问题,但毕竟是远程调用,肯定没有本地文件系统那么快,因此仍然有优化的空间. proxy_store使用前的nginx配置 location ~* ^.+\.(js|ico|gif|jpg|jpeg|png|html|htm)$ { log_not_found off; access_log off; expires 7d;

使用oss c sdk自定义上传和下载callback

       前段时间使用阿里云官网提供的OSS C SDK上传和下载数据,想在上传和下载过程中对数据进行一些简单的自定义预处理,看了一下oss c sdk的具体实现,大致了解如何通过自定义上传和下载的callback达到上述目的,这里做一个简单的分享.        OSS C SDK在上传和下载数据时使用了CURL进行通信,之前简单学习过CURL的一些知识,知道CURL提供了一系列Callback,在上传下载时对数据进行一些处理,大家感兴趣的话可以参考: http://curl.haxx.s

拥抱ES6——OSS JavaScript SDK开发手记

JavaScript作为当下最火的语言(之一),结合OSS能够创建出非常丰富的跨前后端的应用.现在,OSS正式推出JavaScript SDK,使用OSS的 前后端 同学 都 可以方便地使用. ES6 首先,什么是ES6? 其实ES6是最新版本的ECMAScript,也就是JavaScript标准. ECMAScript 6, also known as ECMAScript 2015, is the latest version of the ECMAScript standard. > ES

Windows下编译使用Aliyun OSS C SDK

Visual Studio(VS)是win平台下,编译运行C/C++程序的首选.微软发布的VS主要版本如下表: 名称 内部版本 发布日期 支持.NET Framework版本 Visual Studio 6.0 6.0 1998-06 - Visual Studio .NET 2002 7.0 2002-02-13 1.0 Visual Studio .NET 2003 7.1 2003-04-24 1.1 Visual Studio 2005 8.0 2005-11-07 2.0 Visual

如何使用laravel搭建后台登录系统

今天想用laravel搭建一个后台系统,就需要最简单的那种,有用户登录系统,试用了下,觉得laravel的用户登录这块做的还真happy.当然,前提就是,你要的用户管理系统是最简单的那种,就是没有用户权限,能登录就好.   我这里就不用默认的user表做例子了,那样很容易和laravel的一些默认设置混淆.   首先确认,后台的用户表,我设计表叫做badmin,每个管理员有用户名(username),有昵称(nickname),有邮箱(email),有密码(password) 这里玩个花,使用l