项目后期增加 oss功能 图片地址怎么处理

最新推荐文章于 2024-01-23 20:42:52 发布
最新推荐文章于 2024-01-23 20:42:52 发布
阅读量644 收藏
点赞数
分类专栏： 开发记录 文章标签： vue uniapp
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41986908/article/details/112560024
版权
半路接手的项目在后期增加了对象存储功能，导致后台返回的图片地址混合了相对和绝对地址，给前端处理带来困扰。为了解决这个问题，通过编写函数统一处理图片链接，先处理了包含和不包含URL的情况，接着处理了存在于data中的图片链接，再到微信头像的URL。考虑到可能存在的不规范输入，最终决定过滤掉和，确保图片路径的正确性。
摘要由CSDN通过智能技术生成

半路接手项目，发现代码质量不是特别好，后期增加了对象存储，所以后台返回的图片地址可能包含有相对地址的和绝对地址的，但是前台不是特别好处理，甚至特别麻烦。
我只能把：src=的参数用imageUrl函数处理一下，以后如果出现问题的话就整体解决函数的问题就好了。
最开始后台给我说只需要把包含ossUrl的内容输出原始内容，不包含的输出增加原始URL的连接就可以。

function imageUrl(url){
   
	var ossUrl = "https://xxxxx.oss-cn-beijing.aliyuncs.com";
	if(url.indexOf(ossUrl
最低0.47元/天 解锁文章
亦木丶
关注
专栏目录
上传到阿里云OSS的图片处理
01-23
上传到阿里云OSS的图片处理，可查看官网文档：https://help.aliyun.com/document_detail/44688.html?spm=a2c4g.11186623.6.1179.4d1f53b3WU0oXy
Java 上传图片至OSS并返回图片地址工具类可直接用
weixin_45396665的博客
04-27 1464
OSS上传图片并返回图片地址 OSS上传图片并且返回地址工具类 可以直接拿去用 后续会继续更新 需要注意的点: 下面代码里的@Value里的几个值我是放在application.yml文件里的,可以在OSS官网上找到,放入自己的OSS数据值,可以百度OSS管理控制台 aliyun: endpoint: accessKeyId: accessKeySecret: bucketName: accessUrl: package com.test.utils; import com.aliy
从oss拿到图片的url
weixin_43965878的博客
02-09 2580
目的方便前端展示页面图片 我上一个博客写的是上传文件到oss 从oss那里拿到url很简单， 你只要把这些话加到上传文件的util里面，让他返回的是路径，让他上传的同时，返回一个url路径，保存在数据库中， 剩下的就不用说了吧… //返回图片所在的全部路径，方便前端访问 //设置过期时间为100年 Date expirati...
阿里云使用js 实现OSS图片上传、获取OSS图片列表、获取图片外网访问地址(读写权限私有、读写权限公共);
张海涛
12-27 1万+
1.引入js文件 <scriptsrc="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script> 2.填写配置信息 1 2 3 4 5 6 7 varclient =newOSS.Wrapper({ ...
用 Serverless 优雅地实现图片艺术化应用
腾讯云 Serverless
09-25 492
本文将会分享，如何从零开始搭建一个基于腾讯云 Serverless 的图片艺术化应用！作者 @蒋启钲 线上 demo 预览：https://art.x96.xyz/ ，项目已开源，完整代码见文末。 在完整阅读文章后，读者应该能够实现并部署一个相同的应用，这也是本篇文章的目标。 项目看点概览： 前端 react（Next.js）、后端 node（koa2） 全面使用 ts 进行开发，极致开发体验（后端运行时 ts 的方案，虽然性能差点，不过胜在无需编译，适合写 demo） 突破云函数代码 500mb
oss客户端工具_OSS从入门到精通 - 产品综述
weixin_39703982的博客
12-06 1051
1 OSS是什么说到OSS产品，大家都要知道OSS是什么？OSS是阿里云对象存储服务（Object Storage Service）的一个简称，它是阿里云提供的海量、安全、低成本、高可靠的云存储服务。OSS可以被理解成一个即开即用、无限大空间的存储集群。相较传统建服务器存储而言，OSS在可靠性、安全性、成本和数据处理能力方面都有着突出的优势。使用OSS，您可以通过网络随时存储和调用包括文本、图片和...
阿里云实验录屏：使用OSS对图片进行基本处理
08-23
阿里云实验录屏：使用OSS对图片进行基本处理
阿里云OSS上传视频上传图片sdk及样例代码
03-17
对于图片和视频，可以设置不同的元数据，如Content-Type，以便OSS能正确识别和处理这些媒体文件。 4. **设置访问权限：** 可以通过SDK设置对象的访问权限，如公共读、私有读写等，这将决定其他人是否可以访问你的...
Android Oss上传图片的使用示例
08-27
在Android开发中，有时我们需要将用户的图片数据上传到云端存储服务，例如阿里云的OSS（Object Storage Service）。本文将详细介绍如何在Android应用程序中实现图片上传到阿里云OSS的步骤，包括配置、权限设置、代码...
查询数据库的图片地址（oss地址）打包成压缩包发给用户，或者查询多个用户，每个用户图片放到文件夹，打包文件夹成压缩包发给用户（设计图片的合成，文件io,真实项目详解）
weixin_42759398的博客
07-07 145
【代码】查询数据库的图片地址（oss地址）打包成压缩包发给用户，或者查询多个用户，每个用户图片放到文件夹，打包文件夹成压缩包发给用户（设计图片的合成，文件io,真实项目详解）
Spring Boot + 阿里OSS实现图片上传，返回预览的地址，实现图片预览
w15635748705的博客
07-31 6800
首先进入阿里云的官网https紧接着点击首页上的立即开通点击这个创建一个bucket其余的默认就可以，可以根据自己的实际需求去写。
OSS存储引擎如何使用以及如何添加图片【建议收藏】
最新发布
小魏快起床的博客
01-23 1748
Aliyun OSS对象存储，可以用来做文件服务器，存放一些文件，图片等资源，那么我们使用OSS，需要经历以下步骤：这里就从如何开通OSS服务开始进行，到如何上传一个资源文件到OSS结束。
Python（一）截图上传OSS并返回图片地址
Husky
12-05 1400
截图上传OSS并返回图片地址一、代码实现二、代码讲解 一、代码实现 # !/usr/bin/python # -*- coding: utf-8 -*- import sys import time import oss2 from selenium import webdriver from selenium.webdriver.chrome.options import Options from pydantic import BaseModel from fastapi import FastAPI
OSS接口获取的图片压缩大小 简单好用直接在src获取的地址后面拼接
weixin_48920798的博客
12-29 8120
之前做小程序的时候，后台老哥给了一些在线图片让我放进去，考虑到图片有可能太大，加载的时候图片过大加载时间过长影响用户体验，然后后台老哥就给我分享了一个阿里的在线图片压缩的方法，直接在取到的src地址后面拼接。 ?x-oss-process=image/resize,m_fill,h_200,w_300 例如 <image :src=item.imagePath+compress" mode=""></image> data() { return { compress:'
解决阿里云OSS，打开图片地址无法预览，直接下载
热门推荐
MoLi的博客
12-03 4万+
问题描述： 阿里云对象存储上传的图片打开是下载，并不是我想要的效果，我希望的是可以直接预览：可以直接在网址上面查看的那种。首先你得检查一下你的图片contentType，一般是通过代码设置的 objectMetadata.setContentType(getcontentType(fileName.substring(fileName.lastIndexOf(".")))); p...
阿里云对象存储OSS实现文件的上传
qq_41950447的博客
04-21 2180
一.阿里云OSS简介 阿里云对象存储服务，简称 OSS，是一种面向海量数据规模的分布式存储服务，具有稳定、可靠、安全、低成本的特点，能够提供十一个九的数据可靠性。OSS提供与平台无关的RESTful API接口，您可以在互联网任何位置存储和访问。OSS的容量和处理能力弹性扩展，并提供多种存储类型供您选择，全面优化存储成本。 二.注册 打开阿里云网站https://www.aliyun.com/，点击产品，再上云必备中找到对象存储， 点击 立即开通 三.文件上传 ...
【Mysql】把图片存在阿里云oss上，然后mysql数据库上只存上存图片的绝对路径url的好处
AloneYueCSDN
11-29 1689
文章目录1.mysql直接存图片优缺点(1)优点：(2)缺点：2.二者实现方式 1.mysql直接存图片优缺点 (1)优点： 1.比较容易做取重,就是相同的图片只存一份. 2.最重要备份使用数据库的备份方式简单. 3.容易管理,去掉无用的图片等 (2)缺点： 1.不适合超大量存储,数据的存储越大,恢复越麻烦 2.当然一般还是需要前端做更多的物理缓存,而不是靠mysql来直接输出. 2.二者实现方式 1.图片直接存进数据库字段选择longblob类型，这样存进去的是二进制码 2.存路径和图片名
Vue项目实现图片上传到OSS及删除功能
"Vue.js项目中，通过阿里云OSS服务进行图片上传并实现图片删除功能的示例" 在Vue.js应用中，有时我们需要将用户上传的图片存储到云端，以便于管理和展示。阿里云的对象存储服务（OSS）提供了一个高效、安全的存储...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值