CORS and adding headers

Practical Serverless Development for Beginners Bonus Lecture - Using your APIs in your front-end app
3 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$49.99
List Price:  $69.99
You save:  $20
€46.60
List Price:  €65.24
You save:  €18.64
£39.85
List Price:  £55.79
You save:  £15.94
CA$68.41
List Price:  CA$95.78
You save:  CA$27.37
A$76.53
List Price:  A$107.15
You save:  A$30.61
S$68.03
List Price:  S$95.25
You save:  S$27.21
HK$390.80
List Price:  HK$547.16
You save:  HK$156.35
CHF 45.55
List Price:  CHF 63.78
You save:  CHF 18.22
NOK kr550.70
List Price:  NOK kr771.03
You save:  NOK kr220.32
DKK kr347.59
List Price:  DKK kr486.66
You save:  DKK kr139.06
NZ$84.03
List Price:  NZ$117.65
You save:  NZ$33.61
د.إ183.60
List Price:  د.إ257.05
You save:  د.إ73.45
৳5,487.36
List Price:  ৳7,682.75
You save:  ৳2,195.38
₹4,170.67
List Price:  ₹5,839.27
You save:  ₹1,668.60
RM238.57
List Price:  RM334.02
You save:  RM95.45
₦66,243.24
List Price:  ₦92,745.84
You save:  ₦26,502.60
₨13,919.64
List Price:  ₨19,488.62
You save:  ₨5,568.97
฿1,852.73
List Price:  ฿2,593.98
You save:  ฿741.24
₺1,618.89
List Price:  ₺2,266.58
You save:  ₺647.68
B$255.86
List Price:  B$358.23
You save:  B$102.36
R934.26
List Price:  R1,308.04
You save:  R373.78
Лв91.20
List Price:  Лв127.69
You save:  Лв36.48
₩68,991.47
List Price:  ₩96,593.58
You save:  ₩27,602.11
₪187.21
List Price:  ₪262.11
You save:  ₪74.89
₱2,883.99
List Price:  ₱4,037.82
You save:  ₱1,153.82
¥7,844.28
List Price:  ¥10,982.62
You save:  ¥3,138.34
MX$849.16
List Price:  MX$1,188.90
You save:  MX$339.73
QR182.39
List Price:  QR255.36
You save:  QR72.97
P685.83
List Price:  P960.21
You save:  P274.38
KSh6,625.24
List Price:  KSh9,275.87
You save:  KSh2,650.62
E£2,395.76
List Price:  E£3,354.25
You save:  E£958.49
ብር2,870.01
List Price:  ብር4,018.25
You save:  ብር1,148.23
Kz41,742.64
List Price:  Kz58,443.04
You save:  Kz16,700.40
CLP$47,160.37
List Price:  CLP$66,028.30
You save:  CLP$18,867.92
CN¥361.90
List Price:  CN¥506.69
You save:  CN¥144.79
RD$2,925.21
List Price:  RD$4,095.54
You save:  RD$1,170.32
DA6,709.48
List Price:  DA9,393.81
You save:  DA2,684.33
FJ$113.15
List Price:  FJ$158.42
You save:  FJ$45.27
Q388.57
List Price:  Q544.03
You save:  Q155.46
GY$10,460.61
List Price:  GY$14,645.70
You save:  GY$4,185.08
ISK kr7,004.59
List Price:  ISK kr9,806.99
You save:  ISK kr2,802.40
DH506.05
List Price:  DH708.51
You save:  DH202.46
L882.28
List Price:  L1,235.26
You save:  L352.98
ден2,874.42
List Price:  ден4,024.43
You save:  ден1,150
MOP$403.10
List Price:  MOP$564.37
You save:  MOP$161.27
N$937.41
List Price:  N$1,312.44
You save:  N$375.03
C$1,849.89
List Price:  C$2,589.99
You save:  C$740.10
रु6,678.31
List Price:  रु9,350.18
You save:  रु2,671.86
S/187.13
List Price:  S/262
You save:  S/74.86
K190.39
List Price:  K266.57
You save:  K76.17
SAR187.48
List Price:  SAR262.49
You save:  SAR75.01
ZK1,332.51
List Price:  ZK1,865.62
You save:  ZK533.11
L231.86
List Price:  L324.62
You save:  L92.76
Kč1,172.97
List Price:  Kč1,642.25
You save:  Kč469.28
Ft18,205.74
List Price:  Ft25,489.50
You save:  Ft7,283.75
SEK kr547.93
List Price:  SEK kr767.15
You save:  SEK kr219.21
ARS$43,829.95
List Price:  ARS$61,365.44
You save:  ARS$17,535.49
Bs346.26
List Price:  Bs484.79
You save:  Bs138.53
COP$194,628.58
List Price:  COP$272,495.59
You save:  COP$77,867
₡25,090.62
List Price:  ₡35,128.88
You save:  ₡10,038.25
L1,234.87
List Price:  L1,728.92
You save:  L494.05
₲372,339.59
List Price:  ₲521,305.22
You save:  ₲148,965.63
$U1,915.65
List Price:  $U2,682.06
You save:  $U766.41
zł201.49
List Price:  zł282.11
You save:  zł80.61
Already have an account? Log In

Transcript

Little bit about course, since we are now using all those endpoints. Now, if you try to run your Angular seven app, except localhost like we are using local IP address to run this application, it won't load. Let's investigate it using developer tool. And what's what's happening here. And we see the request access XML HTTP request, which is calling all those endpoints are getting blocked by cause policy, so it says no access control allow origin header is present on the requested resource. So since earlier, we were running the app using local hosts, so it was fine.

Now we are not using local host any more button local IP address to run the app. So let's let's examine lambda function and What What is missing VPC our lambda we haven't defined any cost policy here. So, what you have to do is you have to add a cross origin policy here. So, for the sake of convenience and you can actually use a lot of access control allow origin and course policy in this context what we are going to do is allow all the origins to localhost any IP address or any user can access our endpoint. You can choose to block your access by domain name or IP address. So a specific domain name or specific IP address can only use your endpoints and we can configure that but for the simplicity purpose, we are going to configure and allow all the origins so start.

Now once we have saved this lambda function, we are going to run the app again. And once we run the app again, we see that error has gone. And now we are able to load and use our endpoint successfully. So a little bit and if you are having the same problem, you need to update all your lambda functions with cost policy. Now, a little bit about the cross origin resource setting. So course, is just it's a kind of mechanism where you allow your incoming requests.

So it can be your domain, it can be your s3 bucket, it can be you know, your any, any other front end application. So it just runs on request response model of just just a couple of other jargons pre flight request pre flight response. But those endpoints actually allow on the base of the cost policy and if you haven't got your costs sorted out, you might run into this course issue. So, in the future just remember this. It's a it's a big topic in itself. But let's let's not worry about this at this point of time.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.