oss-file-upload.ts 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  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(state.platformApi + '/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 = ({
  60. file,
  61. action,
  62. data,
  63. onProgress,
  64. onFinish,
  65. onError
  66. }: any) => {
  67. if (ossSwitch === 'ks3') {
  68. const fileParams = {
  69. policy: data.policy,
  70. signature: data.signature,
  71. key: data.key,
  72. acl: 'public-read',
  73. KSSAccessKeyId: data.KSSAccessKeyId,
  74. name: data.name
  75. } as any;
  76. const formData = new FormData();
  77. for (const key in fileParams) {
  78. formData.append(key, fileParams[key]);
  79. }
  80. formData.append('file', data.file as File);
  81. // axios
  82. // .post(action as string, formData, {
  83. // onUploadProgress: ({ progress }) => {
  84. // console.log(progress)
  85. // onProgress({ percent: Math.ceil((progress || 0) * 100) })
  86. // }
  87. // })
  88. // .then(() => {
  89. // file.url = action + data.key
  90. // onFinish()
  91. // })
  92. // .catch((error) => {
  93. // onError(error)
  94. // })
  95. umiRequest(action as string, {
  96. method: 'POST',
  97. data: formData
  98. })
  99. .then(() => {
  100. file.url = action + data.key;
  101. onFinish();
  102. })
  103. .catch(error => {
  104. onError(error);
  105. });
  106. } else {
  107. const cos = new COS({
  108. Domain: 'https://oss.dayaedu.com',
  109. Protocol: 'https',
  110. // getAuthorization 必选参数
  111. getAuthorization: async (options: any, callback: any) => {
  112. callback({ Authorization: data.signature });
  113. }
  114. });
  115. cos
  116. .uploadFile({
  117. Bucket: tencentBucket /* 填写自己的 bucket,必须字段 */,
  118. Region: 'ap-nanjing' /* 存储桶所在地域,必须字段 */,
  119. Key: `gyt/${data.name}`,
  120. /* 存储在桶里的对象键(例如:1.jpg,a/b/test.txt,图片.jpg)支持中文,必须字段 */
  121. Body: data.file.file, // 上传文件对象
  122. SliceSize:
  123. 1024 *
  124. 1024 *
  125. 500 /* 触发分块上传的阈值,超过5MB使用分块上传,小于5MB使用简单上传。可自行设置,非必须 */,
  126. onProgress: function (progressData: { percent: any }) {
  127. onProgress({ percent: Math.ceil((progressData.percent || 0) * 100) });
  128. }
  129. })
  130. .then((res: any) => {
  131. // file.url = 'https://' + res.Location;
  132. if (res.Location?.indexOf('http') >= 0) {
  133. file.url = res.Location;
  134. } else {
  135. file.url = 'https://' + res.Location;
  136. }
  137. onFinish();
  138. })
  139. .catch((error: any) => {
  140. console.log(error, 'error');
  141. onError();
  142. });
  143. }
  144. };
  145. export const onOnlyFileUpload = async (action: string, params: any) => {
  146. if (ossSwitch === 'ks3') {
  147. const fileParams = {
  148. policy: params.policy,
  149. signature: params.signature,
  150. key: params.key,
  151. acl: 'public-read',
  152. KSSAccessKeyId: params.KSSAccessKeyId,
  153. name: params.name
  154. } as any;
  155. const formData = new FormData();
  156. for (const key in fileParams) {
  157. formData.append(key, fileParams[key]);
  158. }
  159. formData.append('file', params.file as File);
  160. let file = '';
  161. let errorObj: any = null;
  162. // await axios
  163. // .post(action as string, formData, {
  164. // // onUploadProgress: ({ progress }) => {
  165. // // console.log(progress);
  166. // // onProgress({ percent: Math.ceil((progress || 0) * 100) });
  167. // // }
  168. // })
  169. // .then(() => {
  170. // file = action + params.key
  171. // })
  172. // .catch((error) => {
  173. // // onError(error);
  174. // errorObj = error
  175. // // throw new Error(error);
  176. // })
  177. await umiRequest(action as string, {
  178. method: 'POST',
  179. data: formData
  180. })
  181. .then(() => {
  182. file = action + params.key;
  183. })
  184. .catch(error => {
  185. errorObj = error;
  186. });
  187. if (file) {
  188. return file;
  189. } else {
  190. throw new Error(errorObj);
  191. }
  192. return file;
  193. } else {
  194. let file = '';
  195. let errorObj: any = null;
  196. console.log(params, 'params');
  197. const cos = new COS({
  198. Domain: 'https://oss.dayaedu.com',
  199. // getAuthorization 必选参数
  200. getAuthorization: async (options: any, callback: any) => {
  201. callback({ Authorization: params.signature });
  202. }
  203. });
  204. // http://daya-online-1303457149.cos.ap-nanjing.myqcloud.com/gyt
  205. // http://daya-online-1303457149.cos.ap-nanjing.myqcloud.com/gyt
  206. await cos
  207. .uploadFile({
  208. Bucket: tencentBucket /* 填写自己的 bucket,必须字段 */,
  209. Region: 'ap-nanjing' /* 存储桶所在地域,必须字段 */,
  210. Key: `gyt/${params.name}`,
  211. /* 存储在桶里的对象键(例如:1.jpg,a/b/test.txt,图片.jpg)支持中文,必须字段 */
  212. Body: params.file, // 上传文件对象
  213. SliceSize:
  214. 1024 *
  215. 1024 *
  216. 500 /* 触发分块上传的阈值,超过5MB使用分块上传,小于5MB使用简单上传。可自行设置,非必须 */
  217. // onProgress: function (progressData) {
  218. // onProgress({ percent: Math.ceil((progressData.percent || 0) * 100) });
  219. // }
  220. })
  221. .then((res: any) => {
  222. // file.url = 'https://' + res.Location;
  223. // file = 'https://' + res.Location;
  224. if (res.Location?.indexOf('http') >= 0) {
  225. file = res.Location;
  226. } else {
  227. file = 'https://' + res.Location;
  228. }
  229. // onFinish();
  230. })
  231. .catch((error: any) => {
  232. // console.log(error, 'error');
  233. // onError();
  234. // throw new Error(error);
  235. errorObj = error;
  236. });
  237. if (file) {
  238. return file;
  239. } else {
  240. throw new Error(errorObj);
  241. }
  242. }
  243. };