From f75a197d74ce65dc61efdc7e1f15dc1ed2a858a3 Mon Sep 17 00:00:00 2001 From: JimQing Date: Mon, 7 Sep 2020 23:06:43 +0800 Subject: [PATCH] feat: upload config --- src/api/file.js | 57 +++--------------- src/assets/scripts/renderers/wx-renderer.js | 1 - src/assets/scripts/uploadImageFile.js | 3 +- .../CodemirrorEditor/uploadImgDialog.vue | 26 +++++--- src/store/imageApi.js | 59 +++++++++++++++++++ src/store/index.js | 6 +- 6 files changed, 93 insertions(+), 59 deletions(-) create mode 100644 src/store/imageApi.js diff --git a/src/api/file.js b/src/api/file.js index f75fd79..c306ee0 100644 --- a/src/api/file.js +++ b/src/api/file.js @@ -1,61 +1,22 @@ import fetch from './fetch'; +import store from '../store/index'; import { v4 as uuidv4 } from 'uuid'; -const fileUploadConfig = { - username: 'filess', - repo: 'images', - accessToken: [ - '7715d7ca67b5d3837cfdoocsmde8c38421815aa423510af', - 'c411415bf95dbe39625doocsmd5047ba9b7a2a6c9642abe', - '2821cd8819fa345c053doocsmdca86ac653f8bc20db1f1b', - '445f0dae46ef1f2a4d6doocsmdc797301e94797b4750a4c', - 'cc1d0c1426d0fd0902bdoocsmdd2d7184b14da61b86ec46', - 'b67e9d15cb6f910492fdoocsmdac6b44d379c953bb19eff', - '618c4dc2244ccbbc088doocsmd125d17fd31b7d06a50cf3', - 'a4b581732e1c1507458doocsmdc5b223b27dae5e2e16a55' - ] -} - -function getConfiguration() { - const imgHost = localStorage.getItem("ImgHost") || 'default' - - // Default - let token = fileUploadConfig.accessToken[Math.floor(Math.random() * fileUploadConfig.accessToken.length)].replace('doocsmd', '') - let username = fileUploadConfig.username - let repo = fileUploadConfig.repo - - // GitHub - if (imgHost === 'github' && localStorage.getItem("GitHubConfig")) { - const githubConfg = JSON.parse(localStorage.getItem("GitHubConfig")) - const repoUrl = githubConfg.repo.replace("https://github.com/", "").replace("http://github.com/", "").replace("github.com/", "").split("/") - token = githubConfg.accessToken - username = repoUrl[0] - repo = repoUrl[1] - } - return { - username, - repo, - token - } -} - function fileUpload(content, filename) { - const date = new Date(); - const dir = date.getFullYear() + '/' + (date.getMonth() + 1).toString().padStart(2, '0') + '/' + date.getDate().toString().padStart(2, '0'); + const { + method, + token, + url + } = store.getters['imageApi/config']; const uuid = uuidv4(); const dateFilename = new Date().getTime() + '-' + uuid + '.' + filename.split('.')[1]; - const { - username, - repo, - token - } = getConfiguration() - const url = `https://api.github.com/repos/${username}/${repo}/contents/${dir}/${dateFilename}` + const uploadUrl = url + dateFilename; return fetch({ - url, - method: 'put', + url: uploadUrl, + method, headers: { 'Authorization': 'token ' + token }, diff --git a/src/assets/scripts/renderers/wx-renderer.js b/src/assets/scripts/renderers/wx-renderer.js index 4c2b166..04e9cae 100644 --- a/src/assets/scripts/renderers/wx-renderer.js +++ b/src/assets/scripts/renderers/wx-renderer.js @@ -1,5 +1,4 @@ import marked from 'marked'; -import store from '../../../store/index'; const WxRenderer = function (opts) { this.opts = opts let ENV_STRETCH_IMAGE = true diff --git a/src/assets/scripts/uploadImageFile.js b/src/assets/scripts/uploadImageFile.js index 023cac8..51c9d0c 100644 --- a/src/assets/scripts/uploadImageFile.js +++ b/src/assets/scripts/uploadImageFile.js @@ -15,11 +15,12 @@ export function uploadImgFile(file) { imgFile.onload = function () { const base64Content = this.result.split(',').pop(); + fileApi.fileUpload(base64Content, file.name).then(res => { const imageUrl = res.content.download_url.replace(githubResourceUrl, cdnResourceUrl); resolve(imageUrl); }).catch(err => { - console.log(err.message) + reject(err.message) }) } }); diff --git a/src/components/CodemirrorEditor/uploadImgDialog.vue b/src/components/CodemirrorEditor/uploadImgDialog.vue index 0e3a66f..33c51a3 100644 --- a/src/components/CodemirrorEditor/uploadImgDialog.vue +++ b/src/components/CodemirrorEditor/uploadImgDialog.vue @@ -18,10 +18,10 @@ - + - + { + .then(res=> { this.$emit("uploaded", res); this.uploadingImg = false; }) - .catch((err) => { + .catch(err=> { this.uploadingImg = false; this.$message({ showClose: true, @@ -139,6 +139,15 @@ export default { diff --git a/src/store/imageApi.js b/src/store/imageApi.js new file mode 100644 index 0000000..1f92fdb --- /dev/null +++ b/src/store/imageApi.js @@ -0,0 +1,59 @@ +const state = { + imgHost: localStorage.getItem("ImgHost") || 'default', // 默认github + default: { + username: 'filess', + repo: 'images', + method: 'put', + accessToken: [ + '7715d7ca67b5d3837cfdoocsmde8c38421815aa423510af', + 'c411415bf95dbe39625doocsmd5047ba9b7a2a6c9642abe', + '2821cd8819fa345c053doocsmdca86ac653f8bc20db1f1b', + '445f0dae46ef1f2a4d6doocsmdc797301e94797b4750a4c', + 'cc1d0c1426d0fd0902bdoocsmdd2d7184b14da61b86ec46', + 'b67e9d15cb6f910492fdoocsmdac6b44d379c953bb19eff', + '618c4dc2244ccbbc088doocsmd125d17fd31b7d06a50cf3', + 'a4b581732e1c1507458doocsmdc5b223b27dae5e2e16a55' + ] + }, + qiniuCloud: {} +}; +const getters = { + config(state) { + let token, username, repo, method; + const activeKey = state.imgHost !== 'default' && localStorage.getItem(`${state.imgHost}Config`) ? state.imgHost : 'default'; + + switch (activeKey) { + case 'github': + const githubConfg = JSON.parse(localStorage.getItem("githubConfig")); + const repoUrl = githubConfg.repo.replace("https://github.com/", "").replace("http://github.com/", "").replace("github.com/", "").split("/"); + token = githubConfg.accessToken; + username = repoUrl[0]; + repo = repoUrl[1]; + method = 'put'; + break; + case 'qiniuCloud': + break; + default: + token = state.default.accessToken[Math.floor(Math.random() * state.default.accessToken.length)].replace('doocsmd', ''); + username = state.default.username; + repo = state.default.repo; + method = state.default.method; + break; + } + const date = new Date(); + const dir = date.getFullYear() + '/' + (date.getMonth() + 1).toString().padStart(2, '0') + '/' + date.getDate().toString().padStart(2, '0'); + const url = `https://api.github.com/repos/${username}/${repo}/contents/${dir}/`; + + return { + method, + token, + url + } + } +}; + +export default { + namespaced: true, + state, + getters +} \ No newline at end of file diff --git a/src/store/index.js b/src/store/index.js index ba39813..cf12b26 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -10,6 +10,8 @@ import { setColor, formatDoc } from '../assets/scripts/util' +// module +import imageApi from './imageApi.js'; Vue.use(Vuex) @@ -155,5 +157,7 @@ export default new Vuex.Store({ state, mutations, actions: {}, - modules: {} + modules: { + imageApi + } })