How to retrieve image column from SharePoint List using REST API

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

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();

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
  });