Enable CORS dynamically by adding origins/domains from database in .NET CORE Web API 6.0

hey guys good morning welcome to negra techies this is our asp.net core tutorial version 6.0 so part of this video i'm going to explain how to enable cars and how to enable cars dynamically by adding origins from databases here i listed out all the topics we can go one by one the first step is we have to define our cars policy okay so basically we have to define our cars using two ways the first one is defining course file is using this default policy option and the second one is policy with name so let me go to my application so based on my last video already i am added one course policy here so this is our second option adding course policy using the name so that's what i have provided the name is policy one so now let me show you how to create the policy using this default option the steps are almost the same so instead of this ad policy we have to use add default policy so then we not required to provide any name at all okay once you added your course policy you have to add three more important things the first one is origin bulldog origins with so basically uh you have to use two options the first one is allow any arching that means there is no restriction any origin or any domain can access our services and the second one is with origins that means it has the restrictions so whatever domain value you are providing that domain only supposed to access our apa otherwise the car shares will throw okay so here i am going to provide 4 2 0 1 okay and if required i can include multiple domains also because it will take the string array so let me provide one more value four to zero two okay okay we have completed our first step so let me move on the second one methods so in this method also we have the two functions like first one is with methods so if you are providing some restriction based on the action method then you have to use this with methods otherwise you can choose this alloy any method okay the final one is header so here also i am going to select allow any header we have the options if required you have to use other than that it's fine okay it's fine so now we have two cars finalized now we need to enable the cars policies okay for enabling the cars policy we have the two options the first one is so in the absolute be how the option is use cars so in this used cars you have to provide the policy name so in case if you are trying to use the default policy then you don't provide any value okay this is the one way and the second one is you are enabling or disabling the cars in the specific controller or else in the particular methods then you have to go with an attribute options okay for that it would be how enable cars and also disable cars so we have the two options so let me explain little later so before that we have to verify this one so as of now we have enabled the default policy only okay so the default policy contents the domains are localhost four to zero one and also the four to zero to only so actually my application is currently running in the 4200 this is one of the angular application here i'm consuming the same services the kit method actually i'm consuming for loading all the products so let me check in the browser okay it's loaded fine the expected result is it should be populated or product information unfortunately it's not loaded way because the cars error so let me check in the console yes so it's blocking why because we not included this four two double zero in our cars policies so let me check yes actually we have included this fourth wcr in the policy one but we have enabled the default policy online so that's what we are getting this error so let me re-run my application now i am going to running in the port number of 420 okay our application currently re-running in the portrait 4201 so let me go to the home page okay currently our products are loaded why because our application is running in the port number four to zero one that we have included in our course policy as of now we have included all the origins in the hard-coded manner but here after we have to fetch all the values from our database for that i have one table so let me show you so this is my table i'm having three columns the first one is id rg name and deceptive okay so initially i have included two origins four to zero zero and four to zero only so instead of this hard code i'm going to get this database values for connecting to the databases i'm going to use the entity frameworks the entity framework setup was already there so you are able to see already i'm having one lan db context that i have registered in our services so let me try to access the same database contacts here click enter so builder dot services so here bold service provider so in this provider i am going to use get services option and our data type is lan db context okay now let me check it contains the data's or not it's already registered so definitely it is having the data the same time i am going to define on a list array also origin list now i am going to access our database so my table name is table origins here i am going to check the data server is active true only if origin data equal not equal to null also i'm going to check whether it's having the data or not so now i am having the list of origins data so let me include in the list so then item so item contains the object so here i'm going to use this rg name online okay now let me remove this hard coded data so instead of that i'm going to use this array i'm in this list so actually we need to convert in the array format that's it so now we can verify first let me run the application okay our application is running now let me go to my angular application so still it's running in the four to zero one only so let me refresh it see now it's working fine okay so now let me try to change the port number ng serve and my port is 4203 okay now we have changed the port number so let me go to the browser once again okay the browser also i just changed the port number so let me repress it see now the data is not loaded so let me check in the console hopefully we are getting this cars error because we not included this 4203 in our domain section so let me go to the database here i am going to include one more rg name 4203 and this one also true okay so here after we don't have any code changes in our application i mean our ap application but we have to restart our application okay that is the important thing because this initiation of middleware is the one-time process the application starting time only it will do so for every time it's not going to check that's what we are just restarting so in case if you are hosted in the server also you just restart it after including the values okay our application is running now so we have to refresh our angular app also okay great the datas are loaded fine so now let me go to my topics list okay we have defined our course policy using the default policy and also policy with the name and we have loaded the origins from our databases so let me mark both our gets completed okay the final one is cars attribute okay so basically this cars attribute is used for enabling or disabling the cars for the specific controller or action methods so in our application currently we have enabled the cross globally so it should be applicable for whole application that means whatever controllers we have this should be applicable for commonly okay so here after i am going to enable or disable for the specific controller so let me go to my product controller first i am going to use this enable cars so if you want use this enabled cars you have to include this namespace microsoft dot asp net core dot cars so in case you are using the lower version of a dotnet core you have to install this package manually so if you are using the version of 6.0 it's defaultly it's installed so not required to install once again you have to use the namespace that's fine so here we have to provide our attribute name so the attribute name is nothing but this enable cars okay so if i'm providing like this it will take the default policy so because i'm not provided the policy name so now i'm going to use the policy name so let me take this one okay we have included the policy and also in the database side i'm going to change this one into 402 so that means our default course does not have this 420 okay so let me rerun my application once again so now let me go to my angular application it's not loaded so again we are getting this cars error so if you checked in this application so globally we have enabled this default cars only in the default cars it's loaded from our databases here we are able to see the origin of 4203 but we have enabled cars for our product controller individually using this enable course policy so if you checked in this policy one it contains the origin is four two double zero only so that's what we are getting this cars error so let me stop and re-run my angular application okay fine so let me check in the browser here i'm going to change the port number 4 to w0 so let me refresh it so it will work so the datas are loaded fine so let me go to the topics so we have completed this enabled cars okay the final one is disabled cars or basically this attribute is used for disabling the cars from swelty so let me go to my application so in the product controller i want to remove the cars from schwalte so currently i'm having this enabled car so i have included the policy so let me remove everything so if i'm removed this one so it will defaultly taking the global course policy that means our default policy okay that's what we have enabled here so avoiding this one will be how to use the disabled cars option okay okay use this disabled cars and also let me go to my program.cs i'm going to use our policy one as the global one okay well soon this is also done so let me run the application so let me go to the browser of our angular application i'm going to refresh this work so the data's are not loaded because we have disabled the cars in our product controller so in case if i am trying to remove this one so then it will take the default car's policy so the default course policy also nothing but our policy one only if we are running this one hopefully it will work so let me refresh our application one second so see now the datas are loaded it's working fine so now we are in the almost end of our video so before closing this one i hope to provide some details so we have defined one default policy and also one named policy the similar way we have to define n number of named policies okay and for enabling also we have to use the different policies so as of now i just use this policy one the similar way if required i have to use both options also it will work fine okay and uh just to consider the scenario you have the three policies uh you want to use three policies for the different controllers that time also you can use so it will work so now let me go to the topics so we have completed this disabled course also still if you have any doubts or clarification please post in the comment box and also please don't forget to subscribe my channel thank you thanks for watching we can see one of the interesting top in our next video

Channel: Nihira Techiees

Views: 4,622

Keywords: How to enable CORS in .NET CORE Web API 6.0, What is CORS in Web API, why we need to enable CORS, What is cors policy, how to resolve cors issue in Angular dot net core, Dot Net Core Tutorial, cross orgin resource sharing, enable cors dynamically by adding domains from database, how to enable cors dynamically in asp.net core 6, load origins from database in cors, enable and disable cors using attributes in asp.net core 6.0, how to add cors policy using add default policy option

Id: 3c3TkULcLR8

Length: 18min 3sec (1083 seconds)

Published: Mon Aug 01 2022