18

I want to:

  • Distribute the static part of the website (html, css, js) on my domain www.example.com.
  • Put API Gateway services on my domain under a folder, www.example.com/v1.

How do I accomplish this?

In route 53, from what I understand I can only point to one cloudfront distribution, so I am choosing my S3/CloudFront enabled bucket.

So, the end result should be, in order of priority/mapping:

  • www.example.com/v1/* <-> API Gateway <-> Lambda <-> DynamoDB
  • www.example.com/* <-> CloudFront <-> S3 bucket contents

In what way can I achieve this? And if not, what are my alternatives since I need to bend to the same origin principle requirement in web browsers.

Wrench
  • 4,070
  • 4
  • 34
  • 46

1 Answers1

20

You would setup CloudFront with two origins, S3 and API Gateway, and configure CloudFront to use the API Gateway origin for all requests that start with /v1

Mark B
  • 183,023
  • 24
  • 297
  • 295
  • Yes, the problem is that my APIs are not showing up in the list, when adding an origin. AM I missing a step here after my API Gateway services has been deployed? – Wrench Mar 15 '17 at 19:26
  • What list? You would need to add it as a custom origin. – Mark B Mar 15 '17 at 19:37
  • 3
    Yes, sorry. Some resources appears in an auto completion list, my APIs were not. Pasting it in worked. Thank you. – Wrench Mar 15 '17 at 19:38
  • 1
    Has anyone seen decent documentation / tutorial on this? My API origin is not configured right and I haven't found any references. – openwonk Apr 23 '19 at 09:06
  • @Wrench by pasting it in, what did you paste in exactly? restApiId? service? – a11hard Oct 01 '19 at 23:55
  • It's the invokeURL https://aws.amazon.com/premiumsupport/knowledge-center/api-gateway-cloudfront-distribution/ – a11hard Oct 02 '19 at 00:04
  • make sure the path uses a wildcard. E.g. /v1/* – a11hard Oct 02 '19 at 01:25