oss-file-upload.ts 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
  1. import request from './request'
  2. // import axios from 'axios'
  3. import umiRequest from 'umi-request'
  4. import COS from 'cos-js-sdk-v5'
  5. import { state } from '@/state'
  6. export const ossSwitch = 'tencent' as 'ks3' | 'tencent' // 上传文件服务商
  7. const tencentBucket = 'daya-online-1303457149'
  8. /**
  9. * 管乐团 gyt/
  10. * 酷乐秀 klx/
  11. * 课堂乐器 ktqy/
  12. * 管乐迷 gym/
  13. */
  14. // 定义一个cos 对象
  15. /**
  16. * 获取上传文件签名
  17. * @param params 上传对应参数
  18. * { filename: fileName,
  19. bucketName: props.bucketName,
  20. postData: {
  21. filename: fileName,
  22. acl: 'public-read',
  23. key: fileName,
  24. unknowValueField: []
  25. }}
  26. * @param oss 服务商 ks3 tencent
  27. * @returns ”{'signatur'':'',''kssAccessKeyI'':'',''policy': '' }“
  28. */
  29. export const getUploadSign = async (params: any) => {
  30. const { bucketName, filename, postData } = params
  31. const ossType = ossSwitch
  32. let bucket = bucketName
  33. let file = filename
  34. // const key = postData.key;
  35. let tempPostData: any = {}
  36. if (ossType === 'tencent') {
  37. bucket = tencentBucket
  38. file = 'gyt/' + filename
  39. tempPostData = {
  40. key: 'gyt/' + postData.key
  41. }
  42. } else {
  43. tempPostData = postData
  44. }
  45. return request.post('/api-student/open/getUploadSign', {
  46. data: {
  47. postData: tempPostData,
  48. pluginName: ossType,
  49. bucketName: bucket,
  50. filename: file
  51. },
  52. params: { pluginName: ossType }
  53. })
  54. }
  55. /**
  56. * 使用组件上传时,调用方法
  57. * @param param0
  58. */
  59. export const onFileUpload = ({ file, action, data, onProgress, onFinish, onError }: any) => {
  60. if (ossSwitch === 'ks3') {
  61. const fileParams = {
  62. policy: data.policy,
  63. signature: data.signature,
  64. key: data.key,
  65. acl: 'public-read',
  66. KSSAccessKeyId: data.KSSAccessKeyId,
  67. name: data.name
  68. } as any
  69. const formData = new FormData()
  70. for (const key in fileParams) {
  71. formData.append(key, fileParams[key])
  72. }
  73. formData.append('file', data.file as File)
  74. // axios
  75. // .post(action as string, formData, {
  76. // onUploadProgress: ({ progress }) => {
  77. // console.log(progress)
  78. // onProgress({ percent: Math.ceil((progress || 0) * 100) })
  79. // }
  80. // })
  81. // .then(() => {
  82. // file.url = action + data.key
  83. // onFinish()
  84. // })
  85. // .catch((error) => {
  86. // onError(error)
  87. // })
  88. umiRequest(action as string, {
  89. method: 'POST',
  90. data: formData
  91. })
  92. .then(() => {
  93. file.url = action + data.key
  94. onFinish()
  95. })
  96. .catch((error) => {
  97. onError(error)
  98. })
  99. } else {
  100. const cos = new COS({
  101. Domain: 'https://oss.dayaedu.com',
  102. Protocol: 'https',
  103. // getAuthorization 必选参数
  104. getAuthorization: async (options, callback: any) => {
  105. callback({ Authorization: data.signature })
  106. }
  107. })
  108. cos
  109. .uploadFile({
  110. Bucket: tencentBucket /* 填写自己的 bucket,必须字段 */,
  111. Region: 'ap-nanjing' /* 存储桶所在地域,必须字段 */,
  112. Key: `gyt/${data.name}`,
  113. /* 存储在桶里的对象键(例如:1.jpg,a/b/test.txt,图片.jpg)支持中文,必须字段 */
  114. Body: data.file.file, // 上传文件对象
  115. SliceSize:
  116. 1024 *
  117. 1024 *
  118. 500 /* 触发分块上传的阈值,超过5MB使用分块上传,小于5MB使用简单上传。可自行设置,非必须 */,
  119. onProgress: function (progressData) {
  120. onProgress({ percent: Math.ceil((progressData.percent || 0) * 100) })
  121. }
  122. })
  123. .then((res: any) => {
  124. // file.url = 'https://' + res.Location;
  125. if (res.Location?.indexOf('http') >= 0) {
  126. file.url = res.Location
  127. } else {
  128. file.url = 'https://' + res.Location
  129. }
  130. onFinish()
  131. })
  132. .catch((error) => {
  133. console.log(error, 'error')
  134. onError()
  135. })
  136. }
  137. }
  138. export const onOnlyFileUpload = async (action: string, params: any) => {
  139. if (ossSwitch === 'ks3') {
  140. const fileParams = {
  141. policy: params.policy,
  142. signature: params.signature,
  143. key: params.key,
  144. acl: 'public-read',
  145. KSSAccessKeyId: params.KSSAccessKeyId,
  146. name: params.name
  147. } as any
  148. const formData = new FormData()
  149. for (const key in fileParams) {
  150. formData.append(key, fileParams[key])
  151. }
  152. formData.append('file', params.file as File)
  153. let file = ''
  154. let errorObj: any = null
  155. // await axios
  156. // .post(action as string, formData, {
  157. // // onUploadProgress: ({ progress }) => {
  158. // // console.log(progress);
  159. // // onProgress({ percent: Math.ceil((progress || 0) * 100) });
  160. // // }
  161. // })
  162. // .then(() => {
  163. // file = action + params.key
  164. // })
  165. // .catch((error) => {
  166. // // onError(error);
  167. // errorObj = error
  168. // // throw new Error(error);
  169. // })
  170. await umiRequest(action as string, {
  171. method: 'POST',
  172. data: formData
  173. })
  174. .then(() => {
  175. file = action + params.key
  176. })
  177. .catch((error) => {
  178. errorObj = error
  179. })
  180. if (file) {
  181. return file
  182. } else {
  183. throw new Error(errorObj)
  184. }
  185. return file
  186. } else {
  187. let file = ''
  188. let errorObj: any = null
  189. const cos = new COS({
  190. Domain: 'https://oss.dayaedu.com',
  191. // getAuthorization 必选参数
  192. getAuthorization: async (options, callback: any) => {
  193. callback({ Authorization: params.signature })
  194. }
  195. })
  196. // http://daya-online-1303457149.cos.ap-nanjing.myqcloud.com/gyt
  197. // http://daya-online-1303457149.cos.ap-nanjing.myqcloud.com/gyt
  198. await cos
  199. .uploadFile({
  200. Bucket: tencentBucket /* 填写自己的 bucket,必须字段 */,
  201. Region: 'ap-nanjing' /* 存储桶所在地域,必须字段 */,
  202. Key: `gyt/${params.name}`,
  203. /* 存储在桶里的对象键(例如:1.jpg,a/b/test.txt,图片.jpg)支持中文,必须字段 */
  204. Body: params.file, // 上传文件对象
  205. SliceSize:
  206. 1024 *
  207. 1024 *
  208. 500 /* 触发分块上传的阈值,超过5MB使用分块上传,小于5MB使用简单上传。可自行设置,非必须 */
  209. // onProgress: function (progressData) {
  210. // onProgress({ percent: Math.ceil((progressData.percent || 0) * 100) });
  211. // }
  212. })
  213. .then((res: any) => {
  214. // file.url = 'https://' + res.Location;
  215. // file = 'https://' + res.Location;
  216. if (res.Location?.indexOf('http') >= 0) {
  217. file = res.Location
  218. } else {
  219. file = 'https://' + res.Location
  220. }
  221. // onFinish();
  222. })
  223. .catch((error) => {
  224. // console.log(error, 'error');
  225. // onError();
  226. // throw new Error(error);
  227. errorObj = error
  228. })
  229. if (file) {
  230. return file
  231. } else {
  232. throw new Error(errorObj)
  233. }
  234. }
  235. }