| | |
|---|
| | | import axios from 'axios' |
|---|
| | | |
|---|
| | | // GraphQL查询获取上传凭证 |
|---|
| | | const GET_UPLOAD_CREDENTIALS = ` |
|---|
| | | query GetUploadCredentials { |
|---|
| | | getUploadCredentials { |
|---|
| | | bucket |
|---|
| | | region |
|---|
| | | key |
|---|
| | | presignedUrl |
|---|
| | | expiration |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ` |
|---|
| | | |
|---|
| | | // 从后端GraphQL获取上传凭证 |
|---|
| | | const getUploadCredentials = async () => { |
|---|
| | | try { |
|---|
| | | const response = await axios.post('http://localhost:8080/graphql', { |
|---|
| | | query: GET_UPLOAD_CREDENTIALS |
|---|
| | | }) |
|---|
| | | |
|---|
| | | if (response.data.errors) { |
|---|
| | | throw new Error(response.data.errors[0].message) |
|---|
| | | } |
|---|
| | | |
|---|
| | | return response.data.data.getUploadCredentials |
|---|
| | | } catch (error) { |
|---|
| | | console.error('获取上传凭证失败:', error) |
|---|
| | | throw error |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 使用预签名URL上传文件到腾讯云COS |
|---|
| | | * @param file 要上传的文件 |
|---|
| | | * @returns Promise<string> 返回文件的访问URL |
|---|
| | | */ |
|---|
| | | export const uploadToCOS = async (file: File): Promise<string> => { |
|---|
| | | try { |
|---|
| | | // 获取上传凭证 |
|---|
| | | const credentials = await getUploadCredentials() |
|---|
| | | |
|---|
| | | // 使用预签名URL |
|---|
| | | const uploadUrl = credentials.presignedUrl |
|---|
| | | |
|---|
| | | // 使用预签名URL上传文件 |
|---|
| | | const uploadResponse = await axios.put(uploadUrl, file, { |
|---|
| | | headers: { |
|---|
| | | 'Content-Type': file.type, |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | if (uploadResponse.status === 200) { |
|---|
| | | // 返回文件的访问URL（去掉查询参数） |
|---|
| | | const fileUrl = `https://${credentials.bucket}.cos.${credentials.region}.myqcloud.com/${credentials.key}` |
|---|
| | | return fileUrl |
|---|
| | | } else { |
|---|
| | | throw new Error(`上传失败，状态码: ${uploadResponse.status}`) |
|---|
| | | } |
|---|
| | | |
|---|
| | | } catch (error) { |
|---|
| | | throw error |
|---|
| | | } |
|---|
| | | import axios from 'axios'
|
|---|
| | |
|
|---|
| | | // GraphQL查询获取上传凭证
|
|---|
| | | const GET_UPLOAD_CREDENTIALS = `
|
|---|
| | | query GetUploadCredentials {
|
|---|
| | | getUploadCredentials {
|
|---|
| | | bucket
|
|---|
| | | region
|
|---|
| | | key
|
|---|
| | | presignedUrl
|
|---|
| | | expiration
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | `
|
|---|
| | |
|
|---|
| | | // 从后端GraphQL获取上传凭证
|
|---|
| | | const getUploadCredentials = async () => {
|
|---|
| | | try {
|
|---|
| | | const response = await axios.post('http://localhost:8080/graphql', {
|
|---|
| | | query: GET_UPLOAD_CREDENTIALS
|
|---|
| | | })
|
|---|
| | | |
|---|
| | | if (response.data.errors) {
|
|---|
| | | throw new Error(response.data.errors[0].message)
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | return response.data.data.getUploadCredentials
|
|---|
| | | } catch (error) {
|
|---|
| | | console.error('获取上传凭证失败:', error)
|
|---|
| | | throw error
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | /**
|
|---|
| | | * 使用预签名URL上传文件到腾讯云COS
|
|---|
| | | * @param file 要上传的文件
|
|---|
| | | * @returns Promise<string> 返回文件的访问URL
|
|---|
| | | */
|
|---|
| | | export const uploadToCOS = async (file: File): Promise<string> => {
|
|---|
| | | try {
|
|---|
| | | // 获取上传凭证
|
|---|
| | | const credentials = await getUploadCredentials()
|
|---|
| | | |
|---|
| | | // 使用预签名URL
|
|---|
| | | const uploadUrl = credentials.presignedUrl
|
|---|
| | | |
|---|
| | | // 使用预签名URL上传文件
|
|---|
| | | const uploadResponse = await axios.put(uploadUrl, file, {
|
|---|
| | | headers: {
|
|---|
| | | 'Content-Type': file.type,
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | |
|---|
| | | if (uploadResponse.status === 200) {
|
|---|
| | | // 返回文件的访问URL（去掉查询参数）
|
|---|
| | | const fileUrl = `https://${credentials.bucket}.cos.${credentials.region}.myqcloud.com/${credentials.key}`
|
|---|
| | | return fileUrl
|
|---|
| | | } else {
|
|---|
| | | throw new Error(`上传失败，状态码: ${uploadResponse.status}`)
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | } catch (error) {
|
|---|
| | | throw error
|
|---|
| | | }
|
|---|
| | | } |
|---|
