Colin's Blog
[ServerLess] ServerLess

ServerLess

image-20201027174729653

CloudFront, S3, API Gateway, Lambda :point_right: VPC 설정 :x:

Serverless에서 VPC는 데이터 영역만 주의하면 된다.

RDS는 VPC 연결 필수 :point_right: Lambda도 같은 VPC 영역 :o:

DynamoDB :point_right: VPC 설정 :x:

:bookmark: 참고사이트

3 tier Architecture https://www.techiexpert.com/serverless-multi-tier-architecture-on-aws/

:play_or_pause_button: Lambda로 게시판 서버 API 생성 https://www.youtube.com/watch?v=x0iyaENTxU0

Lambda & Gateway 시작 및 연결 https://gun0912.tistory.com/60

SQL vs NoSQL https://medium.com/harrythegreat/aws-%EC%84%9C%EB%B2%84%EB%A6%AC%EC%8A%A4%EB%A5%BC-%EC%9C%84%ED%95%9C-rds-proxy%EC%84%9C%EB%B9%84%EC%8A%A4-fb5815b83cce

Serverless - SQL/NoSQL https://blog.thundra.io/which-database-should-i-choose-for-my-serverless-applications

dynamoDB https://www.slideshare.net/awskorea/aws-database-hands-on-lab-aws-gaming-on-aws-2018

lambda - gateway - dynamodb https://medium.com/@yumenohosi/aws-lambda-api-gateway-dynamodb-node-js-%EC%82%AC%EC%9A%A9%EA%B8%B0-%EC%82%BD%EC%A7%88%EA%B8%B0-b5352e00b396

dynamo 연결 실습 https://blog.naver.com/PostView.nhn?blogId=scw0531&logNo=221451926933&parentCategoryNo=&categoryNo=52&viewDate=&isShowPopularPosts=false&from=postView

serverless 배포 https://velopert.com/3577

(Azure) 고려 사항 https://docs.microsoft.com/ko-kr/dotnet/architecture/serverless/serverless-design-examples

Lambda - RDS 연결 https://base-on.tistory.com/73

정적 웹 사이트 생성 및 배포 https://ongamedev.tistory.com/entry/S3-%EC%A0%95%EC%A0%81-%EC%9B%B9%EC%82%AC%EC%9D%B4%ED%8A%B8%EB%A5%BC-https%EB%A1%9C-%EC%A0%91%EC%86%8D%ED%95%98%EA%B8%B0

Serverless 프레임 워크 https://ndb796.tistory.com/311?category=1045560 –> 나동빈 블로그

serverless Framework https://novemberde.github.io/aws/2017/08/14/Serverless.html

특징

https://brunch.co.kr/@yesjun/3

API Gateway

https://meetup.toast.com/posts/201

데이터베이스

RDS(SQL)

:star: Lambda에서 SQL을 사용할 때

ColdStart

RDS PROXY

RDS Connect 관리

:exclamation: 서버리스 SQL 형태인 Aurora 존재

DynamoDB(NoSQL)

DynamoDB와 Node.js 연결 코딩

https://software-creator.tistory.com/16

DELETE https://gist.github.com/kiewic/b175e6a926d3ddd7277463980e8bd3b2

전체 정리 https://www.theteams.kr/teams/2440/post/67303

//GET
//검색할 Table이름과 Key값
const params = {
    TableNaeme: "Food",
    Key: {
        "type": "Korean",
        "name": "Soybean pastestew"
    }
}

//POST
const params = {
    TableName: tableName,
    Item: {
        "type:" : "Western",
        "name" : "Carbonara",
        "ingredients" :{
            "egg" : "1",
            "spaghetti" : "90g"
        }
    }
}

//PUT
const params = {
    TableName: tableName,
    Key: {
        "type": "Western",
        "name": "Carbonara",
    },
    UpdateExpression: "set price = :price", //수정할 것 선택
    ExpressionAttributeValues:{ //수정할 것의 값
        ":price": 15000
    }
}

