Download Images (NFTs)

Downloading an image

/// <summary>
/// Load an image from and URL and display it directly on an Image component when loaded
/// </summary>
/// <param name="imageURL">url to download image from</param>
/// <param name="displayComponent">the image component to display the picture</param>
public static void LoadImage(string imageURL, Image displayComponent, UnityAction<OperationStatus, string> CompleteMethod)

To be more clear, here is a full example of usage:

Image profilePicture;
string address="erd1lgp3ezf2wfkejnu0sm5y9g4x3ad05gr8lfc0g69vvdwwj0wjv0gscv2w4s";

//Method call
MultiversXUnityTools.Manager.LoadImage($"https://id.maiar.com/users/photos/profile/{address}", profilePicture, PictureLoadComplete);

private void PictureLoadComplete(MultiversXUnityTools.OperationStatus status, string message)
{
      if (status == MultiversXUnityTools.OperationStatus.Complete)
      {
            //activate your image
      }
}

APIs to download images from Maiar

Profile picture:
https://id.maiar.com/users/photos/profile/{address}

Cover image:
https://id.maiar.com/users/photos/cover/{address}

Fix issues on WebGL builds

CORS - Access-Control-Allow-Origin
Depending on what servers the images are stored this error might occur

Access to fetch at 'https://website.com/imageurl' 
from origin 'https://hostOfYourWebGLBuild.com' 
has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 
If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

This occurs when redirects are involved.

To fix it, inside the .htaccess file on the server that has the API which returns the images, add this:

Header set Access-Control-Allow-Origin "*"

If that is not an, option the images need to be downloaded by a server, and your app needs to download the images from that server.
Here is a simple .php script that gets an image from an URL. Put this on your server, and it works, but a more professional and efficient method is needed for a production app that needs to download a lot of big data.

<?php

$image = file_get_contents($_GET["imageUrl"]);

echo $image;

Our tools automatically provide a way to route all image calls through your own server to avoid CORS errors.
If CORSFixUrl const from Constants.cs is not null, all image calls will be automatically routed through that server. In this example, getImage.php contains the code above, and it is hosted on a webserver.

//if routing is needed
public const string CORSFixUrl = "https://yourWebServer.com/getImage.php?imageUrl=";

//if routing is not needed
public const string CORSFixUrl = null;