No 'Access-Control-Allow-Origin' header is present on the requested resource. Amazon S3
I was using react-s3 to do some basic file uploading to amazin s3.
code:
export const addMovie = (values, history) => async dispatch => {
await ReactS3.uploadFile(values.poster, config).then(data => {
console.log(data);
}).catch(err => {
alert(err);
})
const res = await axios.post('/admin/movie', values);
history.push('/admin/movies');
dispatch({ type: "HANDLE_NEW", payload: res.data })
};
but I keep getting this error:
Failed to load url: Response to
preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:3000' is therefore not allowed
access. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
reactjs amazon-s3 redux
|
show 1 more comment
I was using react-s3 to do some basic file uploading to amazin s3.
code:
export const addMovie = (values, history) => async dispatch => {
await ReactS3.uploadFile(values.poster, config).then(data => {
console.log(data);
}).catch(err => {
alert(err);
})
const res = await axios.post('/admin/movie', values);
history.push('/admin/movies');
dispatch({ type: "HANDLE_NEW", payload: res.data })
};
but I keep getting this error:
Failed to load url: Response to
preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:3000' is therefore not allowed
access. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
reactjs amazon-s3 redux
2
Have you added cors headers to s3? medium.com/@pongsakornsemsuwan/…
– Saurabh Nemade
Nov 13 '18 at 20:22
@SaurabhNemade is there's no other way to do it using react-s3? do I have to use the dropzone?
– Ahmed Maher
Nov 13 '18 at 20:26
It is possible to use react-s3. You will need to follow this docs.aws.amazon.com/AmazonS3/latest/dev/… Basically you will require cors headers anywhere if you are accessing something which is not in current domain name of website. For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
– Saurabh Nemade
Nov 13 '18 at 20:46
god it, thank you so much Saurabh! really appreciate it.
– Ahmed Maher
Nov 13 '18 at 20:56
if you don't mind writing it as an answer so I can mark it as aswered!:)
– Ahmed Maher
Nov 13 '18 at 20:57
|
show 1 more comment
I was using react-s3 to do some basic file uploading to amazin s3.
code:
export const addMovie = (values, history) => async dispatch => {
await ReactS3.uploadFile(values.poster, config).then(data => {
console.log(data);
}).catch(err => {
alert(err);
})
const res = await axios.post('/admin/movie', values);
history.push('/admin/movies');
dispatch({ type: "HANDLE_NEW", payload: res.data })
};
but I keep getting this error:
Failed to load url: Response to
preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:3000' is therefore not allowed
access. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
reactjs amazon-s3 redux
I was using react-s3 to do some basic file uploading to amazin s3.
code:
export const addMovie = (values, history) => async dispatch => {
await ReactS3.uploadFile(values.poster, config).then(data => {
console.log(data);
}).catch(err => {
alert(err);
})
const res = await axios.post('/admin/movie', values);
history.push('/admin/movies');
dispatch({ type: "HANDLE_NEW", payload: res.data })
};
but I keep getting this error:
Failed to load url: Response to
preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:3000' is therefore not allowed
access. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
reactjs amazon-s3 redux
reactjs amazon-s3 redux
asked Nov 13 '18 at 20:07
Ahmed MaherAhmed Maher
157
157
2
Have you added cors headers to s3? medium.com/@pongsakornsemsuwan/…
– Saurabh Nemade
Nov 13 '18 at 20:22
@SaurabhNemade is there's no other way to do it using react-s3? do I have to use the dropzone?
– Ahmed Maher
Nov 13 '18 at 20:26
It is possible to use react-s3. You will need to follow this docs.aws.amazon.com/AmazonS3/latest/dev/… Basically you will require cors headers anywhere if you are accessing something which is not in current domain name of website. For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
– Saurabh Nemade
Nov 13 '18 at 20:46
god it, thank you so much Saurabh! really appreciate it.
– Ahmed Maher
Nov 13 '18 at 20:56
if you don't mind writing it as an answer so I can mark it as aswered!:)
– Ahmed Maher
Nov 13 '18 at 20:57
|
show 1 more comment
2
Have you added cors headers to s3? medium.com/@pongsakornsemsuwan/…
– Saurabh Nemade
Nov 13 '18 at 20:22
@SaurabhNemade is there's no other way to do it using react-s3? do I have to use the dropzone?
– Ahmed Maher
Nov 13 '18 at 20:26
It is possible to use react-s3. You will need to follow this docs.aws.amazon.com/AmazonS3/latest/dev/… Basically you will require cors headers anywhere if you are accessing something which is not in current domain name of website. For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
– Saurabh Nemade
Nov 13 '18 at 20:46
god it, thank you so much Saurabh! really appreciate it.
– Ahmed Maher
Nov 13 '18 at 20:56
if you don't mind writing it as an answer so I can mark it as aswered!:)
– Ahmed Maher
Nov 13 '18 at 20:57
2
2
Have you added cors headers to s3? medium.com/@pongsakornsemsuwan/…
– Saurabh Nemade
Nov 13 '18 at 20:22
Have you added cors headers to s3? medium.com/@pongsakornsemsuwan/…
– Saurabh Nemade
Nov 13 '18 at 20:22
@SaurabhNemade is there's no other way to do it using react-s3? do I have to use the dropzone?
– Ahmed Maher
Nov 13 '18 at 20:26
@SaurabhNemade is there's no other way to do it using react-s3? do I have to use the dropzone?
– Ahmed Maher
Nov 13 '18 at 20:26
It is possible to use react-s3. You will need to follow this docs.aws.amazon.com/AmazonS3/latest/dev/… Basically you will require cors headers anywhere if you are accessing something which is not in current domain name of website. For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
– Saurabh Nemade
Nov 13 '18 at 20:46
It is possible to use react-s3. You will need to follow this docs.aws.amazon.com/AmazonS3/latest/dev/… Basically you will require cors headers anywhere if you are accessing something which is not in current domain name of website. For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
– Saurabh Nemade
Nov 13 '18 at 20:46
god it, thank you so much Saurabh! really appreciate it.
– Ahmed Maher
Nov 13 '18 at 20:56
god it, thank you so much Saurabh! really appreciate it.
– Ahmed Maher
Nov 13 '18 at 20:56
if you don't mind writing it as an answer so I can mark it as aswered!:)
– Ahmed Maher
Nov 13 '18 at 20:57
if you don't mind writing it as an answer so I can mark it as aswered!:)
– Ahmed Maher
Nov 13 '18 at 20:57
|
show 1 more comment
1 Answer
1
active
oldest
votes
CORS Headers need to be added given at https://medium.com/@pongsakornsemsuwan/aws-s3-upload-with-react-dropzone-s3-uploader-a76021fe385
You will need to follow this https://docs.aws.amazon.com/AmazonS3/latest/dev/cors-troubleshooting.html
You will require cors headers anywhere if you are accessing something which is not in current domain name of website.
For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
More on CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53288708%2fno-access-control-allow-origin-header-is-present-on-the-requested-resource-am%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
CORS Headers need to be added given at https://medium.com/@pongsakornsemsuwan/aws-s3-upload-with-react-dropzone-s3-uploader-a76021fe385
You will need to follow this https://docs.aws.amazon.com/AmazonS3/latest/dev/cors-troubleshooting.html
You will require cors headers anywhere if you are accessing something which is not in current domain name of website.
For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
More on CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
add a comment |
CORS Headers need to be added given at https://medium.com/@pongsakornsemsuwan/aws-s3-upload-with-react-dropzone-s3-uploader-a76021fe385
You will need to follow this https://docs.aws.amazon.com/AmazonS3/latest/dev/cors-troubleshooting.html
You will require cors headers anywhere if you are accessing something which is not in current domain name of website.
For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
More on CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
add a comment |
CORS Headers need to be added given at https://medium.com/@pongsakornsemsuwan/aws-s3-upload-with-react-dropzone-s3-uploader-a76021fe385
You will need to follow this https://docs.aws.amazon.com/AmazonS3/latest/dev/cors-troubleshooting.html
You will require cors headers anywhere if you are accessing something which is not in current domain name of website.
For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
More on CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
CORS Headers need to be added given at https://medium.com/@pongsakornsemsuwan/aws-s3-upload-with-react-dropzone-s3-uploader-a76021fe385
You will need to follow this https://docs.aws.amazon.com/AmazonS3/latest/dev/cors-troubleshooting.html
You will require cors headers anywhere if you are accessing something which is not in current domain name of website.
For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
More on CORS: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
answered Nov 13 '18 at 21:00
Saurabh NemadeSaurabh Nemade
1,108515
1,108515
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53288708%2fno-access-control-allow-origin-header-is-present-on-the-requested-resource-am%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
2
Have you added cors headers to s3? medium.com/@pongsakornsemsuwan/…
– Saurabh Nemade
Nov 13 '18 at 20:22
@SaurabhNemade is there's no other way to do it using react-s3? do I have to use the dropzone?
– Ahmed Maher
Nov 13 '18 at 20:26
It is possible to use react-s3. You will need to follow this docs.aws.amazon.com/AmazonS3/latest/dev/… Basically you will require cors headers anywhere if you are accessing something which is not in current domain name of website. For e.g, in this case from localhost domain name you are trying to access *.amazonaws.com Even if you use any other service cors need to enabled on them.
– Saurabh Nemade
Nov 13 '18 at 20:46
god it, thank you so much Saurabh! really appreciate it.
– Ahmed Maher
Nov 13 '18 at 20:56
if you don't mind writing it as an answer so I can mark it as aswered!:)
– Ahmed Maher
Nov 13 '18 at 20:57