4

How to retrieve image column from SharePoint List using REST API enter image description here

1
  • Why REST and not JSOM or other options? i.e. What is the end result you are trying to achieve? – Danny '365CSI' Engelman Oct 16 '15 at 16:27
5

You should know Hyperlink = Picture. So the way of getting Hyperlink is the way of getting Picture column. You just need to make GET request to the following URL.

/_api/Web/Lists/getbytitle('Your List Title')/Items?$select=Image

Response will like following

{
    "d": {
        "results": [{
            "__metadata": {
                "id": "cba8c563-bc0d-4f2b-91d5-a851b3f35a4f",
                "uri": "https://yourSite.sharepoint.com/_api/Web/Lists(guid'aaafa7f3-35e8-4cab-8a9f-ee6864c19747')/Items(3)",
                "etag": "\"1\"",
                "type": "SP.Data.ModalLogsListItem"
            },
            "Image": {
                "__metadata": {
                    "type": "SP.FieldUrlValue"
                },
                "Description": "image",
                "Url": "http://i.stack.imgur.com/mwIhm.png"
            }
        }]
    }
}

If you have time, then pass some time with this article.

12
0

I can't get Atish Dipongkor's solution to work

Sharepoint just sucks.

You can get a geolocation field which is a "complex" object (=has subproperties : altitude, longitude,latitude)

    "place": {
      "__metadata": {
        "type": "SP.FieldGeolocationValue"
      },
      "Altitude": 0,
      "Latitude": 48.38884,
      "Longitude": -40.48393,
      "Measure": 0
    },

But you can't get image field which should have exactly the same structure (title,url) ! Why is that ? This is just plain stupid. This won't save bandwidth or anything.

On the contrary, because of this stupid design you need to do N subqueries (one for each of your result) to get the image for each of you result.

So you need a first pass to search results
/_api/web/lists(guid'the_guid')/items?$filter=...

Then you need to iterate EVERY result to get the image /_api/web/lists(guid'the_guid')/items(xx)/FieldValuesAsHtml?$select=your image column names

https://stackoverflow.com/questions/25852997/retrieve-publishing-image-field-with-sharepoint-2013-rest-api-csom

0

I just wanted to add(C# code) if you want to retrieve image url from list with Hyperlink column. Please see below-

        using(SPSite site = new SPSite("Site Url"))
        {
           using( SPWeb web = site.OpenWeb())
           {
               SPList list = web.Lists["CountryList"];
              SPListItemCollection items =list.Items;
               foreach(SPListItem f in items)
               {
                   SPFieldUrlValue field = new SPFieldUrlValue(f["Image"].ToString());
                   Console.WriteLine("Image Url:" + field.Url);
                   Console.ReadLine();
0

This question is similar to this post

Where I added the following solution:

I found a way to get all data in a single call: use the RenderListDataAsStream POST REST call:

this._webAbsoluteUrl +
"/_api/web/GetList(@listUrl)/RenderListDataAsStream?
@listUrl=%27%2Fsites%2F<scName>%2Flists%2F<listUrlName>%27";

It gives all simple text field data, can be used for more complex fields such as managed metadata & lookup fields, but more importantly in this case, it gives you the url of the image that was used for the Publishing Image column.

You do need to parse it from this structure:

"<div dir="" class="ms-rtestate-field"><img alt="" src="/sites/<scName>/SiteAssets/<myImageOnSharepoint>.jpg" style="BORDER&#58;0px solid;" /></div>"

Code sample (SPFx with TypeScript):

const requestHeaders: Headers = new Headers();
requestHeaders.append("Content-type", "application/json");
requestHeaders.append("Accept", "application/json");

var body =
{ parameters:
  {
    DatesInUtc: "true"
  }
};

const httpClientOptions: IHttpClientOptions = {
  body: JSON.stringify(body),
  headers: requestHeaders
};
const queryUrlGetAllItems: string =
  this._webAbsoluteUrl +
  `/_api/web/GetList(@listUrl)/RenderListDataAsStream?@listUrl=%27%2Fsites%2F<scName>%2Flists%2F<listUrlName>%27`;

return this._webPartContext.spHttpClient
  .post(queryUrlGetAllItems, SPHttpClient.configurations.v1, httpClientOptions)
  .then((response: any) => {
    if (response.status >= 200 && response.status < 300) {
      return response.json();
    } else {
      return Promise.reject(new Error(JSON.stringify(response)));
    }
  })
  .then((data: any) => {
    if (data) {
      for (let i = 0; i < data.Row.length; i++) {
        let item = data.Row[i];
        // ... process data
      }
    }
    // ... return value
  });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.