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" />
Что бы получить загруженное изображение используется класс 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" выберем "обновить":
Загруженное изображение отобразиться в списке:
