i am struggling with the following problem. I created a simple webapp that sends via JavaScript „GET“ Operations to a other server.
So the problem is my app is hosted lets say on www.webapp.com/WebContent and the webapp itselfes consumes Data services. This OData Services are hosted on another system www.sap.universityber.com/opu/… so when I want to run the app locally with the reverse proxy (apache) and disable the security settings in chrome everything works fine. But when I want to run it from a normal browser without reverse proxy and the chrome settings it says „NO DATA“, Reason -> CORS.
Can somebody in this forum tell me how such a CORS- Enablement work maybe with an example code?
Please help.
Thanks
Enabling CORS would need to be done by www.sap.universityber.com/opu/, not in your web app. If it's an open API, they may offer a JSONP alternative (JSONP isn't subject to the Same Origin Policy, it does an end-run around it, but it also needs the cooperation of the server providing the content).
In short, you have to specify in your header that you accept requests from other domains. An in-depth read https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
A brief example:
Access-Control-Allow-Origin: http://mozilla.com
Do note that this has some implications for your security.
If you own the another system (www.sap.universityber.com/opu/), then you need to set the following response headers in the response from this system for every request:
'Access-Control-Allow-Origin': "www.webapp.com/WebContent",
'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE,OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type'
Related
i am making a application by using REST API. the api provide me data but browser block for CORS policy. is it possible solve the issue from client side. or need to work at serve. i have try some nodejs package like cors-anywhere but still having issue
It is not possible to solve for good, because it is handled by server to control the origin request (The origin of the request(client) and the server must be in the same origin). But while you are developing you can use cors chrome extension, it will allow you to make the requests.
Chome extension.
Hope it helps.
My environment is Nodejs, and I want to make request(http) to api in the internet.
But there are some problems, after using webpack, the console would show me cross
domain error. I guess it is because my api and webpack-server have diffrent in
port. What should I do to solve the problem.
The issue you are experiencing is caused by the server not properly sending a CORS header to allow the request.
If the API is one of your own, you can enable CORS on your server for one, many, or all domains that attempt to access the API. How to do this depends on your server configuration.
If the API is provided by someone else, you may need to contact them or consult their documentation on how to perform a CORS request to their services.
I'm using an API from JIRA to get some information on bugs. Here's an example of the JQuery I'm using to get it:
var endpoint = 'https://jira.cyanogenmod.org/rest/api/latest/issue/CYAN-2631';
$.get(endpoint, function(data) {
do_stuff(data, data['fields']['project']['self']);
});
And, I'm getting the ever-terrible Access-Control-Allow-Origin error. It looks like this:
XMLHttpRequest cannot load
https://jira.cyanogenmod.org/rest/api/latest/issue/CYAN-2631.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://127.0.0.1:8000' is therefore not allowed access.
I'd really like to use this API if possible. Following the directions on this question didn't help. I got another error,
GET https://jira.cyanogenmod.org/rest/api/latest/issue/CYAN-2631callback=jQuery172039181585889309645_1431307158851?_=1431307165515
Seems to be a Jquery error, so I don't think that's the right approach. Maybe the server doesn't allow for jsonp.
Anyway, does anyone have a way around this or can I just not use this particular API? Thanks
There is no way to enable cross origin requests entirely from the browser without external code. If there was, it would entirely defeat the purpose of the security protections in the first place.
When using a browser, it is the server that decides if it wants to support cross origin requests or not and what domains it wants to support requests from. You cannot bypass it in the client.
The choices are:
Server enables CORs access from your domain or all domains.
Server supports JSONP allowing you to use it to work-around the cross origin access.
You create your own server proxy where you make a request from the browser to your own server (which would either be same origin or have CORS enabled), then your own server gets the data from the other site and returns it back to the browser. Servers are not limited by the same origin limitations as this is a security feature built into browsers only.
You find some third party proxy service that you can use to serve the same purpose as option #3.
FYI, a Google search turned up this article about enabling CORS on the API: https://answers.atlassian.com/questions/69356/cross-origin-resource-sharing-with-jira-rest-api-and-javascript. I don't understand enough about the service to quite follow the article, but maybe it points you in a helpful direction.
H-i, short answer is "yes".
The medium answer is "enable CORS on your application SERVER"
The long answer is here: http://enable-cors.org/
At some point you'll encounter the concept of a "pre-flight request", and you'll probably get confused.
That's because it's confusing, stupid, and poorly engineered. Just keep on going.
The easiest way to enable CORS is at your webserver (nginx or apache), although, you can enable it in the application itself.
The http://enable-cors.org/ site lists configurations for a variety of web servers and application stacks.
Good luck!
I am developing applications using Angular and the client side is 100% JS. I am about to replace an old application made using ExtJS but I will not change the server-side. Only the client-side be re-coded from scratch.
I would like to work on this project from anywhere and any machine but I need to be able to perform cross-domain AJAX queries with the original server (server-side is ASP.NET MVC with IIS and I don't want to install Windows + everything on all the computers I use). Is there a way to do this easily?
Thanks for your ideas!
PS: JsonP is not a solution for me.
Couple of things:
At the end of the day you have to enable CORS in your server.
You can use a CORS proxy https://github.com/gr2m/CORS-Proxy for development. This proxy will actually change the request header of X-Origin which browsers even can but "won't" because of policy. So you will be able to make Cross Origin Requests.
If neither JSONP nor CORS are availble to you as options then you will have to take help of server side scripting.
You can create a method in your server side code and get the response from desired cross domain url and return the response to your javascript function.
You can use CORS (Cross Origin Resource Sharing)
I have setup FineUploader on a site and I included a check box that allows users to upload files using HTTPS if the want to.
Unfortunately if the user accesses the site using http and then tries to use ssl it errors out, I assume because of CORS issues. I assume it is a CORS issue because if I access the site using https and try to upload using ssl it works fine.
I found some documentation about enabling CORS support, but it appears that you either need to make it so only CORS requests will be made or none will be made. In my situation there will be CORS request some times and not others.
Does anyone know of a good work around for this? Should I just reload the entire page using HTTPS when the checkbox is clicked?
If you're uploading straight to Amazon s3, see the note in the official docs, "SSL is also supported, in which case your endpoint address must start with https://" in the script within your uploaderpage.html file.
request: {
endpoint: 'https://mybucket.s3.amazonaws.com',
// Note that "https://" added before bucket name, to work over https
accessKey: 'AKIAblablabla' // as per the specific IAM account
},
This will still work if uploaderpage.html is served over http (or you could populate the endpoint value dynamically if you need flexibility re endpoint).
This will help you avoid the mixed content error when uploading over https, "requested an insecure XMLHttpRequest endpoint", which happens if the page is https but you request a http endpoint.
Just to reiterate what I've mentioned in my comments (so others can easily see this)...
Perhaps you can instantiate Fine Uploader after the user selects HTTP or HTTPS as a protocol for uploads. If you must, you can enabled the CORS feature via the expected property of the cors option. Keep in mind that there are some details server-side you must address when handling CORS requests, especially if IE9 or older is involved. Please see my blog post on the CORS feature for more details.