AWS S3 연습

이민기·2022년 6월 15일
0
post-thumbnail

S3 버킷 만들기

버킷은 S3에서 파일을 저장하는 폴더라고 생각하시면 됩니다.
우리가 컴퓨터를 사용할 때 폴더 안에 파일을 저장하는 것처럼
S3에서도 버킷 안에 파일을 저장합니다.

버킷 만들기에 보이는 옵션들은 전부 사용하지는 않습니다.
서비스의 상황에 따라 그때그때 찾아보면서 사용하는 것을 추천드립니다 😀

그럼 버킷 만들기 버튼을 클릭해볼까요!!

버킷이름: 이름은 무수히 많은 버킷중에 고유한 이름이어야 합니다.
(이유는 나중에 알려드려요!! 기대하세요~ 😛)
AWS 리전: 앞에서 배웠던 리전을 선택합니다.
기존 버킷 복사: 기존 버킷의 설정을 그대로 사용할때 유용합니다.

액세스 차단 설정은 버킷에 저장한 파일의 권한을 설정하는 기능입니다.
퍼블릭 엑세스: 버킷이 생성되면 고유한 URL이 부여됩니다. URL을 통해서
저장된 파일에 접근 할수 있게 하는 기능입니다.
ACL: 액세스 제어 목록으로 버킷과 객체에 대한 액세스를 관리합니다.

버전관리는 개발할때 소스를 git, svn으로 관리하는 것처럼
버킷내의 파일들을 버전을 관리할 수 있는 기능입니다.

태그는 해당 버킷을 태깅해놓고 이후에 비용측정이라던지
많은 버킷중에 태그로 검색을 한다던지 할때 쓰는 태깅 기능입니다.

암호화는 말그대로 파일들을 암호화해서 좀더 보안적으로 신경써서 관리하게 해주는 기능입니다.

객체 잠금은 보시는 것과 같이 고~~급 설정입니다.
중요한 파일이 버킷에 저장되면 보안에 좀 더 신경써야겠죠!!
이런경우 사용하는 기능입니다.

버킷이름은 prac 하고,
AWS 리전은 아시아 태평양(서울) ap-northeast-2 로 설정했어요
나머지 옵션들은 그냥 기본으로 나두셔도 됩니다.
버킷이 생성되도 설정을 바꿀수 있기 때문이죠 😍
버킷 만들기 클릭합니다!!

I AM 사용자 추가

사용자 이름, 엑세스 유형 중 프로그래밍 방식 엑세스를 체크하고
다음 단계로 넘어갑니다.
프로그래밍 방식 엑세스는 개발 언어와 연계해서 사용하는 방식이고,
AWS Management Console 엑세스는 해당계정을 AWS 콘솔에서 로그인해서
사용하게 하는 방식입니다.

우리는 개발 언어와 연계해서 사용하는 것이 목적이기 때문에 프로그래밍 방식 엑세스만 체크 합니다.

생성하는 사용자에게 권한을 부여합니다.
기존그룹에 추가하는 방법, 기존사용자 권한 복사, 기존 정책 직접 연결 하는 방법이 있습니다. 우리는 기존 그룹, 사용자가 없기때문에
정의되어 있는 정책에 직접 연결하는 방법을 사용합니다.
S3를 위한 사용자이기 때문에 AmazonS3FullAccess 권한을 부여합니다.

사용자가 성공적으로 추가되었습니다.
이 화면에서 엑세스 키 ID, 비밀 엑세스 키를 복사해놓는것이 중요합니다.
😱 절때 외부에 노출이 되면 안됩니다!!

AWS SDK 설치

https://awscli.amazonaws.com/AWSCLIV2.pkg


//aws 버전확인
aws --version

//aws 설정
aws configure


//S3 명령어 참고 자료
https://docs.aws.amazon.com/cli/latest/reference/s3/cp.html

//업로드 퍼블릭 읽기 권한을 준다.
aws s3 cp {파일명} s3://{버킷이름} --acl public-read

Flask 사용하여 S3 업로드

index.html

<!Doctype html>
<html lang="ko">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
          integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
          crossorigin="anonymous">

    <!-- JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
            integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
            crossorigin="anonymous"></script>

    <!-- 구글폰트 -->
    <link href="https://fonts.googleapis.com/css?family=Stylish&display=swap" rel="stylesheet">


    <title>핵심 쏙쏙 AWS</title>

    <!-- style -->
    <style type="text/css">
        * {
            font-family: 'Stylish', sans-serif;
        }

        .wrap {
            width: 900px;
            margin: auto;
        }

        .comment {
            color: blue;
            font-weight: bold;
        }

        #post-box {
            width: 500px;
            margin: 20px auto;
            padding: 50px;
            border: black solid;
            border-radius: 5px;
        }
    </style>
    <script>
        function save() {
            var form_data = new FormData($('#upload-file')[0]);
            $.ajax({
                type: 'POST',
                url: '/fileupload',
                data: form_data,
                processData: false,
                contentType: false,
                success: function (data) {
                    alert("파일이 업로드 되었습니다!!");
                },
            });
        }
    </script>

