oss-file-upload.js 6.0 KB

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