ASP.NET 웹 페이지(Razor) 사이트에서 이미지 작업

2023-07-13

이 문서에서는 ASP.NET 웹 페이지(Razor) 웹 사이트에서 이미지를 추가, 표시 및 조작하는 방법(워터마크 크기 조정, 대칭 이동 및 추가)을 보여 줍니다.

학습할 내용:

페이지에 이미지를 동적으로 추가하는 방법입니다.

사용자가 이미지를 업로드할 수 있도록 하는 방법입니다.

이미지 크기를 조정하는 방법입니다.

이미지를 대칭 이동하거나 회전하는 방법입니다.

이미지에 워터마크를 추가하는 방법입니다.

이미지를 워터마크로 사용하는 방법

다음은 문서에 도입된 ASP.NET 프로그래밍 기능입니다.

도우미입니다 WebImage .

Path 경로 및 파일 이름을 조작할 수 있는 메서드를 제공하는 개체입니다.

자습서에서 사용되는 소프트웨어 버전

ASP.NET 웹 페이지(Razor) 2

WebMatrix 2

이 자습서는 WebMatrix 3에서도 작동합니다.

동적으로 웹 페이지에 이미지 추가

웹 사이트를 개발하는 동안 웹 사이트 및 개별 페이지에 이미지를 추가할 수 있습니다. 사용자가 이미지를 업로드하도록 할 수도 있습니다. 이 이미지는 프로필 사진 추가하도록 하는 등의 작업에 유용할 수 있습니다.

사이트에서 이미지를 이미 사용할 수 있고 페이지에 표시하려는 경우 다음과 같은 HTML <img> 요소를 사용합니다.

<img src="images/Photo1.jpg" alt="Sample Photo" />

하지만 경우에 따라 이미지를 동적으로 표시할 수 있어야 합니다. 즉, 페이지가 실행될 때까지 표시할 이미지를 알 수 없습니다.

이 섹션의 절차에서는 사용자가 이미지 이름 목록에서 이미지 파일 이름을 지정하는 즉시 이미지를 표시하는 방법을 보여 줍니다. 드롭다운 목록에서 이미지의 이름을 선택하고 페이지를 제출하면 선택한 이미지가 표시됩니다.

[스크린샷은 드롭다운 목록에서 선택한 후 표시되는 이미지를 보여줍니다.]

WebMatrix에서 새 웹 사이트를 만듭니다.
DynamicImage.cshtml이라는 새 페이지를 추가합니다.
웹 사이트의 루트 폴더에 새 폴더를 추가하고 이름을 이미지로 지정합니다.
방금 만든 images 폴더에 4개의 이미지를 추가합니다. (편리하게 사용할 수 있는 모든 이미지는 수행되지만 페이지에 적합해야 합니다.) 이미지 이름을 ,Photo2.jpg, Photo3.jpg및 Photo4.jpgPhoto1.jpg이름을 바꿉니다. (이 절차에서는 Photo4.jpg 사용하지 않지만 문서의 뒷부분에서 사용합니다.)
4개의 이미지가 읽기 전용으로 표시되지 않는지 확인합니다.
페이지의 기존 콘텐츠를 다음으로 바꿉다.
```
@{  var imagePath= "";
    if( Request["photoChoice"] != null){
        imagePath = @"images\" + Request["photoChoice"];
   }
}
<!DOCTYPE html>
<html>
<head>
  <title>Display Image on the Fly</title>
</head>
<body>
<h1>Displaying an Image On the Fly</h1>
<form method="post" action="">
    <div>
        I want to see:
        <select name="photoChoice">
            <option value="Photo1.jpg">Photo 1</option>
            <option value="Photo2.jpg">Photo 2</option>
            <option value="Photo3.jpg">Photo 3</option>
        </select>
        &nbsp;
        <input type="submit" value="Submit" />
    </div>
    <div style="padding:10px;">
        @if(imagePath != ""){
            <img src="@imagePath" alt="Sample Image" width="300px" />
        }
    </div>
</form>
</body>
</html>
```
페이지의 본문에는 라는 photoChoice드롭다운 목록(<select>요소)이 있습니다. 목록에는 세 가지 옵션이 있으며 value 각 목록 옵션의 특성에는 images 폴더에 배치한 이미지 중 하나의 이름이 있습니다. 기본적으로 목록에서는 사용자가 "사진 1"과 같은 친숙한 이름을 선택한 다음 페이지가 제출될 때 .jpg 파일 이름을 전달합니다.

