Опубликован: 15.06.2011 | Доступ: свободный | Студентов: 708 / 59 | Оценка: 4.25 / 4.00 | Длительность: 14:09:00
Самостоятельная работа 7:

Web Matrix. Работа с изображениями. Добавление функции поиск

Загрузка изображений на сервер

1.Добавим к проекту новую страницу и назовем ее UploadImage.cshtml:

2.Изменим начальный код страницы UploadImage.cshtml на:

@{  WebImage img = null;
    var newFileName = "";
    var imagePath = "";
     
    if(IsPost){
        img = WebImage.GetImageFromRequest();
        if(img != null){
            newFileName = Path.GetFileName(img.FileName);
            imagePath = @"image\" + newFileName;
             
            img.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>

В теге <body></body> используется HTML элемент управления для загрузки файлов:

<input type="file" name="Image" />

Рис. 12.7.

Что бы получить загруженное изображение используется класс WebImage, который содержит различные методы для работы с изображением. В частности метод WebImage.GetImageFromRequest получает загруженное изображение и присваивает переменной img:

img = WebImage.GetImageFromRequest();

Свойство FileName возвращает имя файла, включая путь до этого файла:

C:\Users\Public\Pictures\Sample Pictures\image5.jpg

Метод Path.GetFileName, возвращает имя файла и расширение указанной строки пути:

newFileName = Path.GetFileName(img.FileName);

Для сохранения изображения в папку используется метод Save, класса WebImage:

imagePath = @"image\" + newFileName;  
            img.Save(@"~\" + imagePath);

Символы @"~\" указывают на текущее расположение проекта.

3.Запустим проект, выберем какое-нибудь изображение, и нажмем кнопку "Submit". Загруженное изображение отобразиться в окне браузера:

Проверим, загрузилось ли изображение в папку проекта - "image". Для этого правой кнопкой мыши, щелкнем на папке "image" выберем "обновить":


Рис. 12.9.

Загруженное изображение отобразиться в списке:


Рис. 12.10.