Question

我一直试图根据我发现的几个例子将S3的客户端上传表单放在一起，但我似乎无法解决我在OPTIONS请求中遇到的错误：

XMLHttpRequest cannot load https://s3.amazonaws.com/myApp. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

根据我的理解，如果我没有在我的请求中包含Origin标头，那么应该触发这个...

Host:s3.amazonaws.com
Origin:http://localhost:3000

任何人都知道为什么标题可能不会包含在响应中？这里有一些更具体的细节 CORS配置

<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://localhost:3000</AllowedOrigin>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

的CoffeeScript

jQuery ->
 $('#fileupload').fileupload


add: (e, data) ->
  types = /(\.|\/)(gif|jpe?g|png)$/i
  file = data.files[0]
  if types.test(file.type) || types.test(file.name)
    data.context = $($.tmpl("template-upload", file))
    $('#fileupload').append(data.context)
    data.submit()
  else
    alert("#{file.name} is not a gif, jpeg, or png image file")

progress: (e, data) ->
  if data.context
    progress = parseInt(data.loaded / data.total * 100, 10)
    data.context.find('.bar').css('width', progress + '%')

done: (e, data) ->
  file = data.files[0]
  domain = $('#fileupload').attr('action')
  path = $('#fileupload input[name=key]').val().replace('${filename}', file.name)
  to = $('#fileupload').data('post')
  content = {}
  content[$('#fileupload').data('as')] = domain + path
  $.post(to, content)
  data.context.remove() if data.context # remove progress bar

fail: (e, data) ->
  alert("#{data.files[0].name} failed to upload.")
  console.log("Upload failed:")
  console.log(data)

Answer 1

Welp，傻我。在错误的桶上工作！

客户端上传到S3。 No＆＃39; Access-Control-Allow-Origin＆＃39;头

1 个答案: