Access response headers for texture loaded from remote service

I have a remote image render service that I am using to create textures dynamically to use within my app.
Here is an example of the code…

var self = this;

var image = new pc.Asset("a texture", "texture", {
	url: this.renderServer + "getimage.ashx?scene=" + this.sceneName

var onSceneImageReady = function(asset) {
	self.imageTarget.element.textureAsset = asset;
	//TBD: Read the response headers to get meta data about render.
// Start async loading the image asset

This works to get the image as a texture but I also need access to the response headers for the request to get additional metadata that is provided by the service.

Is it possible to get the response headers too?

In which case, you may want to use directly or

And then create the asset directly without loading it (changing the asset.loaded = true directly for example)

Thanks. I’ll give that a try.

@yaustar Could you please point me to an example of creating the asset directly? I’m able to use pc.http.get to load the data, and I can get to the headers I need but it is not working to create the asset. Here is my code…

image = new pc.Asset(this.sceneName, "texture", {
	 url: this.renderServer + "getimage.ashx?scene=" + this.sceneName

var xhr = pc.http.get(image.file.url,{responseType: "arraybuffer"}, function (err, response) {
	console.log(xhr.getAllResponseHeaders());  // this works to get the headers
	image.resource = response;		// This does not work
	image.loaded = true;

the response type defaults to “text” but I have tried “arraybuffer” and “blob” and those don’t work either.

thank you.

On my phone at the moment but the easiest way to do this is to use the asset registry directly

Oh wait, you needed the response headers too :thinking: That might be tricky for an image.

Since you need this, you would have to convert the response from the XMLHttpRequest to a blob and use that as the Image source.

@BillWestrick Here’s an example project:


// initialize code called once per entity
App.prototype.initialize = function() {
    var self = this;
    var url = "";
    var material ='Murray Material', 'material').resource;

    // Taken from
    var request = new XMLHttpRequest();'GET', url);
    request.responseType = 'blob';

    // When the request loads, check whether it was successful
    request.onload = function () {
        if (request.status === 200) {
            var response = request.response;
            var imageURL = URL.createObjectURL(response);
  , 'Fill Murray Image', 'texture', function(err, asset) {
                material.diffuseMap = asset.resource;
        } else {
            console.log('Image didn\'t load successfully; error code:' + request.statusText);

    request.onerror = function () {
        console.log('There was a network error.');

    // Send the request