//DELETE
const params={
    TableName: tableName,
    Key:{
        "type": "Korean",
        "name": "Soybean pastestew",
    },
    ConditionExpression: "price <= :price", //조건
    ExpressionAttributeValues:{ //가격
        ":price": 8000
    }
}

//DELETE -> 2
const params={
    TableName: tableName,
    Key:{
        "type": "Korean", // 삭제할 것의 Key 입력
    },
}


			case 'DELETE':
                body = await dynamo.delete(params).promise();
                break;
            case 'GET':
                body = await dynamo.scan(payload).promise();
//				docClient.get(params).promise();
                break;
            case 'POST':
                body = await dynamo.put(params).promise(); //params에 있는 item 값을 add
                break;
            case 'PUT':
                body = await dynamo.update(params).promise();
                break;

정적 웹사이트 호스팅

https://devlog-h.tistory.com/11

삽질

1. Lambda - DynamoDB 연결

2. Lambda - VPC 설정

3. invoke API를 호출하면 이 메시지를 사용한 작업에 실패했습니다. Rate Exceeded.

해결 못함

4. Gateway URL

배포를 하면 된다.

{"message":"Missing Authentication Token"}

link 뒤에 /board, 리소스 정보를 줄 것

https://sarc.io/index.php/aws/767

html 입히기

  • 보안적인 문제로 인해 HTML을 일반적으로 두게 되면 CORS 에러 발생

5. 502 Bad Gateway

https://medium.com/@yumenohosi/aws-lambda-api-gateway-dynamodb-node-js-%EC%82%AC%EC%9A%A9%EA%B8%B0-%EC%82%BD%EC%A7%88%EA%B8%B0-b5352e00b396

6. VPC 설정

https://changhoi.github.io/posts/serverless/serverless-vpc-deploy-demo/

7. HTML로 접근 시 CORS 에러

:warning: Access to fetch at ‘https://92ziazl1wi.execute-api.ap-northeast-2.amazonaws.com/2020-10-22/board’ from origin ‘null’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

 callback(null, { 
                    'statusCode': 200, 
                    'headers': {'Access-Control-Allow-Origin': '*'},
                    'body': JSON.stringify(body) }
                    );
}

header에서 Allow 설정 필수!

8. CORS policy 에러

:warning: Access to XMLHttpRequest at ‘file:///C:/Users/jihong.kim/Desktop/serverless/[object%20Object]’ from origin ‘null’ has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

https://velog.io/@takeknowledge/%EB%A1%9C%EC%BB%AC%EC%97%90%EC%84%9C-CORS-policy-%EA%B4%80%EB%A0%A8-%EC%97%90%EB%9F%AC%EA%B0%80-%EB%B0%9C%EC%83%9D%ED%95%98%EB%8A%94-%EC%9D%B4%EC%9C%A0-3gk4gyhreu

npm install http-server -g
npx http-server
(chrome 주소창) http://127.0.0.1:8080 - 해당 파일에 접속

9. jQuery ajax post 405 method not allowed

https://stackoverrun.com/ko/q/10901283

ajax에 type: post 명시

10. API Gateway Ajax POST 400 error

https://stackoverflow.com/questions/38987256/aws-api-gateway-cors-post-not-working

Ajax에서 data 전송 시, json.stringfy를 해줘야 형식이 맞음..

11. jQuery로 특정 위치에 html 뿌리기

https://stackoverflow.com/questions/55371920/display-data-in-table-on-ajax-success

div로 영역 + id 잡아준 후 해당 위치에 .html(html);

12. This XML file does not appear to have any style information associated with it. The document tree is shown below.

https://zamezzz.tistory.com/299

s3 버킷을 public으로 설정

PoC

Proof of Concept

검증할 주요 내용에 대한 목표 설정 :point_right: 프로토타이핑 :point_right: 배포를 통해 개념 증명

© 2018 Colin. All rights reserved.