利于github制作在线图床

聪明小米

众所周知，github的api灰常开放，如今已经有picog+github图床，但是，picog是桌面程序，怎样能用用一个网页程序来实现呢？其实很简单，我们就单纯用一个ajax请求就可以了
以下是一段简单的上传函数

• function uploadimg(file, form) {
  // alert(4)
  let timestamp = new Date().getTime(); //获取时间戳
  let newname = "https://raw.githubusercontent.com/你的用户名/仓库名/目录(留空代表根目录)/" + timestamp + "." + form; //以事件戳重命名
  console.log(newname);
  $.ajax({
  url: "https://api.github.com/repos/你的用户名/仓库名/目录(留空代表根目录)/" + timestamp + "." + form,
  method: "PUT",
  headers: {
  "Authorization": "密钥,在github的个人 左侧的申请",
  "Content-Type": "text/plain"
  },
  data: "{\r\n "message": "upload",\r\n "content": "" + file + ""\r\n}",
  success: function () {
  console.log(111);
  $("#neirong").html("github:" + newname) //写到html里面
  }
  })
  }
  

复制代码
当然，图片上传时我们还要对图片进行重命名，避免重复图片，同时还要对图片转为base64编码
利用以下一段简单的函数实现

• function imgChange(img) {
  const reader = new FileReader();
  reader.onload = function (ev) {
  var imgFile = ev.target.result; //imgFile就是图片的base64编码
  console.log(imgFile);
  base64url = imgFile.replace(/(.*)?,/, ''); //用正则消除前面的data之类的字符
  form = imgFile.substring(imgFile.indexOf("/") + 1, imgFile.indexOf(";")); //获取图片原本的格式
  console.log(imgFile);
  uploadimg(base64url, form); //上传
  }
  reader.readAsDataURL(img.files[0]);
  }
  

复制代码
基本原理就是这样，还有个弊端就是纯html静态页面的形式会暴漏我们的密钥，所以我们可以把上传的部分单独做成一个php接口文件或者nodejs接口，这里就不提了
最终附上完整的源码

下载地址

index.zip

网盘失效？举报有奖

立即下载

免费

您已购买

星币

设置星币兑换防止恶意倒卖

无任何充值系统，星币每日签到登录即可获得！

自用完全够用，免费下载全站所有资源！

补充内容 (2023-7-20 13:23):
另外 秘钥在github登入自己账号后，右上角头像- Settings-左侧底部的Developer Settings-左侧的Personal access tokens-选择tokens-然后生成一个
补充内容 (2023-7-21 09:06):
还有就是可以整个cloudflare的代[过滤]理，虽然慢点，但是肯定能访问
补充内容 (2023-7-21 09:09):
【小小广告】饭团云免/费主机:www.ballyun.cn

超级小爱

这画风一下就想起以前了