我有一个如下表
{{ _self.renderJob(fields) }}
如何将图像保存到电影海报字段以及如何查看
答案 0 :(得分:1)
[MoviePoster] [varbinary](max) NULL
- 您必须将图像作为BLOB插入 - 插入blob脚本:
INSERT INTO [Movies](MoviePoster)
VALUES (SELECT * FROM OPENROWSET (BULK 'your img url', SINGLE_BLOB))
- 在视图中显示图片:
<img src='data:image/jpeg;base64, <--data from db-->' />
答案 1 :(得分:1)
如何在服务器上保存电影海报,请说:
/content/images/movieposters/thearrival.jpg
并在MoviePoster
字段中仅存储文件名thearrival.jpg
我个人更喜欢这种方法,因为如果让我们说你的数据库会增长,你会有更多的访问者......那么,你就可以把你所有的电影海报都移到另一台服务器上,并且可以节省很多来自应用程序服务器的负载。
答案 2 :(得分:0)
家庭控制器
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace test2.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
return View();
}
public ActionResult FileUpload(HttpPostedFileBase file)
{
if (file != null)
{
Database1Entities db = new Database1Entities();
string ImageName = System.IO.Path.GetFileName(file.FileName);
string physicalPath =Server.MapPath("~/images/"+ ImageName);
// save image in folder
file.SaveAs(physicalPath);
//save new record in database
tblA newRecord = new tblA();
newRecord.fname = Request.Form["fname"];
newRecord.lname = Request.Form["lname"];
newRecord.MoviePoster = ImageName;
db.tblAs.Add(newRecord);
db.SaveChanges();
}
//Display records
return RedirectToAction("../home/Display/");
}
public ActionResult Display()
{
return View();
}
}
}
索引视图
@{
ViewBag.Title = "Index";
}
@using (Html.BeginForm("FileUpload", "Home", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
<div>
First name<br />
@Html.TextBox("fname") <br />
Last name<br />
@Html.TextBox("lname") <br />
Image<br />
<input type="file" name="file" id="file" style="width: 100%;" /> <br />
<input type="submit" value="Upload" class="submit" />
</div>
}
<强> DisplayView 强>
@{
ViewBag.Title = "Display";
}
@{
test2.Database1Entities db = new test2.Database1Entities();
}
@using (Html.BeginForm())
{
<table border="1">
<thead>
<tr>
<th>Image</th>
<th>First name</th>
<th>Last name</th>
</tr>
</thead>
<tbody>
@foreach (var item in db.tblAs)
{
<tr>
<td><img src="~/images/@item.imageUrl" width="100" height="100" /> </td>
<td>@item.fname</td>
<td>@item.lname</td>
</tr>
}
</tbody>
</table>
}
OutPut将是一张包含数据库中已查看图像的表格
答案 3 :(得分:0)
[HttpPost]
public ActionResult AddEmployee(HttpPostedFileBase file)
{
using(DbEntities DB = new DbEntities())
{
TblImage tblimg=new TblImage();
if (file != null)
{
var fileName = Path.GetFileName(file.FileName);
file.SaveAs(Server.MapPath("~/Data/EmployeeProfileImage/" + fileName));
tblimg.image = "~/Data/EmployeeProfileImage/" + fileName;
}
DB.TblImages.Add(tblimg);
DB.SaveChanges();
}
return View();
}
答案 4 :(得分:0)
INDEX
@{
ViewBag.Title = "Index";
}
<link href="~/bootstrapp/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/bootstrapp/js/bootstrap.min.js"></script>
<style>
table, th, td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
<h2>Index</h2>
@using (Html.BeginForm("Index", "Candidate", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
<div class="container">
<table>
<tr><td colspan="2" style="width:800px;height:50px">candidate</td></tr>
<tr><td>@*<label>Id</label><input type="number" name="candidateID" />*@</td></tr>
<tr>
<td style ="width:10px;height:10px">
<label>Name</label> <input type="text" name="Name" />
</td>
<td style="width:80px;height:50px"><label>Binary Image</label>
<input type="file" name="file1" id="file1" style="width: 100%;" /> <br />
</td>
</tr>
<tr>
<td>
<label>Address</label> <input type="text" name="address" />
</td>
<td>
<label>Path Image</label> <input type="file" name="file2" id="file2" style="width: 100%;" />
</td>
</tr>
<tr>
<td>
<label>JobProfile</label> <input type="text" name="JobProfile" />
</td>
<td>
<label>Email</label> <input type="text" name="email" />
</td>
</tr>
<tr><td>
<label>Phone No.</label> <input type="number" name="phone" />
</td><td ><input type="submit" value="Submit"/></td></tr>
</table>
</div>
}
@Html.Partial("~/Views/Candidate/detail.cshtml")
DETAIL
@*@model List< angularmvcdemo.CandidateDetail>*@
@using angularmvcdemo.Models;
<link href="~/bootstrapp/css/bootstrap.min.css" rel="stylesheet" />
<script src="~/bootstrapp/js/bootstrap.min.js"></script>
<style>
table, th, td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
@{
modeldataEntities db = new modeldataEntities();
//angularmvcdemo.modeldataEntities db = new angularmvcdemo.modeldataEntities();
}
<table>
<tr><td colspan="2" style="width:800px;height:50px">candidate</td></tr>
@foreach(var detail in db.CandidateDetails){
<tr>
<td style="width:10px;height:10px">
<label>Name</label>@detail.Name
@*<input type="text" name="Name" />*@ </td>
<td> binary image
@if (detail.BinaryPhoto != null)
{ var base64 = Convert.ToBase64String(detail.BinaryPhoto);
var imgsrc = string.Format("data:image/jpg;base64,{0}", base64);
<img src='@imgsrc' style="max-width:100px;max-height:100px" />
}
else { <img src="~/img/avatar-default.jpg" style="max-width:100px;max-height:100px" /> } </td>
</tr>
<tr>
<td>
<label>Address</label> @detail.address </td>
<td><label>path image</label>
@if(@detail.PathPhoto!=null){ <img src="@detail.PathPhoto" width="100" height="100" />
}else{ <img src="~/img/avatar-default.jpg" style="max-width:100px;max-height:100px" /> } </td>
</tr>
<tr>
<td>
<label>JobProfile</label>@detail.JobProfile </td>
<td>
<label>Email</label> @detail.email </td>
</tr>
<tr><td></td><td><label>Phone No.</label>
@detail.phone</td><</tr>
}
</table>
答案 5 :(得分:0)
实际上,您也可以将图像存储在Db上。如果您不想这样做,则无需将其作为文件保存在服务器上(如果您有很多电影,则很难管理)。
如果使用的是SQL Server,则存在“图像”数据类型。如果使用的是MySql,则应使用BLOB。
我正在使用MVC,所以:
模型(部分代码)(在SqlServer中,您将声明图像,模型内部的类型将为byte []:
public byte[] PersonImage { get; set; }
在同一模型中,您将需要一种方法来检索路径:
public string GetPicture()
{
if (PersonImage == null)
{
return null;
}
var base64Image = System.Convert.ToBase64String(PersonImage);
return $"data:{ImageContentType};base64,{base64Image}";
}
控制器内部的create动作(动作声明将需要接收一个IFormFile PersonImage),就我而言,我正在处理控制器的register动作上的图像上载(某些控制器代码已被删除为更加简洁):
public async Task<IActionResult> Register(RegisterViewModel model, Client client, Employee employee, Person person, IFormFile PersonImage, string returnUrl = null)
if (PersonImage != null)
{
using (var stream = new MemoryStream())
{
await PersonImage.CopyToAsync(stream);
person.PersonImage = stream.ToArray();
person.ImageContentType = PersonImage.ContentType;
}
}
_context.Add(person);
await _context.SaveChangesAsync();
现在是视图,您需要将enctype添加到表单中:
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4">
<form asp-route-returnUrl="@ViewData["ReturnUrl"]" method="post" enctype="multipart/form-data">
<h2 class="text-center font-weight-bold">Create a new account.</h2>
<hr />
<div asp-validation-summary="All" class="text-danger"></div>
<div class="form-group">
<label asp-for="@person.PersonImage" class="control-label"></label>
<input type="file" asp-for="@person.PersonImage" class="form-control" />
<span asp-validation-for="@person.PersonImage" class="text-danger"></span>
</div>
<button type="submit" class="btn btn-default">Register</button>
</form>
</div>
<div class="col-md-4"></div>
</div>
同样,我摘掉了大部分代码,以得到一个更好而简洁的示例。尝试将一些图像放入Db时,我很难找到它。