Piwigo.org

eliz82 · 2016-10-26 13:08:10

teekay wrote:
The only dependency is CORS, means the Piwigo Webserver has to set an Access-Control-Allow-Origin header. The piwigo.org demo server doesn't, so a jsfiddle won't work.

By the way, today I have discovered that CORS can be bypassed by javascript.
Simply load the url as script source. Then you can parse the data from that script.

http://stackoverflow.com/questions/6132 … out-jquery

So getting the json data from cross-domains without CORS enabled (like piwigo.org) is also possible.

@edit: actually this is not working because the data need to be jsonp not json.

Last edited by eliz82 (2017-01-18 14:07:47)

eliz82 · 2016-12-16 07:43:46

teekay wrote:
I'll add one using jQuery:

a similar one in vanilla javascript

Code:

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var p_site = 'http://yoursite.com/piwigo/ws.php'; //piwigo web api location
var p_query = '?format=json&method=pwg.categories.getImages&per_page=10&order=date_available%20desc'; //piwigo api query parameters
var request = new XMLHttpRequest();
request.open('GET', p_site + p_query, true);
request.onload = function() {
  if (request.status >= 200 && request.status < 400) {
    // Success!
    var mydata = JSON.parse(request.responseText);
    //alert(JSON.stringify(mydata, null, '    ')); //show the Piwigo Api response
    if (mydata.result.images) { //if response array is not null
      for (i=0; i < mydata.result.images.length; ++i) { //loop the response array
        document.getElementById('last10images').innerHTML += '<a href="'+ mydata.result.images[i].page_url + '"><img src="' + mydata.result.images[i].derivatives.square.url + '" /></a>';
      }
    }
  }
  else {
    // We reached our target server, but it returned an error
  }
};
request.onerror = function() {
  // There was a connection error of some sort
};
request.send();
</script>
</head>
<body>
<div id="last10images"></div>
</body>
</html>

the location of the html code need to be on the same domain as your piwigo gallery. otherwise you must enable CORS.

Last edited by eliz82 (2016-12-16 15:37:09)

eliz82 · 2017-01-18 14:33:58

eliz82 wrote:
So getting the json data from cross-domains without CORS enabled (like piwigo.org) is also possible.

@edit: actually this is not working because the data need to be jsonp not json.

well seems it works also with json if you converted to jsonp. example:

Code:

<!DOCTYPE html>
<html>
    <head>
    <meta http-equiv="cache-control" content="no-cache" />
    </head>
    <body>
        <div id="last10images"></div>
        <script type="text/javascript">
    var json_url = 'http://piwigo.org/demo/ws.php?format=json&method=pwg.categories.getImages&per_page=5&order=date_available%20desc';
        function myCallback1(mydata) {
      //alert(JSON.stringify(mydata, null, '    ')); //show the Piwigo Api response
      if (mydata.result.images) { //if response array is not null
        for (i=0; i < mydata.result.images.length; ++i) { //loop the response array
          document.getElementById('last10images').innerHTML += '<a href="'+ mydata.result.images[i].page_url + '" target="_blank"><img src="' + mydata.result.images[i].derivatives.square.url + '" /></a>';
        }
      }
    }
    var script = document.createElement('script');
    script.src = 'https://json2jsonp.com/?url=' + encodeURIComponent(json_url) + '&callback=myCallback1';
    document.getElementsByTagName('head')[0].appendChild(script);
        </script>
    </body>
</html>

this is useful if you don't have access to PHP on your server side (only html), or to enable CORS on the piwigo gallery server side. very rare case i would say, but i presented just for programing fun

Last edited by eliz82 (2017-01-18 14:35:23)

Piwigo.org

Announcement

#16 2016-10-26 13:08:10

Re: WebAPI Latest 10 images - Order and Limit

teekay wrote:

#17 2016-12-16 07:43:46

Re: WebAPI Latest 10 images - Order and Limit

teekay wrote:

Code:

#18 2017-01-18 14:33:58

Re: WebAPI Latest 10 images - Order and Limit

eliz82 wrote:

Code:

Board footer