I have an API Gateway in AWS that calls a a lambda function that returns some html. That html is then properly rendered on the screen but without any styles or js files included. How do I get those to the client as well? Is there a better method than creating /js and /css GET endpoints on the API Gateway to go get those files? I was hoping I could just store them in S3 and they'd get autoloaded from there.
1
-
AWS Service Proxy looks like what I want. Can't seem to get the correct combination of settings when creating it though.Scott Decker– Scott Decker2016-01-20 22:42:58 +00:00Commented Jan 20, 2016 at 22:42
Add a comment
|
2 Answers
Store them on S3, and enable S3 static website hosting. Then include the correct URL to those assets in the HTML.
5 Comments
Scott Decker
blocks it because it's from a different domain that isn't served over https
Mark B
That's an entirely different issue from what you posted in your original question. You need to enable CORS on the S3 bucket docs.aws.amazon.com/AmazonS3/latest/dev/cors.html
Scott Decker
Just added a CORS rule to the bucket allowing my API Gateway domain to GET resources from bucket. I still get "Mixed Content: The page at 'blahblah.execute-api.us-west-2.amazonaws.com/test/dashboard' was loaded over HTTPS, but requested an insecure stylesheet 'my-bucket.s3-website-us-west-2.amazonaws.com/css/…'. This request has been blocked; the content must be served over HTTPS."
Mark B
Obviously you need to use the HTTPS URL that S3 provides for your static assets instead of the HTTP URL to get past that error. You can see what this is by going into the S3 console, viewing the properties of one of your static files, and viewing the "Link" property.
Scott Decker
thanks! I didn't know each file had it's own https address; thought I only had the http address of the bucket. Also, you don't have to enable S3 static website hosting or have the CORS enabled for this to work. You only need the https address
I put in the exact address of each js/css file I wanted to include in my html. You need to use https address, not the http address of the bucket. Each file has it's own https address which can be found by following Mark B's instructions above. Notably, going through the AWS admin console, navigate to the file in the S3 bucket, click the "Properties" button in the upper right, copy the "Link" field, and post that into the html file (which was also hosted in S3 in my case). Html looks like this:
<link href="https://s3-us-west-2.amazonaws.com/my-bucket-name/css/bootstrap.min.css" rel="stylesheet">
I don't have static website hosting enabled on the bucket. I don't have any CORS permissions allowing reading from a certain host.