首页 > 其他分享 >基于腾讯云EdgeOne的自适应webp转换

基于腾讯云EdgeOne的自适应webp转换

时间:2024-08-09 20:49:06浏览次数:8  
标签:函数 EdgeOne 边缘 webp 腾讯 png

基于腾讯云EdgeOne的自适应webp转换

EdgeOne是腾讯云提出的边缘计算相关产品,和CloudFlare的小黄云类似,实际上大致等于CDN+安全防护,同时它还提供了边缘函数来提供我们使用,我们可以借助边缘函数实现一些功能,比如说自动将请求的pngjpg图片转换成webp,从而节省流量,加快网站的访问速度,目前暂时是免费的,直接开始白嫖

但是这个方法目前只适用于你使用自建图床或者专门给图床套了这个EO的情况,如果直接给主站使用的话可能会出现无法访问的情况?本人没有试过,还望大家反馈

具体步骤

首先我们进入腾讯云EO的控制台:

之后进入站点列表,选择你想要部署边缘函数的站点,进入到站点设置中:

进入到左侧边栏:边缘函数,选择函数管理,在这里我们新建一个函数:

在这里腾讯云提供了一些常用的预设,我们直接使用就好,这里我们为了自适应转webp,所以使用图片处理,选择完成之后点击下一步:

这里随便取一个名字,你自己以后维护的时候知道是什么函数就行,之后下滑点击创建并部署

成功创建函数之后会提示你添加触发规则,这个的意思是边缘函数不是自动执行的,需要有一定的触发条件,比如说绑定到某个域名上,或者碰到什么样的文件类型才会触发,我们现在先新增触发规则

在这里我绑定了腾讯云COS的回源CDN域名,这里我的匹配类型选择HOST,也就是域名或者主机名,后面的值就是我对应图床的域名,确定完成之后点击确定,之后边缘函数会自动部署

这个过程中你的EO可能会中断大概五分钟左右,之后如果控制台都显示已部署完成即部署成功

检验

那么我们应该如何检验呢,下面以其中一张照片为例

我首先通过诸如PicGo等软件将图片上传到腾讯云COS中去,之后得到CDN地址为:https://img.juniortree.com/202408091010252.png

此时你会发现其文件还是.png后缀,就觉得失败了,但其实不是这样的

如果按照官方的教程,通过curl指令去查询文件元素,结果发现Content-Type还是png,觉得肯定是失败的

我之前也被这个问题困扰了很久,也发过工单问过客服,但最终我还是搞明白了

首先我们需要将这个图片在浏览器中打开:

按住F12打开开发者模式,选择网络

此时再按F5+Ctrl强制刷新缓存,之后再观察右边的文件类型是不是webp,如果是则说明函数使用成功

标签:函数,EdgeOne,边缘,webp,腾讯,png
From: https://www.cnblogs.com/juniortree/p/18351487

相关文章

  • SQL进阶技巧:有序数据合并问题之如何按照时间顺序对数据进行合并?【腾讯互娱-分析某用户
    目录0需求描述​编辑 1数据准备 2数据分析 3小结0需求描述题目:有一个流水表,用户1在什么时间玩了什么游戏。dtstatdateqqdteventtimegame2022-01-1012022-01-1000:04......
  • uni-app接人腾讯地图
    Uni-app是一个使用Vue.js开发的多端开发框架,可以同时发布到iOS、Android、H5、小程序等多个平台。要接入腾讯地图,你可以使用腾讯位置服务API,并结合uni-app的特性进行开发。 以下是一个简单的示例: 1.首先,在你的项目中安装腾讯位置服务插件:```bashunipluginadd@......
  • Webpack入门基础知识及案例
    webpack相信大家都已经不陌生了,应用程序的静态模块打包工具。前面我们总结了vue,react入门基础知识,也分别做了vue3的实战小案例,react的实战案例,那么我们如何使用webpack对项目进行模块化打包呢?话不多说,开始!!目录一、熟悉webpack的主要功能二、Webpack的核心概念三、使用webp......
  • 腾讯云AI代码助手评测:如何智能高效完成Go语言Web项目开发
    腾讯云AI代码助手评测:如何智能高效完成Go语言Web项目开发......
  • 【运维自动化-配置平台】如何使用云资源同步功能(腾讯云为例)
    云资源同步是通过apikey去单向同步云上的主机资源和云区域信息,目前支持腾讯云和亚马逊云。主要特性1、蓝鲸配置平台周期性的单向只读同步云主机和vpc(对应蓝鲸云区域)信息,第一次全量,后面增量2、默认同步到主机池,也可自定义主机池模块,需要手动分配到业务3、主机随云控制台销毁而......
  • Qt/C++最新地图组件发布/历时半年重构/同时支持各种地图内核/包括百度高德腾讯天地图
    一、前言说明最近花了半年时间,专门重构了整个地图组件,之前写的比较粗糙,有点为了完成功能而做的,没有考虑太多拓展性和易用性。这套地图自检这几年大量的实际项目和用户使用下来,反馈了不少很好的建议和意见,经过这几年的整理,刚好趁着近期经济下行严重,抽出时间把整个地图组件重构一下......
  • 腾讯文档 PK 石墨文档,你觉得谁能赢?
    在探讨腾讯文档与石墨文档的竞争时,我们需要从多个维度进行深入分析,包括功能特性、用户体验、安全性、兼容性、团队协作、价格策略以及市场定位等方面。以下是对这两个产品的详细比较,旨在全面评估它们的优势和劣势,并尝试给出一个相对客观的判断。一、功能特性腾讯文档腾讯......
  • vite和webpack的区别
    内核区别最明显区别是及时编译和打包编译,开发编译速度上的区别。配置区别主要区别就是webpack有loader和plugins配置,vite直接是plugins为主体。viteplugins中配置编译器和插件:其他json配置大同小异。参考文章https://zxuqian.cn/difference-between-vite-and-webpac......
  • 群辉NAS利用AList搭建混合云盘⑥挂接腾讯微云
    目录……接前文5、挂接腾讯微云未完待续…………接前文5、挂接腾讯微云登录AList后台→管理→存储→驱动供选择“腾讯微云”→填写挂接路径打开“配置文档”(详见前文)打开配置文档→简体中文→开始→找到腾讯微云部分,可以看到关于Cookie的设置方法。手工用浏览器登......
  • [UnrealCircle]腾讯 罗谦 | UnLua-UE4下的Lua脚本插件
    传送门:[UnrealCircle]腾讯罗谦|UnLua-UE4下的Lua脚本插件_哔哩哔哩_bilibili参考PPT:UnrealCircle921北京PPT_免费高速下载|百度网盘-分享无限制一.UnLua基础1.1概念UnLua是一个脚本插件UnLua不是蓝图的替代,而是一种补充没有Asset预览不支持nativization......