自己用的github当图床工具。方便自己写有需要的时候快速上传。
并且用cdn加载,无需翻墙即可访问。
上传后会自动放到裁剪版。
index.html
<!DOCTYPE html>
<html>
<body>
<h2>Upload Image to GitHub</h2>
<input type="file" id="fileInput">
<button onclick="uploadImage()">Upload</button>
<!-- 添加用于显示URLs的元素 -->
<div id="originalUrl" style="margin-top: 20px;"></div>
<div id="cdnUrl" style="margin-top: 10px;"></div>
<script src="script.js"></script>
</body>
</html>
script.js
function uploadImage() {
const fileInput = document.getElementById('fileInput');
if (!fileInput.files.length) {
alert('Please select a file.');
return;
}
const file = fileInput.files[0];
const reader = new FileReader();
reader.onloadend = function() {
const content = reader.result.split(',')[1];
uploadToGitHub(content);
};
reader.readAsDataURL(file);
}
function uploadToGitHub(content) {
const token = 'xxxxxxxxxxxxxxxxxxx'; // 请替换xxxxxxx为你的GitHub Token
const username = 'xxxxxxxxx'; // 替换xxxxxxxx为你的GitHub用户名
const repo = 'xxxxxxxxxxx'; // 替换xxxxx为你的GitHub仓库名
const branch = 'main'; // 仓库分支
const filename = `image_${new Date().getTime()}.jpg`; // 文件名基于当前时间戳
const path = filename; // 上传的路径
const url = `https://api.github.com/repos/${username}/${repo}/contents/${path}`;
const data = {
message: `Uploading ${filename}`,
content: content,
branch: branch
};
fetch(url, {
method: 'PUT',
headers: {
'Authorization': `token ${token}`,
'Content-Type': 'application/json'
},
body: JSON.stringify(data)
})
.then(response => response.json())
.then(data => {
if (data.content && data.content.download_url) {
const cdnUrl = `https://cdn.jsdelivr.net/gh/${username}/${repo}@${branch}/${filename}`;
const originalUrl = data.content.download_url;
// 更新页面元素以显示URLs
document.getElementById('originalUrl').innerHTML = `Original URL: <a href="${originalUrl}" target="_blank">${originalUrl}</a>`;
document.getElementById('cdnUrl').innerHTML = `CDN URL: <a href="${cdnUrl}" target="_blank">${cdnUrl}</a>`;
// 自动复制CDN URL到剪贴板
navigator.clipboard.writeText(cdnUrl).then(() => {
alert(`CDN URL copied to clipboard: ${cdnUrl}`);
}).catch(err => {
console.error('Could not copy text: ', err);
alert('Failed to copy CDN URL to clipboard.');
});
} else {
alert('Failed to get the image URL.');
}
})
.catch(error => {
console.error('Failed to upload image:', error);
alert('Failed to upload image.');
});
}
GitHub Token可以去 https://gpt.iil.im 问gpt4 怎么获取
将index.html文件和script.js文件放在一起到/www/xxx目录
用caddy运行即可
可以问gpt怎么caddy运行他。
/etc/caddy目录下
域名.com {
root * /www/xxxx
file_server
}