COAP:COAP-3110/week7: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
Line 87: Line 87:
Live code:
Live code:
* http://tecfa.unige.ch/guides/php/php7/REST/rest-get-pages-wikipedia.php (executable)
* http://tecfa.unige.ch/guides/php/php7/REST/rest-get-pages-wikipedia.php (executable)
* http://tecfa.unige.ch/guides/php/php7/REST/rest-get-pages-wikipedia.phps (source)
* http://tecfa.unige.ch/guides/php/php7/REST/rest-get-pages-wikipedia.text (source)


Copy/paste the following PHP file into an editor and adapt.
Copy/paste the following PHP file into an editor and adapt.

Revision as of 18:27, 2 October 2016

COAP 3110
COAP:COAP-3110
COAP:COAP-3110/term project
COAP:COAP-3110/week1
COAP:COAP-3110/week2
COAP:COAP-3110/week3
COAP:COAP-3110/week4
COAP:COAP-3110/week5
COAP:COAP-3110/week6
COAP:COAP-3110/week7
COAP:COAP-3110/week8

Learning goals

  • Using Webservices (REST)
  • Term project report writing

... details, TBA

Monday

A first glance at REST

According to Wikipedia, “A Web service is a service offered by an electronic device to another electronic device, communicating with each other via the World Wide Web. In a Web service, Web technology such as HTTP, originally designed for human-to-machine communication, is utilized for machine-to-machine communication, more specifically for transferring machine readable file formats such as XML and JSON. In practice, the Web service typically provides an object-oriented Web-based interface to a database server, utilized for example by another Web server, or by a mobile application, that provides a user interface to the end user. Another common application offered to the end user may be a mashup, where a Web server consumes several Web services at different machines, and compiles the content into one user interface.”

There exist several types of web services, e.g. the more traditional stack built around SOAP.

Currently, REST is the most popular mechanism used by more light-weight portals and more generally speaking all sorts of services that deal with information, as opposed to commercial transactions for example.

Hands on wordpress

By default, WordPress does not have a REST API, so we will have to install a plugin

(1) Please install the Wordpress plugin:

(2) Get a list of posts from one of your colleagues web site.

Have a look at:

Do it:

Hands on data from a MediaWiki

(1) Retrieve all COAP 3110 pages from edutechwiki

Have a look at:

(2) Example that returns JSON code for COAP 3110

Parameters

  • action=query - will tell the API to do a query
  • list=categorymembers - returns a list of members of a category
  • cmtitle= - defines the Category to look for
  • format=... - defines the format to return.

Resulting datastructure (example) 

{"batchcomplete" : "",
 "query" : {"categorymembers":[
                              {"pageid":9883,"ns":106,"title":"COAP:COAP-3110"},
                              {"pageid":9902,"ns":106,"title":"COAP:COAP-3110/week1"},
                              {"pageid":10230,"ns":106,"title":"COAP:COAP-3110/week2"},
                              {"pageid":10232,"ns":106,"title":"COAP:COAP-3110/week3"},
                              {"pageid":10278,"ns":106,"title":"COAP:COAP-3110/week4"},
                              {"pageid":10279,"ns":106,"title":"COAP:COAP-3110/week5"},
                              {"pageid":10280,"ns":106,"title":"COAP:COAP-3110/week6"},
                              {"pageid":10293,"ns":106,"title":"COAP:COAP-3110/week7"},
                              {"pageid":10292,"ns":106,"title":"COAP:COAP-3110/week8"}
           ]}
}

By changing some parameters, you could simplify the results returned. You only need the title for the page !

(3) Get category pages from from Wikipedia, i.e. complete the URL below


Idea: WP has a complex category system for games, e.g. look at Video Game genres or Video games by genre. Pick a sub sub category and list the pages, e.g. the Civilization series.

You will have to adapt the query if a category includes more than 10 entries.

Doing it with a PHP script

Live code:

Copy/paste the following PHP file into an editor and adapt. 

<!DOCTYPE html>
    <html lang="en">
    <head><title>Demo</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /></head>

    <body>
    This seems to work. See <a href="https://en.wikipedia.org/w/api.php">the MW API at wikipedia. </a>
    </p>

<?php

// change the following line
$category = 'Category:Civilization_(series)';

$params = array(
		'action' => 'query',
		'list' => 'categorymembers',
		'format' => 'json',
		'cmprop' => 'title',
		'cmtype' => 'page',
		'cmlimit' => '500',
		'cmtitle' => $category
		);

$url = 'https://en.wikipedia.org/w/api.php?' . http_build_query($params);

// echo ("URL =" . $url);
$jsonData = file_get_contents($url);
$data = json_decode($jsonData);

if ($data) doDisplay ($data,$category); else die ("No data, something's wrong");

function doDisplay ($data,$category) {
  $heading = "<h2>Wikipedia pages on " . $category . "</h2>";
  $pagelist = $data->query->categorymembers;
  // print_r ($pagelist);
  $newHTML = $heading . "<ul>";
  foreach ($pagelist as $page) {
    $titleName = $page->title;
    $newHTML .= "<li>" . '<a href="http://en.wikipedia.org/wiki/' . $titleName . '">' . $titleName . "</a>";
  }
  
  $newHTML .= "</ul>";
  // print
  echo $newHTML;


  // debug section - print data structure (comment for production)
  // Look at it to understand why we are looking at $data->query->categorymembers
  echo "<p>DEBUG - Data structure retrieved =</p>";
  echo "<pre>";
  print_r($data);
  echo "</pre>";
  // end debugging

}

?>
</body>
</html>

Doing it with JavaScript

You can do REST calls in JavaScript. However, the browser will require that the JavaScript page sits on the same server or that you use a more complex procedure like CORS headings.

Works (HTML file sits on the same server as EduTechWiki from which we get the data)

Using the file from a local computer, does not work:

  • file:///web/guides/js/ex/rest/rest-example.html

Firefox (49,Windows), for example, shows the following error: 

: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://edutechwiki.unige.ch/mediawiki/api.php?action=query&list=categorymembers&format=json&cmprop=title&cmtype=page&cmlimit=500&cmtitle=Category:COAP_3110. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).(unknown)

EduTechWiki has been configured to accept requests from a server called tecfa.unige.ch

Wikipedia is more flexible

Make sure to send an "origin: *" parameter as in the following code:

Copy the file and adapt.

Homework 5

  • Retrieve and display information from a wordpress site or another site
  • Details TBA.
Retrieved from "https://edutechwiki.unige.ch/mediawiki/index.php?title=COAP:COAP-3110/week7&oldid=60632"