ASP.NET MVC Website, how to generate background img for div but the img is on a remote drive

问题

The View:

<div class="project" style="background-image: url('@project.ProjectLogoPath')">

The Model:

public List<Projects> GetProjects() {
            DataContext dbContext = new DataContext();
            List<Projects> projects_list = new List<Projects>();
            foreach (Project p in dbContext.Projects) {
                Projects c = new Projects();
                c.ProjectName = p.p_name;
                c.ProjectNumber = p.p_num;
                c.CompanyName = p.co_name;
                c.ClientName = p.cl_name;
                c.ProjectLogoPath = "../../Storage/" + p.co_name + "/Clients/" + p.cl_name + "/" + p.p_num + "_" + p.p_name + "/99_Other/project_logo.png";
                projects_list.Add(c);
            }
            return projects_list;
        }

The Controller:

public ActionResult Index() {
            ProjectsBAL b = new ProjectsBAL();
            List<Projects> c = b.GetProjects();
            ViewBag.ProjectsData = c;

            UserBAL u = new UserBAL();
            Users use = u.GetUser();
            ViewBag.Username = use.Username;
            ViewBag.Domain = use.Domain;
            ViewBag.Company = use.Company;

            return View("Index");
        }

This works perfectly well. The problem is that all my 1000 Terabytes of content data cannot be stored in the subfolder, the content will be stored on a remote server and the drive will be mounted to the IIS server, drive letter M. My question is how do I make the path correctly? The line of concern is this:

c.ProjectLogoPath = "../../Storage/" + p.co_name + "/Clients/" + p.cl_name + "/" + p.p_num + "_" + p.p_name + "/99_Other/project_logo.png";

I've already tried:

c.ProjectLogoPath = "M:/Storage/" + p.co_name + "/Clients/" + p.cl_name + "/" + p.p_num + "_" + p.p_name + "/99_Other/project_logo.png";

I've also tried replacing all "/" with "\". Also tried using "file://///" at the start which seemed to work only sporadically (e.g. wouldn't work when I refreshed the page but would work if I pressed the Home button).

Basically, just imagine that the standard content folder for your website is so immensely large that it is no longer appropriate to store it on the web server, but rather on another data server. That is the problem I am trying to solve.

回答1:

By definition if the server you are storing the images on is not a web server, then people browsing your web site will not be able to access them, this is indeed correct as you don't want EVERYTHING available on the web, only the things you want to serve with a web server!!!

So the solutions are;

1.) Install a web server on your 'data/image' server, but make sure it ONLY serves the images.

2.) Create an Action on your actual web server, maybe GetImage(String name) which then does a return File("M:/Storage/" + name), you then use this url in the image source

This is obviously simplified but hopefully gives you the idea? You cannot set the source of an image to a local path because it is the browser that is requesting the image not the server. Thus you need to use option 1 to enable the browser to get at the images, or option 2 to 'pass' the images through to the web. Makes sense?

回答2:

You can create an action method which returns the image. You may call th

[OutputCache(Duration = 600)]
public ActionResult GetImg(string companyName,string clientName,
                            string projectName,string projectNumber)
{
    var networkPath = @"M:/Storage/";
    var fileName = Path.Combine(networkPath, companyName);
    //Fix here as needed. I just glanced at your path :(
    fileName = Path.Combine(fileName, "/Clients");
    fileName = Path.Combine(fileName, clientName);
    fileName = Path.Combine(fileName, projectNumber+"_"+projectName);
    fileName = Path.Combine(fileName, "/99_Other/project_logo.png");
    return File(fileName, "image/png");
}

now from your view, call this method by passing the parameter values.

<div class="project" style="background-image: url('@Url.Action("GetImg",
      new { companyName=project.CompanyName,clientName=project.ClientName,
      projectNumber = project.ProjectNumber,projectName=project.ProjectName})')"></div>

来源：https://stackoverflow.com/questions/41105320/asp-net-mvc-website-how-to-generate-background-img-for-div-but-the-img-is-on-a