</head>

<body>
<div class="wrap">
    <div class="jumbotron">
        <h1 class="display-4">나홀로 이미지 메모장!</h1>
        <p class="lead">중요한 이미지를 저장해두고, 나중에 볼 수 있는 공간입니다</p>
        <hr class="my-4">
    </div>
    <div id="post-box" class="form-post">
        <div>
            <div class="form-group">
                <form id="upload-file">
                    <label for="post-url">이미지 파일</label>
                    <input type="file" name="file"/>
                </form>
            </div>
            <button type="button" class="btn btn-primary" onclick="save()">저장</button>
        </div>
    </div>
    <div id="cards-box" class="card-columns">
        <div class="card">
            <img class="card-img-top"
                 src="https://www.eurail.com/content/dam/images/eurail/Italy%20OCP%20Promo%20Block.adaptive.767.1535627244182.jpg"
                 alt="Card image cap">
            <div class="card-body">
                <a href="#" class="card-title">여기 기사 제목이 들어가죠</a>
                <p class="card-text">기사의 요약 내용이 들어갑니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라만세 무궁화 삼천리 화려강산...</p>
                <p class="card-text comment">여기에 코멘트가 들어갑니다.</p>
            </div>
        </div>
        <div class="card">
            <img class="card-img-top"
                 src="https://www.eurail.com/content/dam/images/eurail/Italy%20OCP%20Promo%20Block.adaptive.767.1535627244182.jpg"
                 alt="Card image cap">
            <div class="card-body">
                <a href="#" class="card-title">여기 기사 제목이 들어가죠</a>
                <p class="card-text">기사의 요약 내용이 들어갑니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라만세 무궁화 삼천리 화려강산...</p>
                <p class="card-text comment">여기에 코멘트가 들어갑니다.</p>
            </div>
        </div>
        <div class="card">
            <img class="card-img-top"
                 src="https://www.eurail.com/content/dam/images/eurail/Italy%20OCP%20Promo%20Block.adaptive.767.1535627244182.jpg"
                 alt="Card image cap">
            <div class="card-body">
                <a href="#" class="card-title">여기 기사 제목이 들어가죠</a>
                <p class="card-text">기사의 요약 내용이 들어갑니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라만세 무궁화 삼천리 화려강산...</p>
                <p class="card-text comment">여기에 코멘트가 들어갑니다.</p>
            </div>
        </div>
        <div class="card">
            <img class="card-img-top"
                 src="https://www.eurail.com/content/dam/images/eurail/Italy%20OCP%20Promo%20Block.adaptive.767.1535627244182.jpg"
                 alt="Card image cap">
            <div class="card-body">
                <a href="#" class="card-title">여기 기사 제목이 들어가죠</a>
                <p class="card-text">기사의 요약 내용이 들어갑니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라만세 무궁화 삼천리 화려강산...</p>
                <p class="card-text comment">여기에 코멘트가 들어갑니다.</p>
            </div>
        </div>
        <div class="card">
            <img class="card-img-top"
                 src="https://www.eurail.com/content/dam/images/eurail/Italy%20OCP%20Promo%20Block.adaptive.767.1535627244182.jpg"
                 alt="Card image cap">
            <div class="card-body">
                <a href="#" class="card-title">여기 기사 제목이 들어가죠</a>
                <p class="card-text">기사의 요약 내용이 들어갑니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라만세 무궁화 삼천리 화려강산...</p>
                <p class="card-text comment">여기에 코멘트가 들어갑니다.</p>
            </div>
        </div>
        <div class="card">
            <img class="card-img-top"
                 src="https://www.eurail.com/content/dam/images/eurail/Italy%20OCP%20Promo%20Block.adaptive.767.1535627244182.jpg"
                 alt="Card image cap">
            <div class="card-body">
                <a href="#" class="card-title">여기 기사 제목이 들어가죠</a>
                <p class="card-text">기사의 요약 내용이 들어갑니다. 동해물과 백두산이 마르고 닳도록 하느님이 보우하사 우리나라만세 무궁화 삼천리 화려강산...</p>
                <p class="card-text comment">여기에 코멘트가 들어갑니다.</p>
            </div>
        </div>
    </div>
</div>
</body>

</html>

app.py

import boto3
from flask import Flask, render_template, request, jsonify

app = Flask(__name__)

@app.route('/')
def main():
    return render_template('index.html')

@app.route('/fileupload', methods=['POST'])
def file_upload():
    file = request.files['file']
    s3 = boto3.client('s3')
    s3.put_object(
        ACL="public-read",
        Bucket="{버킷이름}",
        Body=file,
        Key=file.filename,
        ContentType=file.content_type)
    return jsonify({'result': 'success'})

if __name__ == '__main__':
    app.run()
profile
지나가는사람

0개의 댓글