已解決430363個問題，去搜搜看，總會有你想問的

S3圖像上傳組件在私有路由頁面上失敗，但不是公共頁面

首頁猿問 S3圖像上傳組件在私有路由頁面上失...

S3圖像上傳組件在私有路由頁面上失敗，但不是公共頁面

JavaScript

小唯快跑啊 2022-10-27 14:46:44

我創建了一個圖像上傳組件，它將一張圖像上傳到 S3。完全相同的組件適用于一個頁面（DevPage在 AppRouter 中），而不是另一個（Dashboard在 AppRouter 中的頁面）。從儀表板（私人）頁面嘗試時，錯誤如下：xhr.js:178 PUT https://<domain>.s3.amazonaws.com/dummyCo/images/5eb9927c5e23ef001719395f/48da9506-dc13-465a-b3f5-928334d33f47?AWSAccessKeyId=<redacted>&Content-Type=png&Expires=1593609319&Signature=<redacted>-amz-acl=public-read 400 (Bad Request)image (S3) upload error Error: Request failed with status code 400 at createError (createError.js:16) at settle (settle.js:17) at XMLHttpRequest.handleLoad (xhr.js:61)但是在 DevPage 上運行時，它是成功的。我完全困惑 - 請幫忙！負責將圖像上傳到 S3 的行。dispatch(uploadImage(uploadInput.files[0], dummyObsId, dummyCompany))當它呈現在公共路由頁面上時，它可以工作，但不能在私有路由頁面上。AppRouter.js（為簡潔起見，刪除了一些路線）

查看完整描述

1 回答

青春有我

TA貢獻1784條經驗獲得超8個贊

解決了！

我不得不使用 Axios 的“裸”版本向 S3 發出 put 請求。

我之前使用的是在我的 API 文件中聲明的 Axios 實例......

import axios from 'axios'

import store from '../redux/store'

const instance = axios.create({

baseURL: process.env.REACT_APP_API_URL

})

instance.interceptors.request.use(

async (config) => {

const token = store.getState().auth.token

if (token) {

config.headers.Authorization = `Bearer ${token}`

}

return config

(e) => {

return Promise.reject(e)

}

)

export default instance

當我通過身份驗證時，這弄亂了我的標題。AWS 不喜歡這樣。

解決方案是將 Redux 操作從

import api from '../api'

...

api.put(signedRequest, file, options)

...

至

import axios from 'axios'

...

axios.put(signedRequest, file, options)

...

同時將其余 API 調用留在默認 API Axios 實例上。

反對回復 2022-10-27

1 回答
0 關注
86 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

S3圖像上傳組件在私有路由頁面上失敗，但不是公共頁面

S3圖像上傳組件在私有路由頁面上失敗，但不是公共頁面

1 回答

添加回答

S3圖像上傳組件在私有路由頁面上失敗，但不是公共頁面

S3圖像上傳組件在私有路由頁面上失敗，但不是公共頁面