文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

Unicloud 阿里云服务器作图床,从上传到部署api全流程

2023-09-12 18:07

关注

uniCloud提供免费10G云存储空间,不限流量,底层是阿里云OSS,因此速度非常快

这个源码是利用uniCloud云存储开发的一款图床源码。和网上其他的uniCloud图床源码不一样的是,所有与uniCloud接口交互的部分都由后端php实现,前端只与阿里云OSS交互,不再需要引用uniCloud的vue框架js。

使用说明:

第一步,首先注册一个账号,有账号的可以跳过这一步;

第二步,登录后台,创建一个应用,然后手动将服务空间里的 spaceId 和 clientSecret 配置到本源码的 config.php;

第三步,后面访问首页即可测试。

源码里面已配置好,建议使用自己的spaceId和clientSecret

注意:上传非图片文件需要在后台—云存储上传。

注:所有想法均为原创,因本人大一技术有限,方法可能比较笨拙,欢迎大佬指出优化。

unicloud上传图片界面:

 

点击文件详情弹出带有图片url的弹窗

 

复制url保存到img.txt文件中,然后通过一个php文件获取随机数组然后json返回。

$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("");                        $("#markdown").val("![](https://blog.csdn.net/qq_61887118/article/details/" + imgurl + ")");                        $("#bbcode").val("[img]https://blog.csdn.net/qq_61887118/article/details/" + 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文件合并:

将下载的txt文件放到一个新建的文件夹中;

编写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. 1. @echo off & cd /d "%~dp0"2. echo.添加换行符3. for %%i in (*.txt) do (4. •    echo %%i5. •    echo.>>"%%i"6. )7. echo -----------------------8. echo.合并文件9. copy /b *.txt data10. echo -----------------------11. move /y "data" "data.txt"12. pause&exit

第一个换行是紧接上一个文本内容,这个会多换一行,而且同一个文件里面多次测试会叠加换行符。

后续想法:

完善前端把imgurl post到后端

编写一个后端,获取前端imgurl直接存入数据库,将url.txt全部存入数据库

编写一个接口从后端返回数据。

这个图床操作流程就先凑合着用吧!

来源地址:https://blog.csdn.net/qq_61887118/article/details/126929553

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-服务器
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