Upload image to imgur failed because of cors - javascript

I'm trying to upload an image to imgur with js (browser) and get a CORS error:
Access to XMLHttpRequest at 'https://api.imgur.com/3/upload' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
But preflight request contains Access-Control-Allow-Origin header:
The request itself:
What I'm missing? this is because access-control-allow-credentials set to true?

The problem was with their API Docs :\
The URL is: https://api.imgur.com/3/image and not https://api.imgur.com/3/upload as said here: https://apidocs.imgur.com/#c85c9dfc-7487-4de2-9ecd-66f727cf3139

according to doc https://api.imgur.com/3/upload doesnt have necessary
header ,
but on the right side ,the curl example use https://api.imgur.com/3/image has Access-Control-Allow-Origin header
and somehow they will check your referer, which means if you are in develop mode like webpack dev mode use localhost:8000 it will always return 429 too many request exception

Related

Loading .fbx file from URL – Is that possible?

I worked with this:
https://threejs.org/examples/webgl_loader_fbx.html
If I replace »models/fbx/Samba Dancing.fbx« with »https://github.com/mrdoob/three.js/raw/master/examples/models/fbx/Samba%20Dancing.fbx«, the code stops working.
It's important for me to load the .fbx file from an other webspace. Is there a way to fix this problem?
Thanks!
Your URL does not work because of the CORS policy. Chrome for example reports the following error in the browser console:
Access to XMLHttpRequest at 'https://github.com/mrdoob/three.js/raw/master/examples/models/fbx/Samba%20Dancing.fbx' from origin 'http://localhost:8080' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'https://render.githubusercontent.com' that is not equal to the supplied origin.
Try it with this URL instead which has the required HTTP header set:
https://threejs.org/examples/models/fbx/Samba%20Dancing.fbx

How to fix the "set the request's mode to 'no-cors'" error?

I am currently using yahoo weather api to fetch weather data. I am getting below error. Please help.
Access to fetch at 'https://weather-ydn-yql.media.yahoo.com/forecastrss?location=sunnyvale,ca&format=json' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
I have tried to do google, but none of solution worked for me
You can set the request mode to 'no-cors' like so:
fetch(url, {
mode: "no-cors",
...
})
But, as goto1 described in the comment below, it will usually not be the solution you are looking for (see his comment on how to properly work with CORS).
No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled
So, First of all you have to change your CORS from browser :
Here is the Link of that , download it and it will install by it self.
visit:https://chrome.google.com/webstore/detail/moesif-origin-cors-change/digfbfaphojjndkpccljibejjbppifbc?hl=en-US
Name : Moesif Origin & CORS Changer
NOTE: Make sure it turns ON while you running your page.

XMLHttpRequest blocked by CORS Policy

I add an API with following script in let's say http://www.test.com:
<script src="http://apiendpoint.com/api/v1/api.js"></script>
<div id="api" data-apikey="LA59CJI9HZ-KIJK4I5-3CKJC"></div>
api.js
$(function () {
apikey = $('#api').data('apikey');
$("#api").load("http://apiendpoint.com?apikey=" + apikey);
})
When I load the page, I get following error:
XMLHttpRequest cannot load
apiendpoint URL.
Redirect from
'apiendpoint URL' to
'apiendpoint URL' has
been blocked by CORS policy: No 'Access-Control-Allow-Origin' header
is present on the requested resource. Origin
'test URL' is therefore not allowed access.
In the path of apiendpoint.com I added in .htaccess following code:
Header set Access-Control-Allow-Origin "*"
But it does not work.
I believe sideshowbarker 's answer here has all the info you need to fix this. If your problem is just No 'Access-Control-Allow-Origin' header is present on the response you're getting, you can set up a CORS proxy to get around this. Way more info on it in the linked answer
I know this might be late, but hope this will help others. This problem comes from backend side, call CORS. I'm using java for backend so I added#CrossOrigin to Controller class. It works!

No 'Access-Control-Allow-Origin' for 2 different domains or sub-domains CORS issue

There are a lot o topics about 'Access-Control-Allow-Origin', but I couldn't find one for Openseadragon which is for sub-domain name. My website is exampple.domain.com trying to open DZI from anotherexampple.domain.com and I have an error:
XMLHttpRequest cannot load anotherexampple.domain.com/123.dzi.
No 'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'exampple.domain.com' is therefore not
allowed access.
Both websites are using the same protocol HTTPS, and server is IIS
Server for exampple.domain.com is set up with:
Access-Control-Allow-Origin: *
And server for anotherexampple.domain.com is set up with:
Access-Control-Allow-Origin: *.domain.com
Also, openseadragon has settings:
crossOriginPolicy: 'Anonymous',
ajaxWithCredentials: false,
Can somebody tell me how to fix CORS issue for same domain with different sub-domains? Thanks in advance.
Access-Control-Allow-Origin: *.domain.com
The Access-Control-Allow-Origin header doesn't support partial wildcards.
Either use * or the full origin name.
You can read the Origin request header, pattern match it, and then echo it out on the server if you want to whitelist everything on a particular domain.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
You might have tried to set the Access-Control-Allow-Origin header, but it clearly hasn't worked. You need to reexamine your configuration.
This link has a nice explanation for possible values for 'Access-Control-Allow-Origin'. unfortunately you do not have much options, other than '*' or single domain like 'http://example.com'
https://www.moesif.com/blog/technical/cors/Authoritative-Guide-to-CORS-Cross-Origin-Resource-Sharing-for-REST-APIs/

Parse JSON to HTML with jquery

I need to parse this JSON link
http ://www.mse.mk/FreeMseFeeds/service/FreeMSEFeeds.svc/ticker/JSON/9538ac69-2c99-45ba-bbd4-90931ca0cc7d
to be same like on this page:
http ://www.mse.mk/en/
image:
http: //tinypic.com/r/1zlyhwo/8
I've tried like this:
$.getJSON("http://www.mse.mk/FreeMseFeeds/service/FreeMSEFeeds.svc/ticker/JSON/9538ac69-2c99-45ba-bbd4-90931ca0cc7d",function(data){
alert(data[0].name);
});
I got this error:
XMLHttpRequest cannot load
http:// www.mse.mk/FreeMseFeeds/service/FreeMSEFeeds.svc/ticker/JSON/9538ac69-2c99-45ba-bbd4-90931ca0cc7d.
No 'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http: //kristijanz.com' is therefore not allowed
access.
Any help ?
Looks like a CORS issue - your application calling www.mse.mk/FreeMseFeeds/service/FreeMSEFeeds.svc/ticker/JSON/9538ac69-2c99-45ba-bbd4-90931ca0cc7d is not running in the same domain.
If you control the service, you can implement CORS to allow other domain origins.
If you do not, you cannot call this service from your domain.
CORS - https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

Categories