Упражнение — отправка файлов пользователей

Завершено

Ниже представлены шаги для добавления функции отправки в приложение.

Отображение элемента ввода файлов в браузере

1. Откройте Pages/Files.cshtml в редакторе кода.

2. Найдите существующий элемент form и обратите внимание, что он содержит элемент управления вводом файлов. Ввод содержит параметр asp-for со значением UploadedFile.

   <form method="post" enctype="multipart/form-data">
     <input asp-for="UploadedFile" type="file">
     <input type="submit" value="Upload File">
   </form>
   

3. Откройте Pages/Files.cs в редакторе кода.

4. Файл, отправленный пользователем, будет назначен свойству класса FilesModel с именем UploadedFile.

5. Найдите метод OnPostAsync() и замените существующий код на указанный ниже код для обработки копирования отправленного файла в MemoryStream. После создания потока он передается методу _graphFilesClient.UploadFile().

   if (UploadedFile == null || UploadedFile.Length == 0)
   {
     return;
   }
   
   _logger.LogInformation($"Uploading {UploadedFile.FileName}.");
   
   using (var stream = new MemoryStream()) {
     await UploadedFile.CopyToAsync(stream);
     await _graphFilesClient.UploadFile(
     UploadedFile.FileName, stream);
   }
   
   await OnGetAsync();
   

6. Прежде чем продолжать, сохраните файл Files.cshtml.cs.

Добавление поддержки отправки больших файлов

1. Откройте Graph/GraphFilesClient.cs в редакторе кода.

2. Найдите метод UploadFile() и обратите внимание, что он обрабатывает указанные ниже задачи.

   • Определяется размер отправленного файла.
   • Если размер файла превышает 4 МБ, выполняется вызов метода с именем UploadLargeFile().
   • Если размер файла не превышает 4 МБ, для отправки файла выполняется запрос PUT.

3. Найдите метод UploadLargeFile(). Он принимает путь элемента и поток файлов для отправки в качестве параметров. Он также создает объект DriveItemUploadableProperties, который обрабатывает замену файлов во время отправки, если они уже существуют в OneDrive.

4. Найдите комментарий Create the upload session. Сразу после комментария добавьте указанный ниже код.

   var uploadSession = await _graphServiceClient.Me.Drive.Root
       .ItemWithPath(itemPath)
       .CreateUploadSession(uploadProps)
       .Request()
       .PostAsync();
   
   // Max slice size must be a multiple of 320 KiB
   int maxSliceSize = 320 * 1024;
   var fileUploadTask = new LargeFileUploadTask<DriveItem>(uploadSession, stream, maxSliceSize);
   
   // Create a callback that is invoked after
   // each slice is uploaded
   IProgress<long> progress = new Progress<long>(prog =>
   {
     _logger.LogInformation($"Uploaded {prog} bytes of {stream.Length} bytes");
   });
   

   Этот код выполняет следующие задачи.

   • Создает сеанс отправки.
   • Создает объект LargeFileUploadTask и передает ему сеанс отправки, поток для отправки и максимальный размер среза.
   • Создает объект Progress отправки больших файлов, который регистрирует сведения о процессе отправки.

5. Найдите блок try и замените существующий код указанным ниже кодом.

   // Upload the file
   var uploadResult = await fileUploadTask.UploadAsync(progress);
   
   if (uploadResult.UploadSucceeded)
   {
       _logger.LogInformation($"Upload complete, item ID: { uploadResult.ItemResponse.Id}");
   }
   else
   {
       _logger.LogInformation("Upload failed");
   }
   

   Этот код запускает процесс отправки больших файлов и регистрирует сведения об успешном выполнении или сбое.

6. Прежде чем продолжать работу, сохраните файл GraphFilesClient.cs.

Запуск приложения

Пришло время запустить приложение и отправить файл!

1. Выполните следующий шаг в зависимости от редактора кода, которым пользуетесь.

   • Visual Studio

     Нажмите клавишу F5, чтобы выполнить сборку и запуск проекта.

   • Visual Studio Code или другой редактор кода

     Откройте окно терминала в папке Begin и запустите указанную ниже команду.

     dotnet run
     

2. Откройте браузер и перейдите по адресу https://localhost:5001.

3. Войдите с помощью клиента разработчика Microsoft 365, который использовался ранее при регистрации приложения Microsoft Entra.

4. Щелкните ссылку Файлы в заголовке, чтобы просмотреть файлы OneDrive пользователя.

5. Нажмите кнопку Выбрать файл и выберите на компьютере файл, который нужно отправить.

6. Нажмите кнопку Отправить файл, чтобы начать процесс отправки. После завершения отправки файла вы увидите, что файл указан на странице.

   Примечание.

   Если размер файла превышает 4 МБ, переключитесь в окно запущенного терминала. Вы увидите состояние отправленного файла. Когда отправка будет завершена, в окне терминала будет записано значение ИД элемента и имя файла отобразится в браузере.

   

7. Прежде чем продолжить, закройте браузер и нажмите CTRL+C в окне терминала, чтобы остановить сервер.

   Примечание.

   Если вы открыли проект в Visual Studio, можете закрыть браузер или нажать клавиши SHIFT+F5 в Visual Studio, чтобы остановить сервер. Закройте окно терминала Visual Studio, если оно еще открыто.