코드에서 를 읽 Request["photoChoice"]어 목록에서 사용자의 선택 항목(즉, 이미지 파일 이름)을 가져올 수 있습니다. 먼저 선택 항목이 있는지 확인합니다. 있는 경우 이미지의 폴더 이름과 사용자의 이미지 파일 이름으로 구성된 이미지의 경로를 생성합니다. (경로를 구성하려고 했지만 에 Request["photoChoice"]아무 것도 없는 경우 오류가 발생합니다.) 그러면 다음과 같은 상대 경로가 생성됩니다.

images/Photo1.jpg

경로는 페이지의 뒷부분에서 필요한 라는 imagePath 변수에 저장됩니다.

본문에는 사용자가 선택한 이미지를 표시하는 데 사용되는 요소도 <img> 있습니다. 특성은 src 정적 요소를 표시하는 것처럼 파일 이름 또는 URL로 설정되지 않습니다. 대신 으로 @imagePath설정됩니다. 즉, 코드에서 설정한 경로에서 해당 값을 가져옵니다.

하지만 페이지가 처음 실행될 때는 사용자가 아무것도 선택하지 않았기 때문에 표시할 이미지가 없습니다. 이는 일반적으로 특성이 src 비어 있고 이미지가 빨간색 "x"(또는 이미지를 찾을 수 없을 때 브라우저가 렌더링하는 모든 항목)로 표시됨을 의미합니다. 이를 방지하기 위해 변수에 if 변수가 <img> 있는지 여부를 imagePath 테스트하는 블록에 요소를 배치합니다. 사용자가 선택한 imagePath 경우 경로가 포함됩니다. 사용자가 이미지를 선택하지 않았거나 페이지가 처음 표시되는 <img> 경우 요소는 렌더링되지 않습니다.
파일을 저장하고 브라우저에서 페이지를 실행합니다. (실행하기 전에 파일 작업 영역에서 페이지가 선택되어 있는지 확인합니다.)
드롭다운 목록에서 이미지를 선택한 다음 샘플 이미지를 클릭합니다. 다른 선택 항목에 대해 다른 이미지가 표시되는지 확인합니다.

이미지 업로드

이전 예제에서는 이미지를 동적으로 표시하는 방법을 보여 주었지만 웹 사이트에 이미 있는 이미지에서만 작동했습니다. 이 절차에서는 사용자가 이미지를 업로드하도록 하는 방법을 보여 드리며, 이 이미지는 페이지에 표시됩니다. ASP.NET 이미지를 만들고 조작하고 저장할 수 있는 메서드가 있는 도우미를 사용하여 WebImage 즉시 이미지를 조작할 수 있습니다. 도우미는 WebImage.jpg,.png및 .bmp를 비롯한 모든 일반적인 웹 이미지 파일 형식을 지원 합니다. 이 문서에서는 .jpg 이미지를 사용하지만 이미지 유형을 사용할 수 있습니다.

[스크린샷은 이미지 업로드 페이지를 보여줍니다.]

새 페이지를 추가하고 이름을 UploadImage.cshtml로 지정합니다.
페이지의 기존 콘텐츠를 다음으로 바꿉다.
```
@{  WebImage photo = null;
    var newFileName = "";
    var imagePath = "";

    if(IsPost){
        photo = WebImage.GetImageFromRequest();
        if(photo != null){
            newFileName = Guid.NewGuid().ToString() + "_" +
                Path.GetFileName(photo.FileName);
            imagePath = @"images\" + newFileName;

            photo.Save(@"~\" + imagePath);
        }
    }
}
<!DOCTYPE html>
<html>
<head>
  <title>Image Upload</title>
</head>
<body>
  <form action="" method="post" enctype="multipart/form-data">
    <fieldset>
      <legend> Upload Image </legend>
      <label for="Image">Image</label>
      <input type="file" name="Image" />
      <br/>
      <input type="submit" value="Upload" />
    </fieldset>
  </form>
  <h1>Uploaded Image</h1>
    @if(imagePath != ""){
    <div class="result">
        <img src="@imagePath" alt="image" />

    </div>
    }
</body>
</html>
```
텍스트 본문에는 <input type="file"> 사용자가 업로드할 파일을 선택할 수 있는 요소가 있습니다. 제출을 클릭하면 선택한 파일이 양식과 함께 제출됩니다.

