Support for POST data in the ajax requests.

This commit is contained in:
Aiosa 2021-12-08 09:54:14 +01:00
parent d1a5e926c6
commit a11b5ce602
12 changed files with 63 additions and 12 deletions

View File

@ -124,10 +124,11 @@ $.extend( $.DziTileSource.prototype, $.TileSource.prototype, /** @lends OpenSead
* @function * @function
* @param {Object|XMLDocument} data - the raw configuration * @param {Object|XMLDocument} data - the raw configuration
* @param {String} url - the url the data was retrieved from if any. * @param {String} url - the url the data was retrieved from if any.
* @param {String} postData - data for the post request or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
*/ */
configure: function( data, url ){ configure: function( data, url, postData ){
var options; var options;

View File

@ -183,6 +183,8 @@ $.extend( $.IIIFTileSource.prototype, $.TileSource.prototype, /** @lends OpenSea
* *
* @function * @function
* @param {Object} data - the raw configuration * @param {Object} data - the raw configuration
* @param {String} url - the url configuration was retrieved from
* @param {String} postData - data for the post request or null
* @example <caption>IIIF 1.1 Info Looks like this</caption> * @example <caption>IIIF 1.1 Info Looks like this</caption>
* { * {
* "@context" : "http://library.stanford.edu/iiif/image-api/1.1/context.json", * "@context" : "http://library.stanford.edu/iiif/image-api/1.1/context.json",
@ -197,7 +199,7 @@ $.extend( $.IIIFTileSource.prototype, $.TileSource.prototype, /** @lends OpenSea
* "profile" : "http://library.stanford.edu/iiif/image-api/1.1/compliance.html#level0" * "profile" : "http://library.stanford.edu/iiif/image-api/1.1/compliance.html#level0"
* } * }
*/ */
configure: function( data, url ){ configure: function( data, url, postData ){
// Try to deduce our version and fake it upwards if needed // Try to deduce our version and fake it upwards if needed
if ( !$.isPlainObject(data) ) { if ( !$.isPlainObject(data) ) {
var options = configureFromXml10( data ); var options = configureFromXml10( data );

View File

@ -43,6 +43,7 @@
* @param {String} [options.loadWithAjax] - Whether to load this image with AJAX. * @param {String} [options.loadWithAjax] - Whether to load this image with AJAX.
* @param {String} [options.ajaxHeaders] - Headers to add to the image request if using AJAX. * @param {String} [options.ajaxHeaders] - Headers to add to the image request if using AJAX.
* @param {String} [options.crossOriginPolicy] - CORS policy to use for downloads * @param {String} [options.crossOriginPolicy] - CORS policy to use for downloads
* @param {String} [options.postData] - POST parameters or null
* @param {Function} [options.callback] - Called once image has been downloaded. * @param {Function} [options.callback] - Called once image has been downloaded.
* @param {Function} [options.abort] - Called when this image job is aborted. * @param {Function} [options.abort] - Called when this image job is aborted.
* @param {Number} [options.timeout] - The max number of milliseconds that this image job may take to complete. * @param {Number} [options.timeout] - The max number of milliseconds that this image job may take to complete.
@ -96,6 +97,7 @@ ImageJob.prototype = {
withCredentials: this.ajaxWithCredentials, withCredentials: this.ajaxWithCredentials,
headers: this.ajaxHeaders, headers: this.ajaxHeaders,
responseType: "arraybuffer", responseType: "arraybuffer",
postData: this.postData,
success: function(request) { success: function(request) {
var blb; var blb;
// Make the raw data into a blob. // Make the raw data into a blob.
@ -196,6 +198,7 @@ $.ImageLoader.prototype = {
* @param {String} [options.loadWithAjax] - Whether to load this image with AJAX. * @param {String} [options.loadWithAjax] - Whether to load this image with AJAX.
* @param {String} [options.ajaxHeaders] - Headers to add to the image request if using AJAX. * @param {String} [options.ajaxHeaders] - Headers to add to the image request if using AJAX.
* @param {String|Boolean} [options.crossOriginPolicy] - CORS policy to use for downloads * @param {String|Boolean} [options.crossOriginPolicy] - CORS policy to use for downloads
* @param {String} [options.postData] - POST parameters in k=v&k2=v2... form or null
* @param {Boolean} [options.ajaxWithCredentials] - Whether to set withCredentials on AJAX * @param {Boolean} [options.ajaxWithCredentials] - Whether to set withCredentials on AJAX
* requests. * requests.
* @param {Function} [options.callback] - Called once image has been downloaded. * @param {Function} [options.callback] - Called once image has been downloaded.
@ -212,6 +215,7 @@ $.ImageLoader.prototype = {
ajaxHeaders: options.loadWithAjax ? options.ajaxHeaders : null, ajaxHeaders: options.loadWithAjax ? options.ajaxHeaders : null,
crossOriginPolicy: options.crossOriginPolicy, crossOriginPolicy: options.crossOriginPolicy,
ajaxWithCredentials: options.ajaxWithCredentials, ajaxWithCredentials: options.ajaxWithCredentials,
postData: options.postData,
callback: complete, callback: complete,
abort: options.abort, abort: options.abort,
timeout: this.timeout timeout: this.timeout

View File

@ -89,10 +89,11 @@
* @function * @function
* @param {Object} options - the options * @param {Object} options - the options
* @param {String} dataUrl - the url the image was retrieved from, if any. * @param {String} dataUrl - the url the image was retrieved from, if any.
* @param {String} postData - data for the post request or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
*/ */
configure: function (options, dataUrl) { configure: function (options, dataUrl, postData) {
return options; return options;
}, },
/** /**

View File

@ -122,10 +122,11 @@ $.extend( $.LegacyTileSource.prototype, $.TileSource.prototype, /** @lends OpenS
* @function * @function
* @param {Object|XMLDocument} configuration - the raw configuration * @param {Object|XMLDocument} configuration - the raw configuration
* @param {String} dataUrl - the url the data was retrieved from if any. * @param {String} dataUrl - the url the data was retrieved from if any.
* @param {String} postData - data for the post request or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
*/ */
configure: function( configuration, dataUrl ){ configure: function( configuration, dataUrl, postData ){
var options; var options;

View File

@ -2273,6 +2273,7 @@ function OpenSeadragon( options ){
* @param {Function} options.error - a function to call on when an error occurs * @param {Function} options.error - a function to call on when an error occurs
* @param {Object} options.headers - headers to add to the AJAX request * @param {Object} options.headers - headers to add to the AJAX request
* @param {String} options.responseType - the response type of the the AJAX request * @param {String} options.responseType - the response type of the the AJAX request
* @param {String} options.postData - HTTP POST data in k=v&k2=v2... form, GET method used if null
* @param {Boolean} [options.withCredentials=false] - whether to set the XHR's withCredentials * @param {Boolean} [options.withCredentials=false] - whether to set the XHR's withCredentials
* @throws {Error} * @throws {Error}
* @returns {XMLHttpRequest} * @returns {XMLHttpRequest}
@ -2281,6 +2282,7 @@ function OpenSeadragon( options ){
var withCredentials; var withCredentials;
var headers; var headers;
var responseType; var responseType;
var postData;
// Note that our preferred API is that you pass in a single object; the named // Note that our preferred API is that you pass in a single object; the named
// arguments are for legacy support. // arguments are for legacy support.
@ -2290,6 +2292,7 @@ function OpenSeadragon( options ){
withCredentials = url.withCredentials; withCredentials = url.withCredentials;
headers = url.headers; headers = url.headers;
responseType = url.responseType || null; responseType = url.responseType || null;
postData = url.postData || null;
url = url.url; url = url.url;
} }
@ -2322,8 +2325,9 @@ function OpenSeadragon( options ){
} }
}; };
var method = postData ? "POST" : "GET";
try { try {
request.open( "GET", url, true ); request.open( method, url, true );
if (responseType) { if (responseType) {
request.responseType = responseType; request.responseType = responseType;
@ -2341,7 +2345,7 @@ function OpenSeadragon( options ){
request.withCredentials = true; request.withCredentials = true;
} }
request.send(null); request.send(postData);
} catch (e) { } catch (e) {
$.console.log( "%s while making AJAX request: %s", e.name, e.message ); $.console.log( "%s while making AJAX request: %s", e.name, e.message );

View File

@ -122,10 +122,11 @@ $.extend( $.OsmTileSource.prototype, $.TileSource.prototype, /** @lends OpenSead
* @function * @function
* @param {Object} data - the raw configuration * @param {Object} data - the raw configuration
* @param {String} url - the url the data was retrieved from if any. * @param {String} url - the url the data was retrieved from if any.
* @param {String} postData - data for the post request or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
*/ */
configure: function( data, url ){ configure: function( data, url, postData ){
return data; return data;
}, },

View File

@ -45,6 +45,7 @@
* @param {Boolean} exists Is this tile a part of a sparse image? ( Also has * @param {Boolean} exists Is this tile a part of a sparse image? ( Also has
* this tile failed to load? ) * this tile failed to load? )
* @param {String} url The URL of this tile's image. * @param {String} url The URL of this tile's image.
* @param {String} postData post parameters or null
* @param {CanvasRenderingContext2D} context2D The context2D of this tile if it * @param {CanvasRenderingContext2D} context2D The context2D of this tile if it
* is provided directly by the tile source. * is provided directly by the tile source.
* @param {Boolean} loadWithAjax Whether this tile image should be loaded with an AJAX request . * @param {Boolean} loadWithAjax Whether this tile image should be loaded with an AJAX request .
@ -53,7 +54,7 @@
* drawing operation, in pixels. Note that this only works when drawing with canvas; when drawing * drawing operation, in pixels. Note that this only works when drawing with canvas; when drawing
* with HTML the entire tile is always used. * with HTML the entire tile is always used.
*/ */
$.Tile = function(level, x, y, bounds, exists, url, context2D, loadWithAjax, ajaxHeaders, sourceBounds) { $.Tile = function(level, x, y, bounds, exists, url, postData, context2D, loadWithAjax, ajaxHeaders, sourceBounds) {
/** /**
* The zoom level this tile belongs to. * The zoom level this tile belongs to.
* @member {Number} level * @member {Number} level
@ -97,6 +98,13 @@ $.Tile = function(level, x, y, bounds, exists, url, context2D, loadWithAjax, aja
* @memberof OpenSeadragon.Tile# * @memberof OpenSeadragon.Tile#
*/ */
this.url = url; this.url = url;
/**
* Post parameters for this tile. Either it is an URL-encoded string
* in k1=v1&k2=v2... format or null
* @member {String} postData
* @memberof OpenSeadragon.Tile#
*/
this.postData = postData;
/** /**
* The context2D of this tile if it is provided directly by the tile source. * The context2D of this tile if it is provided directly by the tile source.
* @member {CanvasRenderingContext2D} context2D * @member {CanvasRenderingContext2D} context2D

View File

@ -1490,6 +1490,7 @@ function getTile(
sourceBounds, sourceBounds,
exists, exists,
url, url,
post,
ajaxHeaders, ajaxHeaders,
context2D, context2D,
tile; tile;
@ -1508,6 +1509,7 @@ function getTile(
sourceBounds = tileSource.getTileBounds( level, xMod, yMod, true ); sourceBounds = tileSource.getTileBounds( level, xMod, yMod, true );
exists = tileSource.tileExists( level, xMod, yMod ); exists = tileSource.tileExists( level, xMod, yMod );
url = tileSource.getTileUrl( level, xMod, yMod ); url = tileSource.getTileUrl( level, xMod, yMod );
post = tileSource.getTilePostData( level, xMod, yMod );
// Headers are only applicable if loadTilesWithAjax is set // Headers are only applicable if loadTilesWithAjax is set
if (tiledImage.loadTilesWithAjax) { if (tiledImage.loadTilesWithAjax) {
@ -1530,6 +1532,7 @@ function getTile(
bounds, bounds,
exists, exists,
url, url,
post,
context2D, context2D,
tiledImage.loadTilesWithAjax, tiledImage.loadTilesWithAjax,
ajaxHeaders, ajaxHeaders,
@ -1573,6 +1576,7 @@ function loadTile( tiledImage, tile, time ) {
tile.loading = true; tile.loading = true;
tiledImage._imageLoader.addJob({ tiledImage._imageLoader.addJob({
src: tile.url, src: tile.url,
postData: tile.postData,
loadWithAjax: tile.loadWithAjax, loadWithAjax: tile.loadWithAjax,
ajaxHeaders: tile.ajaxHeaders, ajaxHeaders: tile.ajaxHeaders,
crossOriginPolicy: tiledImage.crossOriginPolicy, crossOriginPolicy: tiledImage.crossOriginPolicy,

View File

@ -426,6 +426,13 @@ $.TileSource.prototype = {
} }
} }
var postData = null;
var hashIdx = url.indexOf("#");
if (hashIdx !== -1) {
postData = url.substring(hashIdx + 1);
url = url.substr(0, hashIdx - 1);
}
callback = function( data ){ callback = function( data ){
if( typeof (data) === "string" ) { if( typeof (data) === "string" ) {
data = $.parseXml( data ); data = $.parseXml( data );
@ -447,7 +454,7 @@ $.TileSource.prototype = {
return; return;
} }
options = $TileSource.prototype.configure.apply( _this, [ data, url ]); options = $TileSource.prototype.configure.apply( _this, [ data, url, postData ]);
if (options.ajaxWithCredentials === undefined) { if (options.ajaxWithCredentials === undefined) {
options.ajaxWithCredentials = _this.ajaxWithCredentials; options.ajaxWithCredentials = _this.ajaxWithCredentials;
} }
@ -482,6 +489,7 @@ $.TileSource.prototype = {
// request info via xhr asynchronously. // request info via xhr asynchronously.
$.makeAjaxRequest( { $.makeAjaxRequest( {
url: url, url: url,
postData: postData,
withCredentials: this.ajaxWithCredentials, withCredentials: this.ajaxWithCredentials,
headers: this.ajaxHeaders, headers: this.ajaxHeaders,
success: function( xhr ) { success: function( xhr ) {
@ -559,11 +567,12 @@ $.TileSource.prototype = {
* @param {String|Object|Array|Document} data * @param {String|Object|Array|Document} data
* @param {String} url - the url the data was loaded * @param {String} url - the url the data was loaded
* from if any. * from if any.
* @param {String} postData value obtained from the url after '#' sign or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
* @throws {Error} * @throws {Error}
*/ */
configure: function( data, url ) { configure: function( data, url, postData ) {
throw new Error( "Method not implemented." ); throw new Error( "Method not implemented." );
}, },
@ -584,6 +593,20 @@ $.TileSource.prototype = {
throw new Error( "Method not implemented." ); throw new Error( "Method not implemented." );
}, },
/**
* Must use AJAX in order to work, i.e. loadTilesWithAjax = true is set.
* It should return url-encoded string with the following structure:
* key=value&key2=value2...
* or null in case GET is used instead.
* @param level
* @param x
* @param y
* @return {string || null} post data to send with tile configuration request
*/
getTilePostData: function( level, x, y ) {
return null;
},
/** /**
* Responsible for retrieving the headers which will be attached to the image request for the * Responsible for retrieving the headers which will be attached to the image request for the
* region specified by the given x, y, and level components. * region specified by the given x, y, and level components.

View File

@ -111,10 +111,11 @@ $.extend( $.TmsTileSource.prototype, $.TileSource.prototype, /** @lends OpenSead
* @function * @function
* @param {Object} data - the raw configuration * @param {Object} data - the raw configuration
* @param {String} url - the url the data was retrieved from if any. * @param {String} url - the url the data was retrieved from if any.
* @param {String} postData - data for the post request or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
*/ */
configure: function( data, url ){ configure: function( data, url, postData ){
return data; return data;
}, },

View File

@ -122,10 +122,11 @@
* @function * @function
* @param {Object} data - the raw configuration * @param {Object} data - the raw configuration
* @param {String} url - the url the data was retrieved from if any. * @param {String} url - the url the data was retrieved from if any.
* @param {String} postData - data for the post request or null
* @return {Object} options - A dictionary of keyword arguments sufficient * @return {Object} options - A dictionary of keyword arguments sufficient
* to configure this tile sources constructor. * to configure this tile sources constructor.
*/ */
configure: function(data, url) { configure: function(data, url, postData) {
return data; return data;
}, },