XMLHttpRequest cant load - angularjs

How to come up this error,
XMLHttpRequest cannot load http://samples.openweathermap.org/data/2.5/forecast?appid=bXXXXa1&q=London,us. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.
The application is building up in AngularJS and server is created through gulp-connect.
even not sure, this will fix in AngularJs file or in gulp :(

You need to add this headers on server side
Access-Control-Allow-Headers: Content-Type
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Origin: *

Related

why blocked by CORS policy even after 'Access-Control-Allow-Origin':'*'

I have flask api(http://127.0.0.1:5000/out/) which return the json. Angular js is http://localhost:4300 also running
I have added the extension Moesif Orign & CORS Changer and switched on also 'Access-Control-Allow-Origin':'*'
Error is below
Access to XMLHttpRequest at 'http://127.0.0.1:5000/out/' from origin 'http://localhost:4300' 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.
Already gone the link Why does my JavaScript code get a "No 'Access-Control-Allow-Origin' header is present on the requested resource" error when Postman does not?
fix with below code
from flask_cors import CORS, cross_origin
cors = CORS(app, resources={r"/api/*": {"origins": "*"}})
#cross_origin(origin='*')

Enable the cors in opendsitro for elasticsearch

I installed opendistro for elastic search using docker and tried to fetch the information from opendistro kibana portal using react js, but I am getting an error about cors (Access-control-allow-origin):
Access to fetch at 'https://example.com/api/v1/auth/authinfo' from origin 'http://example.com:3000' has been blocked by CORS policy: 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.
then added a few lines in elasticsearch.yml file:
opendsitro_security.http.cors.enabled : true
opendsitro_security.http.cors.allow-origin: "*"
opendsitro_security.http.cors.allow-methods: OPTIONS, HEAD, GET, POST, PUT, DELETE
opendsitro_security.http.cors.allow-headers: X-Requested-With,X-Auth-Token,Content-Type,Content-Length
opendsitro_security.http.cors.allow-credentials: true
but still, I am getting the same error. My doubt is there any other way to enable cors in opendsitro for elastic search.

CORS error when updating a contact in Stamplay

When calling
JavaScript
Stamplay.Object('contact').update()
I'm getting this error:
JavaScript
PUT https://myappid.stamplayapp.com/api/cobject/v1/contact
index.html:1 XMLHttpRequest cannot load https://myappid.stamplayapp.com/api/cobject/v1/contact.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'https://www.example.com' is therefore not allowed access.
The response had HTTP status code 404.
You need CORS support in the response of https://myappid.stamplayapp.com/api/cobject/v1/contact which means the HEADER should contain something like the following line:
Access-Control-Allow-Origin: https://www.example.com

XMLHttpRequest cannot load in angular

I couldn't call my service which gives an error
index.html:1 XMLHttpRequest cannot load http://localhost:14652/api/Employee. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:1873' is therefore not allowed access.
What should i do?
Your browser won't let you make this request because the Access-Control-Allow-Origin (necessary for a cross-domain request) is missing in the header of whatever send your api, if you just want to make some tests you can disable it on your browser by launching it with the following flags:
google-chrome --disable-web-security --allow-file-access-from-files
But you should really read this : http://www.eriwen.com/javascript/how-to-cors/ and have cors working on your server

Laravel API and Access Control Allow Origin

I am working on a Laravel API, and a angularJS front end application.
I am trying to make request against my API but I keep having problems with this message in my Google Chrome Console:
XMLHttpRequest cannot load http://larashop.dev/api/authenticate. Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response.
Here is a screenshot from my network tab with the response header:
So, I don't understand because I can see the "Access-Control-Allow-Origin:*". Here is my .htaccess file on my server:
<IfModule mod_headers.c>
Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"
</IfModule>
I really don't know where to look at to solve the problem. What do I miss?
I also use satellizer with Angular in order to handle authentication
Thanks for the help :)

Resources