Форма выпускает ошибку CORS в качестве получения ⇐ Javascript

[Anonymous]

Я пытаюсь загрузить некоторые данные на S3, используя предварительно подписанный запрос на отправку. При этом я столкнулся с ошибкой COR:

Доступ к загрузке по адресу «http://localhost:4566/17acvaclgm-pictures» из источника «http: //127.0.0.1:4006» заблокирован политикой CORS: в запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin». Если вам подходит непрозрачный ответ, установите режим запроса «no-cors», чтобы получить ресурс с отключенным CORS.

Я написал простой пример выполняем загрузку с помощью формы:

Код: Выделить всё

HTML 5 Boilerplate

Это сработало:

Код: Выделить всё

HTTP/1.1 204 NO CONTENT
Server: TwistedWeb/24.3.0
Date: Sun, 26 Jan 2025 05:53:45 GMT
Access-Control-Allow-Origin: *
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
Access-Control-Allow-Methods: GET, HEAD, PUT, POST, DELETE
Location: http://17acvaclgm-pictures.s3.localhost.localstack.cloud:4566/browserObject
ETag: "f520dae5b605d9c92072c67d1ae2b8a7"
x-amz-server-side-encryption: AES256
x-amz-request-id: f5719cde-db04-498a-b8e3-d13a46f11e41
x-amz-id-2: s9lzHYrFp76ZVxRcpX9+5cjAnEH2ROuNkd2BHfIa6UkFVdtjf5mKR3/eTPFvsiP/XV/VLi31234=

Поэтому, чтобы попытаться исправить свою попытку, я нажал «Копировать как выборку», выдав:

Код: Выделить всё

fetch("http://localhost:4566/17acvaclgm-pictures", {
"headers": {
"accept": "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7",
"accept-language": "en-GB,en-US;q=0.9,en;q=0.8",
"cache-control": "max-age=0",
"content-type": "multipart/form-data; boundary=----WebKitFormBoundary9m2KrDP2o5TzQkvt",
"sec-ch-ua": "\"Google Chrome\";v=\"131\", \"Chromium\";v=\"131\", \"Not_A Brand\";v=\"24\"",
"sec-ch-ua-mobile": "?0",
"sec-ch-ua-platform": "\"Windows\"",
"sec-fetch-dest": "document",
"sec-fetch-mode": "navigate",
"sec-fetch-site": "cross-site",
"sec-fetch-user": "?1",
"upgrade-insecure-requests": "1"
},
"referrer": "http://127.0.0.1:4040/",
"referrerPolicy": "strict-origin-when-cross-origin",
"method": "POST",
"mode": "cors",
"credentials": "omit"
});

Я затем обновил реферат и добавил тело с данными моей формы:

Код: Выделить всё

let formData = new FormData();
// ...
fetch("http://localhost:4566/17acvaclgm-pictures", {
"headers": {
// ...
},
// ...
referrer: "http://127.0.0.1:4006/"
// ...
body: formData
});

Затем я запустил это и получил ту же ошибку.
Я проверил фактические заголовки запроса и обнаружил, несмотря на копирование, что запрос получен из выборки
code> имели разные заголовки:

Код: Выделить всё

accept:
text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7
accept-language:
en-GB,en-US;q=0.9,en;q=0.8
cache-control:
max-age=0
content-type:
multipart/form-data; boundary=----WebKitFormBoundaryIjvYSjxNxnzfxn11
referer:
http://127.0.0.1:4006/
sec-ch-ua:
"Google Chrome";v="131", "Chromium";v="131", "Not_A Brand";v="24"
sec-ch-ua-mobile:
?0
sec-ch-ua-platform:
"Windows"
upgrade-insecure-requests:
1
user-agent:
Mozilla/5.0 (Windows NT 10.0; Win64;  x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36
< /code>
в отличие от заголовков в успешном запросе: < /p>
accept:
text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7
accept-encoding:
gzip, deflate, br, zstd
accept-language:
en-GB,en-US;q=0.9,en;q=0.8
cache-control:
max-age=0
connection:
keep-alive
content-length:
335341
content-type:
multipart/form-data; boundary=----WebKitFormBoundary9m2KrDP2o5TzQkvt
host:
localhost:4566
origin:
http://127.0.0.1:4040
referer:
http://127.0.0.1:4040/
sec-ch-ua:
"Google Chrome";v="131", "Chromium";v="131", "Not_A Brand";v="24"
sec-ch-ua-mobile:
?0
sec-ch-ua-platform:
"Windows"
sec-fetch-dest:
document
sec-fetch-mode:
navigate
sec-fetch-site:
cross-site
sec-fetch-user:
?1
upgrade-insecure-requests:
1
user-agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Примечательно здесь Origin важно для S3, как указано на https://docs.aws.amazon.com/amazons3/la ... oting.html и https://stackoverflow.com/a/32887912/4301453. Поэтому я пытаюсь добавить это: < /p>

Код: Выделить всё

// ...
fetch("http://localhost:4566/17acvaclgm-pictures", {
"headers": {
// ...
},
// ...
origin: "http://127.0.0.1:4006"
});

Это также не удалось из-за той же ошибки COR.
Что я здесь делаю не так?

Подробнее здесь: https://stackoverflow.com/questions/793 ... r-as-fetch