Linking a Servoy NG client solution in an iframe

Classic Servoy
1

Hi,

I’m trying to link to a Servoy NG Solution, using an iframe in a Phonegap app. The iframe is coming up blank and i’ve been looking at the Adobe forums trying to find what i’m doing wrong. After making sure i’m doing everything right on the Phonegap side of things I thought maybe there is a unique condition when a Servoy solution is being called to and perhaps someone here might know more about it.

Thanks in advance.

2

Hi Thomas,

Can you share the index.html you are using to do the phonegap build?

Here you have a sample:

Regards,

3

Hi Juan,

This the index.html i’m currently using, it simplified it to try and get the iframe working before adding anything extra.

Thanks

4

I got the answer from a guy on the Phonegap forum, I’d forgotton to include the cordova-whitelist-plugin which solved my problem and displayed the solution in the iframe.

5

great!

6

Thomas.shuttleworth:
I got the answer from a guy on the Phonegap forum, I’d forgotton to include the cordova-whitelist-plugin which solved my problem and displayed the solution in the iframe.

Could you please provide the lines you had to put into your
config.xml
and
index.html
to get it to work & solve the problem?
Thanks
Rafi

7

Hi Rafi, the problem I was having with iframe was fixed by the addition of to the config.xml. By this point I had tried a number of things to get the iframe working. I’m not sure if the problem you’re having is the same issue but I’m unable to add my files here for your review. I’ll post some files in this message that had a working iframe which hopefully you can use to help with your issue.

Thanks, Thomas.

index.html

config.xml

<?xml version="1.0" encoding="UTF-8"?>

Nephos Med Mobile
Mobile app
Thomas

8

Hi. Thanks for reply, I will get back to you once I’ve had a chance to check what you’ve replied with.

9

Hi Thomas,

I did try the example index.html and config.xml but no luck, I am getting following error,

“Error while executing client side code. Please see browser console for more info. Error: ReferenceError: Bridge is not defined”

What might be the issue here please

10

Hi All,

Any update on this, please.

11

The error sounds like you have this on your iframe

onload="Bridge.init(this);"

but the “Bridge” object does not exist. Note that in the examples above, two scripts are loaded

<script src="phonegap.js"></script>
<script src="bridge.js"></script>

The latter is responsible for attaching that Bridge object.

Those two scripts come from a project on github (https://github.com/Servoy/svyPhonegap) that we have created to ease the integration of phonegap and NG Client. Many times, people do not only want to simply run their application inside PhoneGap, but also make use of the different APIs that are offered or can be added to a PhoneGap solution.

So in short: to simply run your application, remove the onload call you most likely copied. To further integrate with PhoneGap, check out https://github.com/Servoy/svyPhonegap

12

Hi Patrick,

Thanks for the reply , I have checked “index.html” and there is no “onLoad” function at iFrame, following is the index.html, did I miss anything ?

SERVOY MOBILE
Offline Please check your connection...
13

In the examples posted above there was an onload=… Then I guess it something that happens in the scripts you load.

14

Hi Patrick,

No that’s not case, can you share if I miss anything at the attached index.html ?

15

Something calls

Bridge.xxx

Maybe your onOpen script? And that is not there, although it seems you try to load it here

<script type="text/javascript" src="js/bridge.js"></script>

Do you have a media folder called “js” with a bridge.js in it?

16

Hi Patrick,

Yes, js folder exist inside www folder and bridge.js file existed.

17

Hi Chaitanyas,

Your iframe line shows:

I think it should be:

The onload for bridge is missing.

Regards,

18

Hi ProRM,

Thanks for the reply, I have added onLoad function at iFrame but still no luck, now, I am getting blank screen and application not loading…

19

It’s impossible to figure out what’s going on like this. You are loading a bunch of scripts, execute client code onLoad, your solution might do all kinds of stuff onSolutionOpen etc.

In general when working with PhoneGap, it is very helpful to connect the device to a PC and inspect the running phonegap solution using Chrome developer tools on the PC. Google a bit to figure out how to set that up, sometimes a device driver is needed for that. While that might take a while to get it working, you will benefit a lot on the long run when you can see what goes on in the browser of the PhoneGap app.

It could also help maybe to simply run this html page locally to see what goes on in Chrome developer tools. Obviously, you need to remove any phonegap specific stuff, since you don’t have that, but you can figure out the iframe portion.

20

Hi Chaitanyas,

You can start by using a simple index.html file in order to discard any other problem, like this: