完善登录逻辑；增加BBCode格式代码；完善链接展示形式

README.md

@@ -10,9 +10,9 @@
 
 ![](https://alist.sanyue.site/d/imgbed/202407221043832.png)
 
-![](https://alist.sanyue.site/d/imgbed/202407221044182.png)
+![](https://alist.sanyue.site/d/imgbed/202408211614665.png)
 
-![](https://alist.sanyue.site/d/imgbed/202407221052575.png)
+![](https://alist.sanyue.site/d/imgbed/202408211614780.png)
 
 ## 2.Features
 
@@ -28,13 +28,14 @@
   - 上传显示实时上传进度
   - **上传后图片无需手动点击，可直接展示在管理页面中**
 - **多样化复制**
-  - 支持整体复制和单独复制（整体复制即将所有链接通过换行串联起来后复制）
-  - 支持MarkDown、HTML和原始链接三种格式复制
+  - 支持**整体复制**和**单独复制**（整体复制即将所有链接通过换行串联起来后复制）
+  - 支持**MarkDown、HTML、BBCode和原始链接**四种格式复制
+  - 上传完成后直观展示四种格式链接
 - **支持身份认证、防滥用**
-  - 支持Web和API上传认证（感谢[hl128k](https://github.com/hl128k)）
+  - 支持Web和API**上传认证**（感谢[hl128k](https://github.com/hl128k)）
   - 支持访问域名限制（感谢[hl128k](https://github.com/hl128k)）
 - **一些小功能**
-  - 支持随机图API，从图床中随机返回一张图片
+  - 支持**随机图**API，从图床中随机返回一张图片
 
 
 ## 3.Deployment
@@ -202,7 +203,8 @@ API格式：
 3. ~~上传页面增加管理端入口（2024.7.21已完成）~~
 4. 增加用户个性化配置接口
 5. ~~增加随机图API（2024.7.25已完成）~~
-6. 完善多格式链接展示形式，增加ubb格式链接支持
+6. ~~完善多格式链接展示形式，增加ubb格式链接支持（2024.8.21已完成）~~
+7. ~~完善登录逻辑，后端增加认证码校验接口（2024.8.21已完成）~~
 
 ### 4.2Fix Bugs👻
 

css/709.794738b3.css

@@ -0,0 +1 @@
+@keyframes breathe-775107e6{50%{box-shadow:0 0 10px 5px #409eff;opacity:.8}}.upload-form[data-v-775107e6],.upload-list-card[data-v-775107e6]{display:flex;flex-direction:column;justify-content:center;align-items:center}.upload-list-card[data-v-775107e6]{width:55vw;height:7vh;margin-top:10px;border-radius:15px;opacity:.8;background-color:hsla(0,0%,100%,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.upload-list-container[data-v-775107e6]{width:55vw;height:7vh}.upload-list-card.upload-list-busy[data-v-775107e6],.upload-list-container.upload-list-busy[data-v-775107e6]{height:35vh}.upload-list-item[data-v-775107e6]{display:flex;align-items:center;justify-content:space-between;margin:5px;border:1px solid #a5bef7;padding:5px;border-radius:15px}.upload-list-item-name[data-v-775107e6]{font-size:small;font-weight:700;width:28vw;margin-bottom:5px}.upload-list-item-content[data-v-775107e6]{display:flex;flex-direction:column;margin-left:10px}.upload-list-item-url-text[data-v-775107e6]{width:28vw}.upload-list-item-url-row[data-v-775107e6]{display:flex;flex-direction:row;align-items:center}.upload-list-item-progress[data-v-775107e6]{margin-top:3px;width:28vw}.upload-list-item-action[data-v-775107e6]{display:flex;flex-direction:column;align-items:center}.upload-list-item-action-button[data-v-775107e6]{margin:2px}.upload-card[data-v-775107e6]{width:55vw;padding:20px;background:none}.upload-card-busy[data-v-775107e6] .el-upload-dragger{height:25vh}.paste-mode[data-v-775107e6] .el-upload{pointer-events:none}[data-v-775107e6] .el-upload-dragger{display:flex;flex-direction:column;justify-content:center;align-items:center;height:45vh;border-radius:15px;border:3px dashed #409eff;opacity:.7;background-color:hsla(0,0%,100%,.6);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}[data-v-775107e6] .el-upload-dragger.is-dragover,[data-v-775107e6] .el-upload-dragger:hover{opacity:.8;box-shadow:0 0 10px 5px #409eff}.is-uploading[data-v-775107e6] .el-upload-dragger{animation:breathe-775107e6 3s infinite}.el-upload__text[data-v-775107e6]{font-weight:700;font-size:medium;-webkit-user-select:none;-moz-user-select:none;user-select:none}.el-upload__tip[data-v-775107e6]{font-size:small;color:#faebd7;-webkit-user-select:none;-moz-user-select:none;user-select:none}.upload-list-dashboard[data-v-775107e6]{display:flex;justify-content:space-between;align-items:center;padding:10px}.upload-list-dashboard-title[data-v-775107e6]{font-size:medium;font-weight:700}.page-footer[data-v-7c801e22]{position:fixed;bottom:0;display:flex;justify-content:center;align-items:center;width:100vw;color:#f0f8ff;font-size:large;-webkit-user-select:none;-moz-user-select:none;user-select:none}.footer-name[data-v-7c801e22]{color:#faebd7;font-weight:700;text-decoration:none}.toolbar[data-v-2e0cf1bd]{position:fixed;bottom:8vh;right:1.5vw;display:flex;flex-direction:column;align-items:center;z-index:100}.toolbar-button[data-v-2e0cf1bd]{border:none;transition:all .3s ease;margin-bottom:10px;margin-left:0}.toolbar-button[data-v-2e0cf1bd]:hover{box-shadow:0 0 10px 0 rgba(0,0,0,.1);transform:translateY(-3px)}[data-v-2e0cf1bd] .el-dialog{border-radius:12px;background-color:hsla(0,0%,100%,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 10px 2px rgba(0,0,0,.1)}.dialog-action[data-v-2e0cf1bd]{display:flex;justify-content:center;margin-top:20px}.header[data-v-2e0cf1bd]{display:flex;justify-content:center;align-items:center;padding:15px;position:fixed;top:5vh;color:#ffebcd;-webkit-user-select:none;-moz-user-select:none;user-select:none;text-decoration:none}.main-title[data-v-2e0cf1bd]{background:linear-gradient(90deg,#effac3,#f3a060);-webkit-background-clip:text;background-clip:text;color:transparent;text-decoration:none}.logo[data-v-2e0cf1bd]{height:80px;width:80px;margin-right:5px}.upload-home[data-v-2e0cf1bd]{display:flex;flex-direction:column;justify-content:center;align-items:center;background-image:url(https://imgbed.sanyue.site/file/0dbd5add3605a0b2e8994.jpg);background-size:cover;background-attachment:fixed;height:100vh}.upload[data-v-2e0cf1bd]{position:fixed;top:20vh}

css/859.b5b65b7d.css

@@ -0,0 +1 @@
+.login[data-v-e96d67be]{display:flex;justify-content:center;align-items:center;height:100vh;background-image:url(https://imgbed.sanyue.site/file/0dbd5add3605a0b2e8994.jpg);background-size:cover;background-attachment:fixed}.login-container[data-v-e96d67be]{display:flex;flex-direction:column;justify-content:space-around;align-items:center;height:40vh;width:40vw;border-radius:12px;box-shadow:0 0 12px rgba(0,0,0,.12);background-color:hsla(0,0%,100%,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:all .3s ease}.login-container[data-v-e96d67be]:hover{box-shadow:0 0 12px 4px rgba(0,0,0,.24);transform:translateY(-5px)}.password-input[data-v-e96d67be]{margin-bottom:15px;width:30vw}.submit[data-v-e96d67be]{margin-top:10px}

functions/login.js

@@ -0,0 +1,20 @@
+export async function onRequestPost(context) {
+    // Contents of context object
+    const {
+      request, // same as existing Worker API
+      env, // same as existing Worker API
+      params, // if filename includes [id] or [[path]]
+      waitUntil, // same as ctx.waitUntil in existing Worker API
+      next, // used for middleware or to fetch assets
+      data, // arbitrary space for passing data between middlewares
+    } = context;
+    //从POST请求中获取authCode
+    const jsonRequest = await request.json();
+    const authCode = jsonRequest.authCode;
+    //验证authCode
+    if (env.AUTH_CODE !== undefined && authCode !== env.AUTH_CODE) {
+      return new Response('Unauthorized', { status: 401 })
+    }
+    //返回登录成功
+    return new Response('Login success', { status: 200 })
+}

index.html

@@ -1 +1 @@
-<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/logo.png"><title>Sanyue ImgHub</title><script defer="defer" src="/js/chunk-vendors.eef14227.js"></script><script defer="defer" src="/js/app.1d5428ff.js"></script><link href="/css/chunk-vendors.b85f6a1a.css" rel="stylesheet"><link href="/css/app.93429def.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but sanyue_imghub doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
+<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/logo.png"><title>Sanyue ImgHub</title><script defer="defer" src="/js/chunk-vendors.eef14227.js"></script><script defer="defer" src="/js/app.cda6ef19.js"></script><link href="/css/chunk-vendors.b85f6a1a.css" rel="stylesheet"><link href="/css/app.93429def.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but sanyue_imghub doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>

js/859.2ee810a3.js

@@ -0,0 +1,2 @@
+"use strict";(self["webpackChunksanyue_imghub"]=self["webpackChunksanyue_imghub"]||[]).push([[859],{859:function(s,e,t){t.r(e),t.d(e,{default:function(){return m}});var a=t(6768),n=t(5130);const o=s=>((0,a.Qi)("data-v-e96d67be"),s=s(),(0,a.jt)(),s),i={class:"login"},r={class:"login-container"},u=o((()=>(0,a.Lk)("h1",null,"Login",-1)));function d(s,e,t,o,d,l){const h=(0,a.g2)("el-input"),p=(0,a.g2)("el-button");return(0,a.uX)(),(0,a.CE)("div",i,[(0,a.Lk)("div",r,[u,(0,a.bF)(h,{class:"password-input",modelValue:d.password,"onUpdate:modelValue":e[0]||(e[0]=s=>d.password=s),placeholder:"输入认证码，若未设置留空即可~",type:"password","show-password":"",onKeyup:(0,n.jR)(l.login,["enter","native"])},null,8,["modelValue","onKeyup"]),(0,a.bF)(p,{class:"submit",type:"primary",onClick:l.login},{default:(0,a.k6)((()=>[(0,a.eW)("submit")])),_:1},8,["onClick"])])])}t(4114);var l=t(4570),h=t.n(l),p=t(4373),c={data(){return{password:"",writtenPass:""}},methods:{login(){""===this.password?this.writtenPass="unset":this.writtenPass=this.password,p.A.post("/login",{authCode:this.password}).then((s=>{200===s.status?(h().set("authCode",this.writtenPass,"14d"),this.$router.push("/"),this.$message.success("登录成功~")):this.$message.error("登录失败，请检查认证码是否正确~")})).catch((s=>{this.$message.error("登录失败，请检查认证码是否正确~")}))}}},w=t(1241);const g=(0,w.A)(c,[["render",d],["__scopeId","data-v-e96d67be"]]);var m=g}}]);
+//# sourceMappingURL=859.2ee810a3.js.map

js/859.2ee810a3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"js/859.2ee810a3.js","mappings":"4PACSA,MAAM,S,GACFA,MAAM,mB,UACPC,EAAAA,EAAAA,IAAc,UAAV,SAAK,K,+FAFjBC,EAAAA,EAAAA,IAcM,MAdNC,EAcM,EAbFF,EAAAA,EAAAA,IAYM,MAZNG,EAYM,CAXFC,GACAC,EAAAA,EAAAA,IAQWC,EAAA,CAPPP,MAAM,iBALtBQ,WAMyBC,EAAAC,SANzB,sBAAAC,EAAA,KAAAA,EAAA,GAAAC,GAMyBH,EAAAC,SAAQE,GACjBC,YAAY,kBACZC,KAAK,WACL,mBACCC,SAVjBC,EAAAA,EAAAA,IAUqCC,EAAAC,MAAK,qB,kCAG9BZ,EAAAA,EAAAA,IAA0Ea,EAAA,CAA/DnB,MAAM,SAASc,KAAK,UAAWM,QAAOH,EAAAC,O,CAb7DG,SAAAC,EAAAA,EAAAA,KAaoE,IAAM,EAb1EC,EAAAA,EAAAA,IAaoE,aAbpEC,EAAA,G,4DAsBA,GACIC,IAAAA,GACI,MAAO,CACHf,SAAU,GACVgB,YAAa,GAErB,EACAC,QAAS,CACLT,KAAAA,GAE0B,KAAlBU,KAAKlB,SACLkB,KAAKF,YAAc,QAEnBE,KAAKF,YAAcE,KAAKlB,SAE5BmB,EAAAA,EAAMC,KAAK,SAAU,CACjBC,SAAUH,KAAKlB,WAChBsB,MAAKC,IACe,MAAfA,EAAIC,QAIRC,IAAAA,IAAY,WAAYP,KAAKF,YAAa,OAC1CE,KAAKQ,QAAQC,KAAK,KAClBT,KAAKU,SAASC,QAAQ,UALlBX,KAAKU,SAASE,MAAM,mBAKM,IAC/BC,OAAMC,IACLd,KAAKU,SAASE,MAAM,mBAAmB,GAE/C,I,UC3CR,MAAMG,GAA2B,OAAgB,EAAQ,CAAC,CAAC,SAASC,GAAQ,CAAC,YAAY,qBAEzF,O","sources":["webpack://sanyue_imghub/./src/views/Login.vue","webpack://sanyue_imghub/./src/views/Login.vue?240b"],"sourcesContent":["<template>\r\n    <div class=\"login\">\r\n        <div class=\"login-container\">\r\n            <h1>Login</h1>\r\n            <el-input \r\n                class=\"password-input\" \r\n                v-model=\"password\" \r\n                placeholder=\"输入认证码，若未设置留空即可~\" \r\n                type=\"password\" \r\n                show-password\r\n                @keyup.enter.native=\"login\"\r\n                >\r\n            </el-input>\r\n            <el-button class=\"submit\" type=\"primary\" @click=\"login\">submit</el-button>\r\n        </div>\r\n    </div>\r\n</template>\r\n\r\n<script>\r\nimport cookies from 'vue-cookies'\r\nimport axios from 'axios'\r\n\r\nexport default {\r\n    data() {\r\n        return {\r\n            password: '',\r\n            writtenPass: ''\r\n        }\r\n    },\r\n    methods: {\r\n        login() {\r\n            // set authCode to Cookie, expires in 2 weeks\r\n            if (this.password === '') {\r\n                this.writtenPass = 'unset'\r\n            } else {\r\n                this.writtenPass = this.password\r\n            }\r\n            axios.post('/login', {\r\n                authCode: this.password\r\n            }).then(res => {\r\n                if (res.status !== 200) {\r\n                    this.$message.error('登录失败，请检查认证码是否正确~')\r\n                    return\r\n                }\r\n                cookies.set('authCode', this.writtenPass, '14d')\r\n                this.$router.push('/')\r\n                this.$message.success('登录成功~')\r\n            }).catch(err => {\r\n                this.$message.error('登录失败，请检查认证码是否正确~')\r\n            })\r\n        }\r\n    }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.login {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    height: 100vh;\r\n    background-image: url('https://imgbed.sanyue.site/file/0dbd5add3605a0b2e8994.jpg');\r\n    background-size: cover;\r\n    background-attachment: fixed;\r\n}\r\n.login-container {\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: space-around;\r\n    align-items: center;\r\n    height: 40vh;\r\n    width: 40vw;\r\n    border-radius: 12px;\r\n    box-shadow: 0 0 12px rgba(0, 0, 0, 0.12);\r\n    background-color: rgba(255, 255, 255, 0.6);\r\n    backdrop-filter: blur(8px);\r\n    transition: all 0.3s ease;\r\n}\r\n.login-container:hover {\r\n    box-shadow: 0 0 12px 4px rgba(0, 0, 0, 0.24);\r\n    transform: translateY(-5px);\r\n}\r\n.password-input {\r\n    margin-bottom: 15px;\r\n    width: 30vw;\r\n}\r\n.submit {\r\n    margin-top: 10px;\r\n}\r\n</style>","import { render } from \"./Login.vue?vue&type=template&id=e96d67be&scoped=true\"\nimport script from \"./Login.vue?vue&type=script&lang=js\"\nexport * from \"./Login.vue?vue&type=script&lang=js\"\n\nimport \"./Login.vue?vue&type=style&index=0&id=e96d67be&scoped=true&lang=css\"\n\nimport exportComponent from \"../../node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__scopeId',\"data-v-e96d67be\"]])\n\nexport default __exports__"],"names":["class","_createElementVNode","_createElementBlock","_hoisted_1","_hoisted_2","_hoisted_3","_createVNode","_component_el_input","modelValue","$data","password","_cache","$event","placeholder","type","onKeyup","_withKeys","$options","login","_component_el_button","onClick","default","_withCtx","_createTextVNode","_","data","writtenPass","methods","this","axios","post","authCode","then","res","status","cookies","$router","push","$message","success","error","catch","err","__exports__","render"],"sourceRoot":""}