다음을 통해 공유


Microsoft.Common.FileUpload UI 요소

사용자가 업로드할 파일을 하나 이상 지정할 수 있게 하는 컨트롤입니다.

UI 샘플

Azure Portal에서 Microsoft.Common.FileUpload UI 요소의 스크린샷

스키마

{
  "name": "element1",
  "type": "Microsoft.Common.FileUpload",
  "label": "Some file upload",
  "toolTip": "",
  "constraints": {
    "required": true,
    "accept": ".doc,.docx,.xml,application/msword"
  },
  "options": {
    "multiple": false,
    "uploadMode": "file",
    "openMode": "text",
    "encoding": "UTF-8"
  },
  "visible": true
}

샘플 출력

options.multiple이 false이고 options.uploadMode가 file이면 출력에 파일의 내용이 JSON 문자열로 포함됩니다.

"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."

options.multiple이 true이고 options.uploadMode가 file이면 출력에 파일의 내용이 JSON 배열로 포함됩니다.

[
  "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
  "Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
  "Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.",
  "Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
]

options.multiple이 false이고 options.uploadMode가 url이면 출력에 URL이 JSON 문자열로 포함됩니다.

"https://myaccount.blob.core.windows.net/pictures/profile.jpg?sv=2013-08-15&st=2013-08-16&se=2013-08-17&sr=c&sp=r&rscd=file;%20attachment&rsct=binary &sig=YWJjZGVmZw%3d%3d&sig=a39%2BYozJhGp6miujGymjRpN8tsrQfLo9Z3i8IRyIpnQ%3d"

options.multiple이 true이고 options.uploadMode가 url이면 출력에 URL 목록이 JSON 배열로 포함됩니다.

[
  "https://myaccount.blob.core.windows.net/pictures/profile1.jpg?sv=2013-08-15&st=2013-08-16&se=2013-08-17&sr=c&sp=r&rscd=file;%20attachment&rsct=binary &sig=YWJjZGVmZw%3d%3d&sig=a39%2BYozJhGp6miujGymjRpN8tsrQfLo9Z3i8IRyIpnQ%3d",
  "https://myaccount.blob.core.windows.net/pictures/profile2.jpg?sv=2013-08-15&st=2013-08-16&se=2013-08-17&sr=c&sp=r&rscd=file;%20attachment&rsct=binary &sig=YWJjZGVmZw%3d%3d&sig=a39%2BYozJhGp6miujGymjRpN8tsrQfLo9Z3i8IRyIpnQ%3d",
  "https://myaccount.blob.core.windows.net/pictures/profile3.jpg?sv=2013-08-15&st=2013-08-16&se=2013-08-17&sr=c&sp=r&rscd=file;%20attachment&rsct=binary &sig=YWJjZGVmZw%3d%3d&sig=a39%2BYozJhGp6miujGymjRpN8tsrQfLo9Z3i8IRyIpnQ%3d"
]

CreateUiDefinition을 테스트할 때 일부 브라우저(예: Chrome)에서는 브라우저 콘솔의 Microsoft.Common.FileUpload 요소로 생성된 URL을 자릅니다. 개별 링크를 마우스 오른쪽 단추로 클릭하여 전체 URL을 복사해야 할 수도 있습니다.

설명

  • constraints.accept는 브라우저의 파일 대화 상자에 표시되는 파일 형식을 지정합니다. 허용되는 값은 HTML5 사양을 참조하세요. 기본값은 null합니다.
  • options.multipletrue로 설정되면 사용자가 브라우저의 파일 대화 상자에서 둘 이상의 파일을 선택할 수 있게 합니다. 기본값은 false입니다.
  • 이 요소는 options.uploadMode 값에 따라 두 가지 모드로 파일 업로드를 지원합니다. file을 지정하면 출력에 파일의 내용이 Blob으로 포함됩니다. url을 지정하면 파일은 임시 위치에 업로드되고 출력에 Blob의 URL이 포함됩니다. 임시 Blob은 24시간 후에 제거됩니다. 기본값은 file입니다.
  • 업로드된 파일은 보호됩니다. 출력 URL에는 배포 중에 파일에 액세스하기 위한 SAS 토큰이 포함됩니다.
  • options.openMode 값은 파일을 읽는 방법을 결정합니다. 파일이 일반 텍스트여야 하면 text를 지정합니다. 그렇지 않으면 binary를 지정합니다. 기본값은 text입니다.
  • options.uploadModefile로 설정하고 options.openModebinary로 설정하면 출력이 base64로 인코딩됩니다.
  • options.encoding은 파일을 읽을 때 사용할 인코딩을 지정합니다. 기본값은 UTF-8이며, options.openModetext로 설정한 경우에만 사용됩니다.

다음 단계