Engineering_S/W & H/W

 AWS의 S3에 정적 웹사이트(React)를 Build해서 올리는 방법입니다. 해당 블로그 글을 작성시 아래 글들을 참고하였습니다. https://s0ojin.tistory.com/48 참고링크 :  AWS S3에 CloudFront를 이용해서 HTTPS(SSL) 적용하기 GitAction을 이용해서 업로드 합니다. 해당 블로그 글에는 React를 이용해서 CI/CD작업을 작성하겠습니다. 1. yaml파일 작성 루트 경로에서 .github/workflows 폴더 안에 하나의 yaml(front-build.yaml)파일 하나를 생성한다. name : Front Deployment # trigger가 되길 바라는 action을 입력합니다. push / pull_request가 있습니다. # GitHub에서 직접 실행할려면 workflow_dispatch를 사용한다. # 저는 develop 브랜치에 push가 되면 actions을 실행하도록 설정했습니다. # S3에 배포하기 위해서 아래와 같은 Secreat이 설정되어야 합니다. # secrets.AWS_S3_ACCESS_KEY_ID : IAM AWS Access Key # secrets.AWS_S3_SECRET_ACCESS_KEY_ID : IAM AWS Secret ACCESS Key # secrets.AWS_S3_BUCKET_NAME : S3 Bucket Name on : workflow_dispatch # 위의 이벤트가 트리거되면 실행할 목록입니다. jobs : build : name : react build & deploy # runner가 실행될 환경을 지정합니다. runs-on : ubuntu-latest # name은 단계별로 실행되는 액션들의 설명을 담은 것으로, 나중에 github action에서 workflow에 표시됩니다. # uses 키워드로 Action을 불러올 수 있습니다. steps : # 레포지토리에 접근하...

 AWS의 S3와 CloudFront, Certificate Manager를 이용해서 SSL을 적용한 웹페이지를 작성 1. S3버킷을 생성 먼저 S3에 올릴 빌드파일을 만듭니다. 저는 이미 React로 Build파일을 만들었기 때문에 해당 폴더를 올리도록 하겠습니다. 참고링크1 : AWS S3 셋팅1 S3사용하기 버킷생성 참고링크2 : AWS S3 셋팅2 S3 bucket에 build 폴더 올리기 먼저 S3의 버킷을 만들도록 하겠습니다. 정적 웹사이트 호스팅시 React, Next error인덱스도 동일한 index.html등록 2. 인증서 요청 HTTPS을 적용하기 위해서는 인증서가 필요하다. Certificate Manager에서 인증서를 요청한다. 도메인 이름은 실제 사용할 URL을 작성한다. 예로 들어 "example.test.com"이 실제 입력해야할 URL이면 도메인 이름으로 입력한다. 해당 인증서에 대해서 "요청"한다. 해당 도메인이 "Route 53"에서 구매한 것이면 자동으로 "Route 53에서 레코드 생성"을 사용할수 있다. 3. CloudFront 배포 이제 CloudFront 작업을 하자. 현재 S3를 사용하고 있는데 S3의 엔드 포인트를 사용한다. Origin path은 처음 실행할 파일(예로 index.html)이 루트가 아닌 다른경로에 있을때 작성 HTTP로 접속 시도시 HTTPS로 리다이렉트 한다. 2번에서 만든 인증서 적용 배포 생성후 완전히 완료되기까지는 약 15분 이상 걸렸다.  CloudFront에 도메인을 연결해야한다. 위 사진에서 대체 도메인은 실제 유저가 접속할 도메인을 입력한다. 예로 들어서 'example.test.com'의 SSL인증서가 있고 해당 링크로 Route53에서 별칭이 노출되게 하고 싶다면 대체 도메인(Alternative domain name(CNAMEs))을 추가한다. SSL인증...

 당연히도 영어는 상관이 없지만 한글파일명을 가진 S3 파일은 이름이 변경된채 저장되는 것이였다. portal2.jpg => https://S3-Bucket-URL/portal2.jpg 포탈2.jpg => https://S3-Bucket-URL/%ED%8F%AC%ED%83%882.jpg url주소로 인코딩 하는 과정에서 한글을 변경하는 것이다. 이때 한글이름을 그대로 갖고오기 위해서는 utf-8 디코등을 이용해서 변환해야 한다. 위 사진에서 "인코딩파일"은 S3에서 진행을 하게 되어 있다. S3에서 조회할때는 한글 파일을 동일하게 인코딩 한 다음에 조회를 해야 한다. 따라서 encodeURIComponent 함수를 이용해서 한글 파일을 변환 다음에 S3 버킷 주소에 붙여서 다운을 받아야 한다. 예로 들어 내가 포탈2.jpg파일을 S3에서 받고 싶으면 아래와 같은 URL을 사용해야 한다. (S3-Bucket-URL은 임의의 URL이다. 실제 S3에서 확인해야 한다.) https://S3-Bucket-URL/%ED%8F%AC%ED%83%882.jpg

 안녕하세요. 이번에는 NCP에서 무료(2022.06.08 기준)로 진행하고 있는 Object Storage Migration에 대해서 알아보도록 하겠습니다. NCP의 공식 Document를 확인할려면 해당 링크 를 확인해 주시기 바랍니다. 사진1) Object Migration 신청 NCP에서 제공하는 'Object Migration'은 타사의 Storage를 NCP로 옮기도록 해주고 있습니다. 이번 포스트에서는 S3를 이용하여 Migration을 진행하겠습니다. 사진2) Migration전 NCP bucket 생성 NCP에서 Migration을 진행할시 사진2처럼 Objected Storage에 Migration할 버킷이 존재해야 합니다. 사진3) Bucket명 생성 해당 버킷 이름을 생성합니다. S3버킷과 다르게 지어도 되지만 다운로드 url의 호환을 위해 갖게 해주는 것이 좋습니다. 사진4) 버킷 설정 사진5) 권한관리 설정 버킷 설정중 사진5와 같이 공개여부를 공개로 하는것을 추천드립니다. 그렇지 않으면 폴더별로 일일이 공개 여부를 결정해야 합니다. 사진6) 버킷 생성전 확인 사진6 처럼 버킷 생성전 해당내용을 확인하고 생성해 줍니다. 사진7) Migration 신청 이제 Migration을 신청을 합니다.  정책명 : 해당 Migration의 명칭(중복되지 않게만 작성하면 됩니다.) 원본-원본 : Migration하는 주체(사진7에서는 AWS) 원본-리전 : 해당 서비스의 리전 원본-버킷 : Migration하는 버킷 명칭 원본-Access Key : 해당 서비스를 사용하기 위한 Access Key 원본-Security Key : 해당 서비스를 사용하기 위한 Security Key 대상-버킷 : NCP의 Objected Storage에 있는 버킷 AWS기준으로 Access Key, Security Key를 얻기 위해서는 해당 링크 를 참고해 주시기 바랍니다. 사진8) Migration 준비완료 사진9) Migration 시작 Mi...

 안녕하세요. 알렉스 입니다. 이번에는 S3버킷을 터미널로 다운 받는 방법에 대해서 알려드리겠습니다. 참고로 이번 포스트를 진행하기 위해서는 S3버킷 및 IAM계정이 필요합니다. 링크 를 참고해 주시기 바랍니다. 1. AWS Command Line Tools 설치 - 터미널로 AWS서비스를 사용할수 있습니다. $ sudo pip install awscli copy 2. AWS S3버킷 다운로드 - S3버킷의 경로를 이용하여 Local PC로 다운로드 합니다 - 로컬경로를 '.'으로 할 경우 해당 경로로 S3버킷 데이터가 저장됩니다. $ aws s3 sync s3://[소스 버킷 주소] [로컬 경로] copy 소스 버킷 전체 주소는 S3 사이트에서 복사할수 있습니다. (s3://경로 포함) 사진2) S3버킷 URL을 확인하는 버튼 Error 발생시 : fatal error: Unable to locate credentials 위 사항은 로컬 PC에 AWS의 IAM키값들을 저장하지 않아서 발생한 문제 입니다. 해당 링크 로 이동해서 확인해 주시기 바랍니다. 공식문서 링크 도 참고하시가 바랍니다. 사진1) list확인시 비어있음 AWS configure 리스트 확인 - 등록되어있는 IAM키 정보를 확인합니다 $ aws configure list copy

 이제 S3버킷에 올린 파일을 받도록 하겠습니다. 이전글 : NestJS Server에 저장된 파일을 AWS S3버킷에 업로드 하기 - 2 : 클라이언트에서 받은 파일을 올리기 // /src/aws/aws.service.ts // S3버킷에서 다운로드 받은 파일을 저장합니다. downLoad ( Key : string , saveName : string ) { // getObject에 인자로 넣을 params을 작성합니다. const params = { Bucket : process . env . S3_BUCKET , Key , // 다운로드 받을 파일 이름 }; // s3를 이용하여 해당 params의 값을 확인후 callback함수의 data에 넣습니다 this . s3 . getObject ( params , async function ( error , data ) { if ( error != null ) { // 에러시 에러 출력(서버 멈춤) throw new HttpException ( error , HttpStatus . INTERNAL_SERVER_ERROR ); } else { console . log ( 'data : ' , data ); //다운로드 한 파일을 downloads폴더에 저장한다. fs . createWriteStream ( pa + '/downloads/' + saveName ). write ( data . Body ); } }); return true ; } 코드1) service부분 위 코드는 기존의 '/uploads'폴더가 아닌 '/downloads'폴더에 S3 Bucket으로 부터 받은 파일을 저장합니다. 파일의 버퍼를 받고 이것을 '/downl...

