How do I get the content of a URL on a web server into LiveCode?

This lesson will show you how to load the content of a URL into LiveCode.

You can download the sample stack from this url: https://tinyurl.com/y8af6kl7

What We Are Going To Do

What We Are Going To Do

This lesson will show you two techniques for loading the content of a URL into LiveCode. In this screenshot you see that the content of http://www.google.com (1) has been loaded into a LiveCode field object (2).

Using put

Using put

First we will look at how to download a URL using the put command. In particular we will use the put URL form (1). put URL is an easy way to synchronously download a URL into LiveCode. You just provide a URL and LiveCode will download the URL contents and store them. In this case the contents are being stored in the variable theWebPageContent (2).

The fact that put URL is synchronous means that your LiveCode code will not continue executing until the URL has finished downloading. For URLs that take a long time to download your UI will become unresponsive until the download process is complete. Because of this we can check for any errors that may have occurred while downloading the URL right after the put URL line (3).

 

on mouseUp
	put the text of field "URL" Into theURL
	put URL theURL into theWebPageContent
	put the result into theError
	
	if theError is empty then
		set the text of field "Result" to theWebPageContent
	else
		set the text of field "Result" to "An error occurred:" && theError & "."
	end if
end mouseUp

Using load

Using load

Now we will look at how to download a URL using the load command (1). The load command requires a little more work than using put URL but has the added benefit of being an asynchronous action.

The fact that load is asynchronous means that your LiveCode will continue executing while the URL is being downloaded. For long download operations your application will remain responsive. When calling an asynchronous command we cannot get the results of the download operation right after making the call. Instead we make use of a feature in LiveCode called callbacks. A callback is a message that will be sent when the load operation has finished. In this example we tell LiveCode that the message FileIsDoneDownloading should be sent when the url finishes downloading (2).

When the FileIsDoneDownloading message is sent by the engine we can get the contents of the URL. LiveCode actually caches the contents of the URL on the computer so that the next time you access the URL the cached data is returned (3). When we no longer need the URL contents any longer we clear the cache by calling unload url (4).

on mouseUp
	put the text of field "URL" Into theURL
 
	## Start downloading URL asynchronously.
	load URL theURL with message "FileIsDoneDownloading"
end mouseUp
on FileIsDoneDownloading pURL, pURLStatus
if pURLStatus is "cached" then
		## LiveCode has cached URL content. Accessing the url uses
		## the cache. 
		set the text of field "Result" to URL pURL
		
		## Remove URL from cache if you are all done with it.
		unload url pURL
	else
		put libURLErrorData(pURL) into theError
		set the text of field "Result" to "An error occurred:" && theError & "."
	end if
end FileIsDoneDownloading

5 Comments

student_developer

Hi, I want to use a functionality that loads a google map on the screen. Can you please help me

Thanks

Elanor Buchanan

Hi

Have a look at this lesson

http://lessons.runrev.com/s/lessons/m/4069/l/32356-how-do-i-access-maps-on-ios

This will work on mobile or desktop, on desktop google maps will be opened in your default browser.

I hope that helps.

Elanor

Albert

Thank you.
I have used your code, and it works well, with one exception: When I create a HTML5 standalone (I am using the Community version, and evaluating to buy an additional HTML5 version, on top of my commercial Indy one).
-- put "https://www. ... .txt" into theURL
-- put URL theURL into theWebPageContent
-- put the result into theError
-- if theError is empty then
-- set the text of field "ReportField" to theWebPageContent
-- else
-- set the text of field "ReportField" to "An error occurred:" && theError & "."
-- end if
Just the presence of this code makes that after calling the HTML5 standalone in a browser (and witing until LC loads) the web page remains empty - or just the small LC logo. This istrange because the app reappears if I just remove these lines of code.
HTML5 must really HATE them :) Would you know why and what I should adapt?

The same applies when i use the code you ddescribe in your "Using Load" section.

I have also tried to slightly adapt you code to fill an image with the content of a URL (http://...jpg), but I did not even succed to get a code that LC would accept. Is there a Lesson for this too?

Btw, In order to fill an image from a URL I have also tried:
set the filename of image "ProfileImage" to "https:// ... .jpg"
This approach works well, except in the HTML5 standalone. Why?

I also tried the simple
launch URL myURL
Same results. It works well (at least in opening the picture in a briwser - rather than in my image, as I would prefer), except for the HTML5 standalone. Why?

I finally noticed that functions like
tsNetHeadSync
do not compile in the Community version - whilst they work well in my Indy. Is this just a problem of the Community version? But the key question is: Will these commands (which I use extensively) also work with HTML5 standalones?

Thank you for your help. When trying HTML5 I seem to get stuck with relatively simple txt/images exchange with files which are on the web (things which work well normally). Am I missing a Doc on "What to change when producing HTML5 standalones"?

Elanor Buchanan

Hi Albert

This is likely because your browser is seeing these as cross origin requests. You can choose to allow this but the method to do it will depend on how you are testing, your server configuration etc.

You might get some good advice on the HTML5 forum.

https://forums.livecode.com/viewforum.php?f=120

Kind regards

Elanor

Elanor Buchanan

Hi Albert

I just wanted to add that you can usually check the result to see error message e.g. in and HTML5 test stack I did

put url "https://www.google.com" into field 1
answer the result

and this showed a dialog with the error message which might help you see what is going on.

Kind regards

Elanor

Add your comment

E-Mail me when someone replies to this comment