Gridea Web 一套Open API的JSON示例
POST: https://web.gridea.dev/api/v1/note
---
Headers: Authorization: Bearer <Token>
---
Body:
{
data: {
markdown: "Hello"
}
让我们给它稍微加工一下
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>文章编辑器</title>
<style>
body {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
margin: 0;
font-family: Arial, sans-serif;
}
.editor {
width: 80%;
height: 60%;
margin-bottom: 20px;
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
resize: none;
font-size: 16px;
}
.submit-button {
background-color: #007BFF;
color: white;
padding: 10px 20px;
border: none;
border-radius: 25px;
font-size: 16px;
cursor: pointer;
}
.submit-button:hover {
background-color: #0056b3;
}
</style>
</head>
<body>
<textarea class="editor" id="editor" placeholder="在此输入您的文章内容..."></textarea>
<button class="submit-button" onclick="submitNote()">提交</button>
<script>
async function submitNote() {
const url = 'https://proxy.cors.sh/https://web.gridea.dev/api/v1/note';
const corsApiKey = 'CORSKEY'; // 替换为你的CORS API Key
const token = 'APIKEY'; // 替换为你的实际令牌
const markdownContent = document.getElementById('editor').value;
const data = {
data: {
markdown: markdownContent
}
};
try {
const response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': Bearer ${token},
'x-cors-api-key': corsApiKey
},
body: JSON.stringify(data)
});
if (!response.ok) {
throw new Error(HTTP error! Status: ${response.status});
}
const result = await response.json();
console.log(result);
alert('提交成功！');
} catch (error) {
console.error('Error:', error);
alert('提交失败，请重试。');
}
}
</script>
</body>
</html>
就成为简易的投稿页面
因为不能直接发送请求至服务器 所以我们需要借用CORS代理服务器
CORS配置很简单 https://cors.sh 只需要输入电子邮箱收验证码就行了
令牌获取在Open API · Gridea Docs 有教程