AWS SAM lambda

Static Web hosting using s3 and Proxy Integration using AWS SAM

What if you have been asked to integrate UI with API Gateway with lambda? You will suggest that the UI server should host on a different machine (which is domain itself) and API Endpoints’ call made from there. If you have gone through our CORS with AWS Lambda tutorial then, you will understand that it is the case of CORS. Now you might think that using cors with AWS lambda can be easily handled. I agree. But you will have to put extra efforts to secure your backend from malicious requests. To avoid extra security measures for your applications, it is easy to have UI and backend in the same domain. But how?

It is two steps procedure. First, host your UI server (we will use the s3 bucket in our case) and integrate your UI server path using API Gateway’s HTTP proxy integration option. We will see how to host static web content using the s3 bucket. It is a very simple procedure. Below are the steps.

  • Compile your UI code using your package manager or build lib.
  • Create an s3 bucket and upload your code.
  • Select bucket and go to Edit public access settings.
  • Uncheck Block public access and confirm it. (because you need to allow read requests on this bucket)
  • Go to Properties tab, select permissions. Select the bucket policy. Now to add read access to bucket objects. Copy-paste below policy and modify the below-mentioned are.
{
   "Version":"2012-10-17",
   "Statement":[{
 	"Sid":"PublicReadForGetBucketObjects",
            "Effect":"Allow",
 	 "Principal": "*",
             "Action":["s3:GetObject"],
             "Resource":["arn:aws:s3:::<your-bucket-name>/*"
       ]
     }
   ]
 }
  • Now go to Properties select static web hosting, and provide your UI’s index document name which is going to be an entry point for your application.

Now you can hit the endpoint mentioned there to check it running successfully or not.

The remaining part is http_proxy integration with API Gateway. You can log in to AWS Console and go to API Gateway service and can create http_proxy integration manually. But we will do it with AWS SAM (Serverless Application Model) template. To understand what is HTTP proxy integration is, here is the explanation from AWS docs.

“In HTTP proxy integration, API Gateway passes the client-submitted method request to the backend. The request data that is passed through include the request headers, query string parameters, URL path variables, and payload. The backend HTTP endpoint or the web server parses the incoming request data to determine the response that it returns. HTTP proxy integration makes the client and backend interact directly with no intervention from API Gateway”.

Resources:
   DemoLambda:
     Type: AWS::Serverless::Function 
     Properties:
       FunctionName: DemoLambdaFunction
       CodeUri: HelloLambda.zip
       Handler: resource/demo_handler.lambda_handler
       Runtime: python3.7
       Role:”<ARN OF AWS ROLE>”
       Environment:
         Variables:
         PYTHONPATH: "/var/task/” #add your folder after this
       Events:
         Ping:
         Type: Api
         Properties:
         Path: /demo/api/ping
         Method: get
         RestApiId:
         Ref: DemoAPIResources
    OneDiscoverAPIResources:
     Type: AWS::Serverless::Api
     Properties:
        StageName: dev
        DefinitionBody:
          swagger: '2.0'
          info:
          title: OneDiscover API
          description: OneDiscover API version 1
          version: "2.0.0"
          host: execute-api.us-east-1.amazonaws.com
	  schemes:
	  - https
	  - http
        produces:
          - application/json
          paths:
          /demo/api/ping:
        get:
          summary: Ping API
   	  description: Ping API
          x-amazon-apigateway-integration:
          type: aws_proxy
          uri:
          Fn:Sub: "arn:aws:apigateway:${AWS::Region}:lambda:path/2015-03-31/functions/${DemoLambda.Arn}/invocations"
          httpMethod: post
  	  passthroughBehavior: when_no_match
          /:
        get:
   	  summary: Http Proxy Integration
        description: Http Proxy Integration
          x-amazon-apigateway-integration:
          type: http_proxy
          uri: "<website endpoint from s3 static hosting>"
          httpMethod: any
          passthroughBehavior: when_no_match

Here, Outsource Java Development Company show two types of API gateway integration. Apart from HTTP proxy integration which we have seen is aws_proxy integration. In this type of integration, your API gateway endpoints attached to your lambda. So API gateway passes requests to your lambda and responds to the caller as expected.

Leave a Reply

Your email address will not be published.




*

code