I have the below code which allows me to get all type of document URL for SharePoint which can be opened from link but there are images when trying to open it load the same page
here is a format for URL
<a target='_blank' href='"+data.d.results[i].ServerRedirectedEmbedUrl+"'>"+data.d.results[i].FileLeafRef+"</a>
function getList() {
var fullUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('Reports')/items?$top=1000&$select=Created,Author/FirstName,Author/LastName,FileLeafRef,ServerRedirectedEmbedUrl&$expand=Author/Id&$filter=FSObjType eq 0";
console.log(fullUrl);
$.ajax({
url: fullUrl,
type: "GET",
headers: {
"accept": "application/json;odata=verbose",
"content-type": "application/json;odata=verbose",
},
success: onQuerySucceeded,
error: onQueryFailed
});
}
function onQuerySucceeded(data) {
var listItemInfo = " ";
for (var i = 0; i < data.d.results.length; i++) {
if (data.d.results[i].FileSystemObjectType != 1) {
listItemInfo += "<div class=panel-heading><h4><a target='_blank' href='"+data.d.results[i].ServerRedirectedEmbedUrl+"'>"+data.d.results[i].FileLeafRef+"</a></h4><p>"+String.format("{0:d}",new Date(data.d.results[i].Created))+", "+data.d.results[i].Author.FirstName+" "+data.d.results[i].Author.LastName+"</p></div>";
}
}
console.log(listItemInfo);
$("#divResults").html(listItemInfo);
};
function onQueryFailed() {
alert('Error!');
}