이번에는 클라이언트에서 받은 파일을 NestJS을 이용하여 S3버킷에 올리도록 하겠습니다. 이전글 : NestJS Server에 저장된 파일을 AWS S3버킷에 업로드 하기 - 1 : 서버의 파일을 올리기 // /src/aws/aws.service.ts import { HttpException , Injectable } from '@nestjs/common' ; import * as AWS from 'aws-sdk' ; import * as fs from 'fs' ; import * as path from 'path' ; // 현재 실행되고 있는 root경로를 확인하고 pa에 저장 const pa = path . dirname ( __dirname ). replace ( '/dist' , '' ); @ Injectable () export class AwsService { // S3버킷을 .env파일에서 입력한다. private AWS_S3_BUCKET = process . env . S3_BUCKET ; // s3를 사용하기 위해서 IAM계정의 ACCESS, SECRET_ACCESS KEY를 입력한다. private s3 = new AWS . S3 ({ accessKeyId : process . env . S3_ACCESS_KEY , secretAccessKey : process . env . S3_SECRET_ACCESS_KEY , }); convertBinary ( fileName : string ) { return fs . readFileSync ( pa + '/uploads/' + fileName ); } // AWS 버킷에 파일 upload async uploadFile ( file ) { // savename은 실제 S3 버킷에...

 안녕하세요. 이번에는 NestJS에 저장된 파일을 S3버킷에 올리도록 하겠습니다.  이전글 : NestJS Server에 저장된 파일을 AWS S3버킷에 업로드 하기 - 0 : AWS S3 버킷 및 IAM셋팅 npm 설치 : aws-sdk - aws의 s3버킷과 통신을 하기 위한 패키지를 설치한다. $ npm i aws-sdk copy 사진1) 폴더 및 파일 생성 사진1과 같이 aws폴더를 만들어 주고 3개의 파일을 생성합니다. // /src/aws/aws.service.ts import { HttpException , Injectable } from '@nestjs/common' ; import * as AWS from 'aws-sdk' ; import * as fs from 'fs' ; import * as path from 'path' ; // 현재 실행되고 있는 root경로를 확인하고 pa에 저장 const pa = path . dirname ( __dirname ). replace ( '/dist' , '' ); @ Injectable () export class AwsService { // S3버킷을 .env파일에서 입력한다. private AWS_S3_BUCKET = process . env . S3_BUCKET ; // s3를 사용하기 위해서 IAM계정의 ACCESS, SECRET_ACCESS KEY를 입력한다. private s3 = new AWS . S3 ({ accessKeyId : process . env . S3_ACCESS_KEY , secretAccessKey : process . env . S3_SECRET_ACCESS_KEY , }); convertBinary ( fileName : string ) { return fs . rea...