[Vuejs]-Calling cross domain requests from almost static site

2👍

If you choose AWS platform, you can use S3, CloudFront, Route53, API Gateway and Lambda to accomplish your goal.

Step01

  • Create a S3 bucket and upload your frontend vueJs code
  • Enable Static Web Hosting onto your bucket from S3 properties
  • Create a CloudFront distribution
  • Create a CloudFront origin pointing to your s3 bucket url (you have to add static website url of the s3 bucket)
  • Set the default behaviour pointing to S3 orgin ID

Step 02

  • Create your lambda function

  • Create a API gateway

  • Add new resource (GET/POST) pointing to your lambda

  • Deploy your API

  • Go back to the CloudFront distribution and add a origin pointing to your API Gateway

  • In the behaviour tab, create a new behaviour eg: (/checkUrl) and point it to the OriginId of the API Gateway

Step 03

  • Goto Route53 and create a new Hosted Zone
  • Set the NS records of the hosted zone in your domain configuration
  • Create a new record set (eg: www.webapp.com) and point it to the DNS of your CloudFront distribution
  • Update your CloudFront distribution’s Alternate Domain Name to www.webapp.com
👤Manoj

Leave a comment