WebGL not loading pictures from my website

Background : I’ve created an online learning tool using WebGL which stores pictures of questions and displays them according to syllabus chapter. Previously I loaded all 2000 image files when WebGL loaded which was slow. Took 1-2 minutes for WebGL to load once students entered the website. This was off-putting to wait so long so I decided to load the images ‘as required’ instead of loading all of the chapters when the program initially loaded.

My goal is load the images for each chapter when the chapter is selected from my website.

The problem: When I’m running in the Unity Editor my code works as expected and downloads the required images and loads them into the program successfully. However, when I build and open the WebGL in a browser none of the images load. They are replaced by an image which has some white and red on it and I believe is a place-holder image for when images are not found.

I modified my .htaccess file on my website to allow the files to be downloaded in the first instance but do I need to do something extra?

Current .htaccess file:
RemoveHandler .html .htm

AddType application/x-httpd-php5 .php .htm .html

Code which gets the images:

IEnumerator GetPicture()
{
int a = c;
WWW www = new WWW(url);
yield return www;
//Renderer renderer = GetComponent();
if (www.isDone)
{
loadCounter++;
Debug.Log(loadCounter);
}
Q[a] = www.texture;
}

I’ve taken the code directly from Unity’s example code in its script wiki.

It seems weird that the website allows access to the images when the Editor asks for them but when WebGL attempts to access them it says NO.

Thoughts?

print out the www.Error (and or check browser console for other errors)

are you using http or https in the page and in the url?

1 Like

Thank you for the quick response.

I’m using http

Update:
I put the Debug.Log(www.error) in and it gave me an out of memory error.
I increased the amount of memory the program was allocated from 64MB to 128MB and now the pictures load.

Update2:
I added more pictures to be loaded and now the same issue is reoccurring. I have increased my WebGL memory allocation to 512MB. My program doesn’t do anything amazing graphically. Should I just increase the memory allocation until it works? I’m using PNG files I could perhaps use JPG but will that actually do anything?

Help please.