asp.net webApi and sending model with image property to to the client

Question

I have created and MVC 4 app and web api projects in one solution. from mvc 4 app I create products and upload related images, and from web api I send this product model to the client. somehow like this class:

class Product
{
GUID id;
string name;
string details;
string imageUrl;
}

for saving image to database in my MVC 4 app I do this way:

[HttpPost]
        public ActionResult Edit(Product product, HttpPostedFileBase image)
        {
            if (ModelState.IsValid)
            {
                if (image != null)
                {

                    string imageName = image.FileName;
                    string location = Path.Combine(Server.MapPath("~/Content/Images/") , imageName);
                    image.SaveAs(location);
                    product.Image= location;
                }

                menuItemRepository.SaveOrUpdate(product);
                TempData["message"] = string.Format("{0} has been saved", product.Name);
                return RedirectToAction("Index");
            }
            else
            {
                // there is something wrong with the data values 
                return View(product);
            }
        }

this is wep api controller for getting products list:

public List<MenuComponent> Get()
        {
             return _productRepository.GetAll().ToList();
        }

now web api sends all the products to the client

but image property in the json are absolute path:

"imageUrl":"C:\\Users\\Hashem\\Documents\\Visual Studio 2012\\Projects\\MyApp\\Content\\Images\\image01.jpg

I want the image link be something like that: http://localhost:22012/Content/images/image01.jpg

my client is an iOS app and after saving products to database I will download all the images using their image property.

so how can I get correct link?

I have added. but thats nothing special. web api just sends all the properties which are in the database without changing them. imagUrl in the database is what I have posted. — Hashem Aboonajmi
– Hashem Aboonajmi, Commented Feb 1, 2014 at 16:17

Wiktor Zychla · Accepted Answer · 2014-02-01 18:33:39Z

1

When an image is posted, you save it to a physical location

   string location = Path.Combine(Server.MapPath("~/Content/Images/") , imageName);

and store the very same absolute location in your database. Instead, have the image saved to a physical location but store the relative location in your database.

   string imageName = image.FileName;

   string location = Path.Combine(Server.MapPath("~/Content/Images/") , imageName);
   image.SaveAs(location);

   string rellocation = string.Format( "/Content/Images/{0}", imageName ); 
   product.Image = rellocation;

This way the JSON will return relative paths /Content/Images/image01/jpg.

If you need absolute server uris use

   string rellocation = Path.Combine( HttpRuntime.AppDomainAppVirtualPath, 
       string.Format( "/Content/Images/{0}", imageName ) );

This should return http://localhost:22012/Content/images/image01.jpg.

Edit: If this doesn't work for you for some reasons, try

   Uri uri = this.Request.Url;
   String appDomainPath = uri.Scheme + "://" + uri.Authority;

   string rellocation = Path.Combine ( appDomainPath, ... );

i.e. try to get the path from the current request path. This should work in an mvc controller.

edited Feb 1, 2014 at 18:33

answered Feb 1, 2014 at 16:29

Wiktor Zychla

48.5k6 gold badges83 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Hashem Aboonajmi Over a year ago

I have a problem here: as I mentioned I have 2 projects one for editing products in mvc 4, and one for sending data to the client using web api. (why I have 2 projects is because of I can't have one dependency resolver for both MVC and web api) mvc uploads images in its content directory and web api needs to access mvc content directory. is this possible? because images located in mvc content directory! how can I solve this?

Wiktor Zychla Over a year ago

Does it matter? Images are posted with mvc so that the uris will correctly be saved by the mvc application.

Hashem Aboonajmi Over a year ago

I have two projects in one solution one is myApp.Web.UI and another one is myApp.Web.Api. both uses one database. from web.UI I create products and upload their images. so images will be save in web.UI content directory. and web.api send the products info in the database to the client. if add web.api appdomain to image location before sending products to the client link be something like:myappWebApi/contnet/images/image01.jpg. but there is no image in this directory as webUi has uploaded images to its projects image directory!

Wiktor Zychla Over a year ago

You won't add webapi domain to the path. The above code runs in your mvc controller just when the image is posted. It was you who wrote that this runs in your mvc application. If your mvc application writes a full path to the image, including the mvc root path, then how webapi could change this if the full path is written into the database?

Hashem Aboonajmi Over a year ago

I try to write image path with absolute url path to DB. it will solve issues. but HttpRuntime.AppDomainAppVirtualPath jsut only gives me "/". nothing more! why?

|

Collectives™ on Stack Overflow

asp.net webApi and sending model with image property to to the client

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related