mobilecontrolcreate browser

[cusingerBUSCw5N]

My app needs to connect to a webpage.

I have successfully deployed the following livecode script on an android...

Code: Select all

global gRCBrowser, gCard
local sBrowserId

on preopencard

   resizeStack
   
   # quit if we are not on a mobile device
   --    if the environment is not "mobile" then
   --        exit preOpenCard
   --    end if
   
   if the environment is "mobile" then
      # create the browser
      mobileControlCreate "browser"
      put the result into sBrowserId
      
      # set up the basic defaults
      mobileControlSet sBrowserId, "rect", the rect of group "rcBrowser"
      mobileControlSet sBrowserId, "visible", "true"
      mobileControlSet sBrowserId, "url", gRCBrowser
      mobileControlSet sBrowserId, "autofit", true
      

      put gRCBrowser  into field "devURL"

   end if
   
end preopencard

on resizeStack
   layoutControls
end resizeStack

on layoutControls

   set the width of graphic "navbar" to the width of this card
   set the height of graphic "navbar" to round(the width of graphic "navbar" * .1)
   set the loc of graphic "navbar" to the loc of this card
   set the top of graphic "navbar" to the top of this card
   
   set the width of image "navBack" to round(the height of graphic "navbar" * .75)
   set the height of image "navBack" to round(the height of graphic "navbar" * .75)
   set the width of image "navBackDown" to round(the height of graphic "navbar" * .75)
   set the height of image "navBackDown" to round(the height of graphic "navbar" * .75)
   
   set the width of button "btnBack" to the height of graphic "navBar"
   set the height of button "btnBack" to the height of graphic "navbar"
   set the topLeft of button "btnBack" to the topLeft of graphic "navBar"
   
   set the icon of button "btnBack" to the id of image "navBack"
   set the hiliteIcon of button "btnBack" to the id of image "navBackDown"
   set the left of button "btnBack" to the left of field "devUrl"
  
   set the width of graphic "bottomBar" to the width of this card
   set the height of graphic "bottomBar" to round(the width of graphic "navbar" * .10)
   set the loc of graphic "bottomBar" to the loc of this card
   set the bottom of graphic "bottomBar" to the bottom of this card
   
      set the width of graphic "sponsorBar" to the width of this card
   set the height of graphic "sponsorBar" to round(the width of graphic "navbar" * .10)
   set the loc of graphic "sponsorBar" to the loc of this card
   set the bottom of graphic "sponsorBar" to the bottom of this card
   set the width of graphic "Rectangle" to the width of this card
   set the width of group "rcBrowser" to the width of this card

   set the height of group "rcBrowser" to the height of this card - (the height of graphic "navbar"+the height of graphic "bottomBar")
   set the loc of group "rcBrowser" to the loc of this card
   set the top of group "rcBrowser" to the bottom of graphic "navbar"
mobileControlSet sBrowserId, "rect", the rect of group "rcBrowser"

end layoutControls

on closeCard
    if the environment is not "mobile" then
        exit closeCard
    end if

    # destroy the browser we created 
    mobileControlDelete sBrowserId
end closeCard

but when I use it on an IOS, it comes up with a blank screen. Any ideas on why?

Thanks

[LiveCode_Panos]

If this code works on Android but not on iOS, my best guess is that the website is blocked by ATS (App Transport Security). If this is the case, you can either:

1. Disable ATS in iOS standalone settings (not recommended)
2. Make the website to use https, to prevent being blocked by Apple ATS

[cusingerBUSCw5N]

It's already using https

Unfortunately, I need this connection to be secure - so disabling ATS is not really a good option.... unless it really doesn't matter as long as I am using an https connection.

So can you give me more details on how important ATS is - and whether there are any other options? If it doesn't work for me, does that mean it doesn't work for anyone? Or is there something with my server that is triggering this problem?


and is there any way to turn it on or off from a button inside the app? (ie. have ATS working most of the time, unless the person pushes a button to access the internet).

....and what is the difference between using a url(turl) call to open a webpage and using mobilecontrolcreate browser?

Thanks

[LiveCode_Panos]

You can find more details about ATS in comment 1 here: http://quality.livecode.com/show_bug.cgi?id=18645

Note that simple using https does not guarantee that the connection will not be blocked by Apple's ATS. There are some other factors that come into play, such as
- Server must support at least Transport Layer Security (TLS) 1.2
- Certificates must be signed with SHA256 or better with at least 2048 bits for RSA or 256 bits for Elliptic Curve keys.

(Again, see the previous link for more details)

and is there any way to turn it on or off from a button inside the app?

No, as far as I know this is not possible, since the presence or absence of ATS is determined by the .plist file of the iOS app, and the .plist file is created when you build a standalone, and cannot change at runtime.

and what is the difference between using a url(turl) call to open a webpage and using mobilecontrolcreate browser?

In terms of ATS, there is no difference. If a connection to a website is blocked by ATS on iOS, you will not be able to access the website, regardless of the way you use (either [url(turl)], or [mobileControlCreate browser], or [browser widget]).

In general, the advantage of using [mobileControlCreate browser] IMO is that you can set various browser properties using [mobileControlSet].

[Batninja]

If anyone finds this helpful...

TSOHost (https://www.tsohost.com/) have free SSL certificates available for their cloud based servers from Let's Encrypt. I just tried out the browser widget on my iPhone with ATS enabled and pointing to a wordpress site that I added a Let's Encrypt certificate to on my £5 a month cloud server and it's all working fine.

There's something about having to "proactively renew the free certificate every 3 months" so for production may be better to pay for a certificate but works for testing purposes!

Roger