How to fix CORS error in Angular 8 | CORS allow headers | Access-Control-Allow-Origin Error [SOLVED]

hello guys welcome once again and welcome to my channel today in this video we'll be talking about a problem which I am facing on my project the problem is regarding calls for Policy so how to solve this today I will showing you how you can solve this issue so let's just start with the video either up Namira channel go subscribe Nakia at the channel google subscribe or satis are the bible kiken is such a beam in I have build a loom up go notification your theory so guys basically I have been creating a project here and while calling a service I have already created a service let me show you so this is my service you can see here I have called GATT CMS data and I am sending some post data from here to this pole this service this API and I have consoled the error also so while I'm calling this service from my home component I am getting this error here you can see a XML HTTP request at this from origin this has been blocked by course policy so what is course policy cost policy stands for cross origin or so sober so basically the problem is because I am requesting you know to get data from another URL so that's why it's throwing error by default it has been blocked by the browser that you cannot you know get data from other server from other URL if you are using some another origin so basically you have to you have to you know enable this course for across the region and then only you will be able to you know get data from other server this is just because of you know security purpose so let me show you how you can fix this so for that what you have to do you have to just go to your API where you have you know been calling your API and then you will get a htaccess file here so in the as texas file you have to add few lines which i will be showing you so these three are be no important files I mean lines which you have to add in your SD Excel so whenever the you know APA will be called then this will allow enable the origin access and allow header access so what methods we will be using from angular pose cat of delayed and put we do not use option so you can remove this if you want so these four methods will be using from our angular project to get data off to update it how to delete data okay so guys here you can see here what I have written header set access control allow origin so star means this will allow all the you know URLs us from getting data if I want to get data from another URL it will be access you want a particular URL so then you have to you know provide a particular URL suppose you are using this so you have to just copy this and you have to just write here like this so only whatever request will be you know you requested from this URL will be accepted rest all will be you know throwing this at the same error you have to set the methods which all methods you will be using and then you have to set the headers to start so whenever I want to you know add any header I suppose I want to send a token for authorization of user so you know this will allow that I can use headers also so in this way the problem will be solved you have to just enter these three lines in your odorous takes as file where you have capital API so the API is inside madness so let me run and show you again now it won't it won't be throwing error so you can see how the error has been gone and if I again remove this if I again remove this and a click on Save button and if I run again then again it will throw the same error same calls error you can see here and this if I want to fix this you have to use these three line and I have been using ESP for my API API so so the problem has been solved you can see your data is coming success and sports is coming 200 so in this way you can solve this problem so that's all for today's video if you liked the video don't forget to hit the like button and don't forget to subscribe my channel if you have any query you can drop your comments below the video I will surely help you thanks for watching this video and bye for now [Music]

Channel: GSoft Knowledge

Views: 44,073

Keywords: gsoft knowledge, netbeans tutorials, java programming, programmingknowledge, java for beginners, jasper reports, Access-Control-Allow-Origin, The reason behind the silly CORS error!, Fix CORS errors in Angular (when you have access to API), cors error when using calling API, cors error send data in header, How to fix CORS error, Cross-origin resource sharing, How to fix Access-Control-Allow-Origin, Cross-origin Errors, angular tutorials, angular for beginners, calling a service

Id: f_KEL50cFxA

Length: 5min 4sec (304 seconds)

Published: Sun Jul 05 2020