amazon-web-services - 尝试将文件上传到 S3 存储桶时如何修复 InvalidArgument 错误 400？

Question

我正在尝试使用 Axios 将文件上传到具有预签名 URL 的 S3 存储桶中。当我在网络检查器中看到 PUT 请求时，它似乎可以工作，但我收到的响应是错误 400 InvalidArgument。这是有关我得到的错误的更多信息：

<Error>
    <Code>InvalidArgument</Code>
    <Message>Only one auth mechanism allowed; only the X-Amz-Algorithm query parameter, Signature query string parameter or the Authorization header should be specified</Message>
    <ArgumentName>Authorization</ArgumentName>
    <ArgumentValue>Bearer xxxxxxxxxxxxxxx</ArgumentValue>
    <RequestId>xxxxxxxxxxxxxxx</RequestId>
    <HostId>xxxxxxxxxxxxxxx</HostId>
</Error>

这是我的存储桶 CORS 政策：

[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "PUT"
        ],
        "AllowedOrigins": [
            "*"
        ],
        "ExposeHeaders": [],
        "MaxAgeSeconds": 3000
    }
]

这是我的 Nuxt.js 页面，它请求预签名 URL 并上传文件：

<template>
  <v-file-input label="Select your file to upload" accept="image/*" v-model="myFile">
    File to upload to S3
  </v-file-input>
</template>

<script>
export default {
  data() {
    return {
      myFile: null,
      ApiGatewayUrl: "https://xxxxxx.execute-api.eu-central-1.amazonaws.com/"
    }
  },
  methods: {
    uploadFile() {
      let formData = new FormData()
      formData.append("files", this.myFile, "testname");

      // get the pre-signed URL
      this.$axios.get(this.ApiGatewayUrl, {
        headers: {
          Authorization: this.$auth.strategy.token.get()
        }
      }).then((response) => {
      
        // now do a PUT request to the pre-signed URL
        this.$axios.put(response.data, formData).then((response) => {
          this.setState({
            statusCode: response.status,
          })
        })
      })
    }
  }
}
</script>

标签： amazon-web-servicesamazon-s3axiosnuxt.js