Unicloud 阿里云服务器作图床,从上传到部署api全流程
Unicloud 阿里云服务器作图床
uniCloud提供免费10G云存储空间,不限流量,底层是阿里云OSS,因此速度非常快
这个源码是利用uniCloud云存储开发的一款图床源码。和网上其他的uniCloud图床源码不一样的是,所有与uniCloud接口交互的部分都由后端php实现,前端只与阿里云OSS交互,不再需要引用uniCloud的vue框架js。
使用说明:
第一步,首先注册一个账号,有账号的可以跳过这一步;
第二步,登录后台,创建一个应用,然后手动将服务空间里的 spaceId 和 clientSecret 配置到本源码的 config.php;
第三步,后面访问首页即可测试。
源码里面已配置好,建议使用自己的spaceId和clientSecret
注意:上传非图片文件需要在后台—云存储上传。
下面是自己制作api接口的过程:
注:所有想法均为原创,因本人大一技术有限,方法可能比较笨拙,欢迎大佬指出优化。
unicloud上传图片界面:
点击文件详情弹出带有图片url的弹窗
复制url保存到img.txt文件中,然后通过一个php文件获取随机数组然后json返回。
<?php
//存有美图链接的文件名img.txt
$filename = "img.txt";
if(!file_exists($filename)){die('文件不存在');
}
//从文本获取链接
$pics = [];
$fs = fopen($filename, "r");
while(!feof($fs)){$line=trim(fgets($fs));if($line!=''){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"));
}
?>
但是有大量图片处理时,一个一个复制粘贴属实麻烦。
我第一个想到的是爬虫。
尝试了几次就放弃了(爬虫怕的好,lao饭吃到饱)
第二次尝试使用抓包工具BrupSuite
不出意外又失败了。。。。开启BrupSuite代理后unicloud登录界面直接进不去,登陆不上也无法返回数据
code=400.。。
第三次就是看上传界面的源码找到灵感。
图片上传之后会出现四个复制框分别是url,html,markdown,bbcode四种格式。查看index.php
function(res){layer.closeAll();$.ajax({type : "POST",url : "api.php?act=complete_upload",data : {id: predata.id},dataType : 'json',success : function(data) {layer.closeAll();if(data.code == 0){var imgurl = 'https://' + predata.cdnDomain + '/' + predata.ossPath;$("#img-thumb a").attr('href',imgurl);$("#img-thumb img").attr('src',imgurl);$("#url").val(imgurl);$("#html").val("<img src='" + imgurl + "'/>");$("#markdown").val("![](" + imgurl + ")");$("#bbcode").val("[img]" + imgurl + "[/img]");$("#imgshow").show();$("input[name=file]").val(''
找到返回的imgurl参数,决定将imgurl值直接以txt文件自动下载从而避免自己复制粘贴,后面再写一个bat将txt文件合并。
urlimg导出为txt文件:
var data = imgurl;var name = 'cdk.txt';//文件名this.exportRaw(data, name);
exportRaw (data, name) {var urlObject = window.URL || window.webkitURL || window;var export_blob = new Blob([data]);var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a")save_link.href = urlObject.createObjectURL(export_blob);save_link.download = name;save_link.click();},
实现效果:
bat实现多个txt文件合并:
1.将下载的txt文件放到一个新建的文件夹中;
2.编写bat文件
新建txt文件,写入下面代码,并改为bat文件
for %%a in (*.txt) do (
more %%a >>all
)
ren all all.txt //返回到all。txt文件
批处理文件bat实现多个txt文件合并和换行合并。(因为每个txt文件均为一行url,所以进行换行处理)
注意:
type *.txt >> xxx.txt
此bat不能实现自动换行。
此后只需点击bat文件即可实现合并。
此bat文件小文件能用但是处理大文件就卡住。
1. @echo off & cd /d "%~dp0" 2. echo.添加换行符 3. for %%i in (*.txt) do ( 4. • echo %%i 5. • echo.>>"%%i" 6. ) 7. echo ----------------------- 8. echo.合并文件 9. copy /b *.txt data 10. echo ----------------------- 11. move /y "data" "data.txt" 12. pause&exit
第一个换行是紧接上一个文本内容,这个会多换一行,而且同一个文件里面多次测试会叠加换行符。
后续想法:
完善前端把imgurl post到后端
编写一个后端,获取前端imgurl直接存入数据库,将url.txt全部存入数据库
编写一个接口从后端返回数据。
这个图床操作流程就先凑合着用吧!
Unicloud 阿里云服务器作图床,从上传到部署api全流程相关推荐
- python程序发布到阿里云云服务器_Python实现阿里云服务器里的文件上传与下载
Python实现阿里云服务器里的文件上传与下载 018.4.15 背景: 老实说,因为现实的各种原因造成电脑换来换去是可能出现的事情,但是电脑能换,电脑里的环境却不能换.我就曾在三个电脑里各自安装了虚 ...
- 【Android 电量优化】电量优化 ( 获取电量分析报告 | 阿里云服务器搭建 Battery Historian | 上传并生成分析报告 )
文章目录 一.Battery Historian 搭建环境 二.获取 Android 手机电量报告 1.重置电量状态 2.开启获取 WeakLock 信息 3.获取手机电量报告 三.阿里云服务器搭建 ...
- 阿里云服务器建站怎么上传文件?
阿里云建站后使用Filezilla进行上传下载文件 1.远程连接阿里云,并阿里云中下载安装好Filezilla工具: 2.Filezilla工具安装好后,进入Filezilla操作界面: 3.在Fil ...
- 使用阿里云OSS完成文件的上传样例
使用阿里云OSS完成文件的上传 基础条件: 提前注册过阿里云账户 账户里有余额(文件上传按流量收费) 开通过OSS的基础服务 如果有以上基础条件不满足的小伙伴,去度娘了解一下. 前言 有过基础的小伙伴 ...
- 阿里云服务器ECS centos7.4搭建nginx环境部署静态代码
阿里云服务器ECS centos7.4搭建nginx环境部署静态代码 欢迎来到新手如何通过阿里云服务器部署静态网站 作为一个前端开发,第一次部署自己的私人网站,没有经验,战战兢兢,但是没有办法,成为全 ...
- 阿里云存储OSS中设置上传文件content type
阿里云存储OSS中设置上传文件ContentType 如果你使用浏览器上传文件,则浏览器会自动在header中设置正确地content type,然后对文件的访问会得到正确地回应. 如果采用编程的方式 ...
- 阿里云对象存储OSS图片上传并回显
阿里云对象存储OSS图片上传并回显 Java代码实现 引入依赖 <!-- 引入阿里云OSS依赖--><dependency><groupId>com.aliyun. ...
- 怎么把数据文件上传云服务器,怎样把数据上传到云服务器
怎样把数据上传到云服务器 内容精选 换一换 安装传输工具在本地主机和Windows云服务器上分别安装数据传输工具,将文件上传到云服务器.例如QQ.exe.在本地主机和Windows云服务器上分别安装数 ...
- 微信头像下载并上传到阿里云OSS,PHP文件上传到阿里云OSS简单代码(OSS文件上传,微信头像下载,CURL下载文件,微信头像链接过期)
(就这么个小事,有多少公司多少项目没做到!!) 微信公众号项目,后端获取到授权用户的微信头像后,要自行下载保存,不下载的话,微信返回的头像链接会在一段时间后过期,无法访问! 下面是我写的两个简单实用方 ...
最新文章
- 各种过安全狗一句话***
- jquery ajax 滚动加载数据
- jQuery 库 - 特性
- 命令行解析的规则以及Command Line Parser Library
- Linux下的虚拟机拷贝与快照生成
- 综述 | 基于特征的视觉同步定位和建图
- 第八章 (一)分治 练习题
- Vue 学习随笔四 - 路由介绍
- 最bt的搜索引擎插件!
- PMP培训机构怎么选?
- 计算机继电保护书籍,计算机继电保护的发展
- 以管理员身份进入linux,ubuntu 以管理员身份运行程序
- Stream之Collectors(toList()
- “学习方法”学习笔记(一)费曼技巧
- request爬虫爬取电影并利用pyqt5进行本地播放(失败品)
- UVALive - 3713 - Astronauts(图论——2-SAT)
- Python的前奏:excel常用功能简介,数据透视表,切片器
- java.lang.IllegalStateException: response alrea...
- java.lang.IllegalArgumentException的问题解决
- 计算机网络与通信实验报告——HTTP协议分析
热门文章
- 计算机选修论文,学生网上选课系统的设计与实现(计算机系毕业论文).pdf
- 关于typescript 报错问题
- Cliche remarks for opening a new blog | 开新博的一番陈词滥调
- 查看并修改MySQL允许最大传输数据
- Vue 3 迁移策略笔记—— 第22节:Slots 的统一
- 是天坑还是新技术?机械硬盘中的SMR叠瓦盘技术究竟如何?
- PlayStation的CD格式
- 无法读取excel: Excel file format cannot be determined, you must specify an engine manually.建模题目的数据
- 特征抽取篇之LLE(Locally Linear Embedding)
- [spawn_model-5] process has died