업로드된 이미지를 얻으려면 이미지 작업에 유용한 모든 종류의 메서드가 있는 도우미를 사용합니다 WebImage . 특히 를 사용하여 WebImage.GetImageFromRequest 업로드된 이미지(있는 경우)를 가져와 라는 photo변수에 저장합니다.

이 예제의 많은 작업에는 파일 및 경로 이름을 가져오고 설정하는 작업이 포함됩니다. 문제는 사용자가 업로드한 이미지의 이름(및 이름만)을 가져와 이미지를 저장할 위치에 대한 새 경로를 만들려는 것입니다. 사용자가 이름이 같은 여러 이미지를 업로드할 수 있으므로 약간의 추가 코드를 사용하여 고유한 이름을 만들고 사용자가 기존 그림을 덮어쓰지 않도록 합니다.

이미지가 실제로 업로드된 경우(테스트 if (photo != null)) 이미지의 FileName 속성에서 이미지 이름을 가져옵니다. 사용자가 이미지를 FileName 업로드할 때 는 사용자의 컴퓨터에서 경로를 포함하는 사용자의 원래 이름을 포함합니다. 다음과 같이 보일 수 있습니다.

C:\Users\Joe\Pictures\SamplePhoto1.jpg

하지만 실제 파일 이름(SamplePhoto1.jpg)만 원하는 경로 정보는 원하지 않습니다. 다음과 같이 메서드를 사용하여 Path.GetFileName 경로에서 파일만 제거할 수 있습니다.
```
Path.GetFileName(photo.FileName)
```
그런 다음 원래 이름에 GUID를 추가하여 새 고유 파일 이름을 만듭니다. GUID에 대한 자세한 내용은 이 문서의 뒷부분에 있는 GUID 정보를 참조하세요. 그런 다음 이미지를 저장하는 데 사용할 수 있는 전체 경로를 생성합니다. 저장 경로는 새 파일 이름, 폴더(이미지) 및 현재 웹 사이트 위치로 구성됩니다.

참고

코드가 images 폴더에 파일을 저장하려면 애플리케이션에 해당 폴더에 대한 읽기-쓰기 권한이 필요합니다. 개발 컴퓨터에서는 일반적으로 문제가 되지 않습니다. 그러나 호스팅 공급자의 웹 서버에 사이트를 게시하는 경우 해당 권한을 명시적으로 설정해야 할 수 있습니다. 호스팅 공급자의 서버에서 이 코드를 실행하고 오류가 발생하면 호스팅 공급자와 검사 해당 권한을 설정하는 방법을 알아보세요.

