欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-03-07 22:05:55
半路接手项目,发现代码质量不是特别好,后期增加了对象存储,所以后台返回的图片地址可能包含有相对地址的和绝对地址的,但是前台不是特别好处理,甚至特别麻烦。我只能把:src=的参数用imageUrl函数处理一下,以后如果出现问题的话就整体解决函数的问题就好了。最开始后台给我说只需要把包含ossUrl的内容输出原始内容,不包含的输出增加原始URL的连接就可以。function imageUrl(url){var ossUrl = "https://xxxxx.oss-cn-beijing.aliyunc...

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

function imageUrl(url){
	var ossUrl = "https://xxxxx.oss-cn-beijing.aliyuncs.com";
	if(url.indexOf(ossUrl) == -1){
		return "http://xxxxx.com" + url;
	}else{
		return url;
	}
}

修改完成之后发现一些存在本地的图片没了,我发现之前的前端,在data中也有一些图片连接,我又一次处理了函数,增加了过滤包含..的路径。

function imageUrl(url){
	var ossUrl = "https://xxxxx.oss-cn-beijing.aliyuncs.com";
	if(url.indexOf(ossUrl) == -1&&url.indexOf('..') == -1){
		return "http://xxxxx.com" + url;
	}else{
		return url;
	}
}

后来我又发现,有些头像是直接获取得微信的头像,于是又出现了https://thirdwx.qlogo.cn/***的url,我刚准备吧这个url加到过滤条件里面,突然想到是不是直接加入过滤httpshttp..就可以的时候,突然想到一些其他的想法,万一有一个憨批会放入ftp://***的内容该怎么处理。
最后我直接把://..过滤了,就形成了下面的代码:

function imageUrl(url){
	var ossUrl = "https://xxxxx.oss-cn-beijing.aliyuncs.com";
	if(url.indexOf('..') == -1&&url.indexOf('://') == -1){
		return "http://xxxxx.com" + url;
	}else{
		return url;
	}
}

本文地址:https://blog.csdn.net/qq_41986908/article/details/112560024