마지막으로 도우미의 WebImage 메서드에 Save 저장 경로를 전달합니다. 그러면 업로드된 이미지가 새 이름 아래에 저장됩니다. save 메서드는 다음과 photo.Save(@"~\" + imagePath)같습니다. 전체 경로는 현재 웹 사이트 위치인 에 추가 @"~\"됩니다. (연산자에 ~ 대한 자세한 내용은 Razor 구문을 사용하여 ASP.NET 웹 프로그래밍 소개를 참조하세요.)

이전 예제와 마찬가지로 페이지의 본문에는 이미지를 표시하는 요소가 포함되어 있습니다 <img> . 가 설정된 <img> 경우 imagePath 요소가 렌더링되고 해당 src 특성이 값으로 imagePath 설정됩니다.
브라우저에서 페이지를 실행합니다.
이미지를 업로드하고 페이지에 표시되는지 확인합니다.
사이트에서 images 폴더를 엽니다. 파일 이름이 다음과 같이 표시되는 새 파일이 추가된 것을 볼 수 있습니다.

45ea4527-7ddd-4965-b9ca-c6444982b342_MyPhoto.png

이름에 접두사로 GUID를 사용하여 업로드한 이미지입니다. (사용자 고유의 파일에는 다른 GUID가 있으며 이름이 MyPhoto.png.)

팁

GUID 정보

GUID(전역적으로 고유한 ID)는 일반적으로 와 같은 936DA01F-9ABD-4d9d-80C7-02AF85C822A8형식으로 렌더링되는 식별자입니다. 숫자와 문자(A-F)는 GUID마다 다르지만 모두 8-4-4-4-12자 그룹을 사용하는 패턴을 따릅니다. (기술적으로 GUID는 16비트/128비트 숫자입니다.) GUID가 필요한 경우 GUID를 생성하는 특수 코드를 호출할 수 있습니다. GUID 뒤에 아이디어는 숫자의 엄청난 크기 (3.4 x 10³⁸)와 그것을 생성하기위한 알고리즘 사이에, 결과 번호는 사실상 종류의 하나가 될 보장된다는 것입니다. 따라서 GUID는 동일한 이름을 두 번 사용하지 않도록 보장해야 하는 경우 사물의 이름을 생성하는 좋은 방법입니다. 물론 단점은 GUID가 특히 사용자에게 친숙하지 않기 때문에 코드에서만 이름을 사용할 때 사용되는 경향이 있다는 것입니다.

이미지 크기 조정

웹 사이트에서 사용자의 이미지를 허용하는 경우 이미지를 표시하거나 저장하기 전에 이미지의 크기를 조정하는 것이 좋습니다. 도우미를 WebImage 다시 사용할 수 있습니다.

이 절차에서는 업로드된 이미지의 크기를 조정하여 썸네일을 만든 다음, 썸네일 및 원본 이미지를 웹 사이트에 저장하는 방법을 보여 줍니다. 페이지에 썸네일을 표시하고 하이퍼링크를 사용하여 사용자를 전체 크기의 이미지로 리디렉션합니다.

[스크린샷은 썸네일 이미지 페이지를 보여줍니다.]

Thumbnail.cshtml이라는 새 페이지를 추가합니다.
images 폴더에서 thumbs라는 하위 폴더를 만듭니다.
페이지의 기존 콘텐츠를 다음으로 바꿉다.
```
@{  
    WebImage photo = null;
    var newFileName = "";
    var imagePath = "";
    var imageThumbPath  = "";

    if(IsPost){
        photo = WebImage.GetImageFromRequest();
        if(photo != null){
             newFileName = Guid.NewGuid().ToString() + "_" +
                 Path.GetFileName(photo.FileName);
             imagePath = @"images\" + newFileName;
             photo.Save(@"~\" + imagePath);

            imageThumbPath = @"images\thumbs\" + newFileName;
            photo.Resize(width: 60, height: 60, preserveAspectRatio: true,
               preventEnlarge: true);
            photo.Save(@"~\" + imageThumbPath);        }
    }
}
<!DOCTYPE html>
<html>
<head>
  <title>Resizing Image</title>
</head>
<body>
<h1>Thumbnail Image</h1>
  <form action="" method="post" enctype="multipart/form-data">
    <fieldset>
      <legend> Creating Thumbnail Image </legend>
      <label for="Image">Image</label>
      <input type="file" name="Image" />
      <br/>
      <input type="submit" value="Submit" />
    </fieldset>
  </form>
    @if(imagePath != ""){
    <div class="result">
        <img src="@imageThumbPath" alt="Thumbnail image" />
        <a href="@Html.AttributeEncode(imagePath)" target="_Self">
            View full size
        </a>
    </div>

    }
</body>
</html>
```
이 코드는 이전 예제의 코드와 비슷합니다. 차이점은 이 코드는 이미지의 썸네일 복사본을 만든 후 일반적으로 한 번, 한 번 이미지를 두 번 저장한다는 것입니다. 먼저 업로드된 이미지를 가져와 서 images 폴더에 저장합니다. 그런 다음 썸네일 이미지에 대한 새 경로를 생성합니다. 실제로 썸네일을 만들려면 도우미의 Resize 메서드를 호출 WebImage 하여 60픽셀x60픽셀 이미지를 만듭니다. 이 예제에서는 가로 세로 비율을 유지하는 방법과 이미지가 확대되는 것을 방지하는 방법을 보여 줍니다(새 크기가 실제로 이미지를 크게 만드는 경우). 그런 다음 크기가 조정된 이미지가 thumbs 하위 폴더에 저장됩니다.

태그의 끝에서 이전 예제에서 본 동적 src 특성과 동일한 <img> 요소를 사용하여 이미지를 조건부로 표시합니다. 이 경우 썸네일을 표시합니다. 또한 요소를 사용하여 <a> 이미지의 큰 버전에 대한 하이퍼링크를 만듭니다. 요소의 src<img> 특성과 마찬가지로 요소의 <a> 특성을 에 있는 imagePath모든 특성으로 동적으로 설정합니다href. 경로가 URL로 작동할 수 있는지 확인하려면 경로의 Html.AttributeEncode 예약 문자를 URL에서 정상인 문자로 변환하는 메서드에 전달 imagePath 합니다.
브라우저에서 페이지를 실행합니다.
사진을 업로드하고 썸네일이 표시되는지 확인합니다.
썸네일을 클릭하여 전체 크기 이미지를 확인합니다.
이미지 및 이미지/엄지 손가락에서 새 파일이 추가되었습니다.

이미지 회전 및 대칭 이동

도우미를 WebImage 사용하면 이미지를 대칭 이동 및 회전할 수도 있습니다. 이 절차에서는 서버에서 이미지를 가져와 이미지를 거꾸로 뒤집고(세로로) 저장한 다음, 페이지에 대칭 이동된 이미지를 표시하는 방법을 보여줍니다. 이 예제에서는 서버에 이미 있는 파일만 사용하고 있습니다(Photo2.jpg). 실제 애플리케이션에서는 이전 예제에서와 같이 이름이 동적으로 표시되는 이미지를 대칭 이동했을 수 있습니다.

[스크린샷은 이미지 세로 대칭 이동 페이지를 보여줍니다.]

FlipImage.cshtml이라는 새 페이지를 추가합니다.
페이지의 기존 콘텐츠를 다음으로 바꿉다.
```
@{  var imagePath= "";
    WebImage photo = new WebImage(@"~\Images\Photo2.jpg");
    if(photo != null){
        imagePath = @"images\Photo2.jpg";
        photo.FlipVertical();
        photo.Save(@"~\" + imagePath);
     }
}
<!DOCTYPE html>
<html>
<head>
  <title>Get Image From File</title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
<h1>Flip Image Vertically</h1>
@if(imagePath != ""){
  <div class="result">
    <img src="@imagePath" alt="Image" />
  </div>
}
</body>
</html>
```
코드는 도우미를 WebImage 사용하여 서버에서 이미지를 가져옵니다. 이미지를 저장하기 위해 이전 예제에서 사용한 것과 동일한 기술을 사용하여 이미지의 경로를 만들고 를 사용하여 WebImage이미지를 만들 때 해당 경로를 전달합니다.
```
WebImage photo = new WebImage(@"~\Images\Photo2.jpg");
```
이미지가 발견되면 이전 예제에서와 같이 새 경로 및 파일 이름을 생성합니다. 이미지를 대칭 이동하려면 메서드를 호출한 FlipVertical 다음 이미지를 다시 저장합니다.

특성이 로 설정된 imagePath요소를 src 사용하여 <img> 페이지에 이미지가 다시 표시됩니다.
브라우저에서 페이지를 실행합니다. Photo2.jpg 이미지가 거꾸로 표시됩니다.
페이지를 새로 고치거나 페이지를 다시 요청하여 이미지가 오른쪽 위로 다시 대칭 이동되는지 확인합니다.

이미지를 회전하려면 또는 를 호출하는 대신 또는 FlipHorizontalRotateRight를 호출 FlipVerticalRotateLeft 한다는 점을 제외하고 동일한 코드를 사용합니다.

이미지에 워터마크 추가

[스크린샷은 이미지에 워터마크 추가 페이지를 보여줍니다.]

Watermark.cshtml이라는 새 페이지를 추가합니다.
페이지의 기존 콘텐츠를 다음으로 바꿉다.
```
@{  var imagePath= "";
    WebImage photo = new WebImage(@"~\Images\Photo3.jpg");
    if(photo != null){
        imagePath = @"images\Photo3.jpg";
        photo.AddTextWatermark("My Watermark", fontColor:"Yellow", fontFamily:
            "Arial");
        photo.Save(@"~\" + imagePath);    }
}
<!DOCTYPE html>
<html>
<head>
  <title>Water Mark</title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
<h1>Adding a Watermark to an Image</h1>
@if(imagePath != ""){
  <div class="result">
    <img src="@imagePath" alt="Image" />
  </div>
}
</body>
</html>
```
이 코드는 이전의 FlipImage.cshtml 페이지의 코드와 같습니다(이번에는 Photo3.jpg 파일을 사용하지만). 워터마크를 추가하려면 이미지를 저장하기 전에 도우미의 AddTextWatermark 메서드를 호출 WebImage 합니다. 에 대한 AddTextWatermark호출에서 "내 워터마크" 텍스트를 전달하고 글꼴 색을 노란색으로 설정하고 글꼴 패밀리를 Arial로 설정합니다. 도우미는 여기에 표시되지 않지만 불투명도, WebImage 글꼴 패밀리 및 글꼴 크기 및 워터마크 텍스트의 위치를 지정할 수도 있습니다. 이미지를 저장할 때 읽기 전용이 아니어야 합니다.

앞에서 본 것처럼 src 특성이 로 설정된 @imagePath요소를 사용하여 <img> 페이지에 이미지가 표시됩니다.
브라우저에서 페이지를 실행합니다. 이미지의 오른쪽 아래 모서리에 "내 워터마크"라는 텍스트가 표시됩니다.

이미지를 워터마크로 사용

[스크린샷은 이미지를 워터마크로 사용 페이지를 보여줍니다.]

ImageWatermark.cshtml이라는 새 페이지를 추가합니다.
로고로 사용할 수 있는 이미지 폴더에 이미지를 추가하고 이미지 이름을 MyCompanyLogo.jpg. 이 이미지는 너비가 80픽셀, 높이가 20픽셀로 설정되면 명확하게 볼 수 있는 이미지여야 합니다.
페이지의 기존 콘텐츠를 다음으로 바꿉다.
```
@{  var imagePath = "";
   WebImage WatermarkPhoto = new WebImage(@"~\" +
        @"\Images\MyCompanyLogo.jpg");
    WebImage photo = new WebImage(@"~\Images\Photo4.jpg");
    if(photo != null){
        imagePath = @"images\Photo4.jpg";
        photo.AddImageWatermark(WatermarkPhoto, width: 80, height: 20,
           horizontalAlign:"Center", verticalAlign:"Bottom",
           opacity:100,  padding:10);
      photo.Save(@"~\" + imagePath);
   }
}
<!DOCTYPE html>
<html>
<head>
  <title>Image Watermark</title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<body>
  <h1>Using an Image as a Watermark</h1>
  @if(imagePath != ""){
    <div class="result">
      <img src="@imagePath" alt="Image" />
    </div>
  }
</body>
</html>
```
이는 이전 예제의 코드에 대한 또 다른 변형입니다. 이 경우 를 호출 AddImageWatermark 하여 이미지를 저장하기 전에 대상 이미지(Photo3.jpg)에 워터마크 이미지를 추가합니다. 를 호출 AddImageWatermark할 때 너비를 80픽셀로 설정하고 높이를 20픽셀로 설정합니다. MyCompanyLogo.jpg 이미지는 가운데에 가로로 정렬되고 대상 이미지의 아래쪽에 세로로 정렬됩니다. 불투명도는 100%로 설정되고 안쪽 여백은 10픽셀로 설정됩니다. 워터마크 이미지가 대상 이미지보다 크면 아무 일도 발생하지 않습니다. 워터마크 이미지가 대상 이미지보다 크고 이미지 워터마크의 안쪽 여백을 0으로 설정하면 워터마크가 무시됩니다.

이전과 마찬가지로 요소 및 동적 src 특성을 사용하여 <img> 이미지를 표시합니다.
브라우저에서 페이지를 실행합니다. 워터마크 이미지가 기본 이미지의 아래쪽에 나타납니다.

추가 리소스

ASP.NET 웹 페이지 사이트의 파일 작업

Razor 구문을 사용하여 ASP.NET 웹 페이지 프로그래밍 소개

다음을 통해 공유

ASP.NET 웹 페이지(Razor) 사이트에서 이미지 작업

자습서에서 사용되는 소프트웨어 버전

동적으로 웹 페이지에 이미지 추가

이미지 업로드

GUID 정보

이미지 크기 조정

이미지 회전 및 대칭 이동

이미지에 워터마크 추가

이미지를 워터마크로 사용

추가 리소스

피드백

추가 리소스