Login from iframe

Hello All,

I'm looking for a solution,

My project involves the creation of an app (android, ios) with the possibility of logging into my site and then browsing it. I tried to use the iframe but the login does not finalize the access, it reloads the page (I also enabled Access-Control-Allow-Origin). With the browser app, however, I would lose the ability to add new elements via the interface (AB). I also tried to study the LOGIN example, trying to post to the form without succeeding (obviously changing the fields with those of my site), and in this case I don't understand, if in case I managed to POST successfully, how to at that point show the iframe of the site with the login already done.

I accept advice, thanks!

Hello Paolo,

Something that give my attention is when you say "I tried to use the iframe but the login does not finalize the access, it reloads the page." Certainly, I try to put this website (decsoftutils.com) in an IFrame control and then try to login it: to my surprise I get the same result that you refers, however, this is related with the debugger browser used in DecSoft App Builder: maybe I can do something about, however, if you try the app in another browser (Firefox, for example) or compile it with Apache Cordova and run the app in Android (for example), you can see that you can login to this website as expected.

The Login sample app is quite simply, and, it's not intended to login to "any website", to say like that: what the sample try to show is how we can certainly connect to a server script (PHP in the sample) providing a login and a password: only if we provide the correct login and password, we get the right server's response, and in other case we never can see the expected response, but a login error. So we can use this kind or similar login to perform login and password protected operations in our app server, but, not to login to a website.

On the other hand, in my knowledge, the only way in which we can send something to the IFrame source content is by using the URL: certainly we can set the IFrame's source property to an URL like: https://www.mydomain.com/?myvar=myvalue, so, certainly we are sending some information to the website which is intended to be show in the IFrame: what the website do with the data that we send is something that is a duty of the website: if that website is of our property, may we can perform a login with the sended data, for example.

About the possible usage of an IFrame to show controls similar than AB, you can take in consideration that AB uses the Boostrap CSS framework, so certainly it's possible to have something inside an IFrame that looks similar than the AB controls, since we use the Bootstrap CSS framework in our IFrame content, for example, a button in AB is a button of the referred framework, so we can use the right framework's CSS classes in order to get a button similar than the buttons which AB provided:

<button class="btn btn-md btn-primary">My primary kind buton<button>

I hope this information can help you in some way. If I am not wrong, probably the scenario that you are looking for is the ability to login in your website using the provided website's login form, and, what you get is the "reload iframe problem": as I say in my first paragraph, this is apparently a problem with the debugger browser used in DecSoft App Builder: once your app be compiled with Apache Cordova, for example, or just run in an external browser, you can login in your website as expected, and, in fact, the user session is not loss if your app is stopped and started again: I try this in Android with this website and works like a charm.

Please, post here if you have any further related questions, Paolo.

---

Thanks! that's right, this is the way (?myvar=myvalue )I was studying to create the registerid and register it in the user profile db for push notifications. Thank you for clarifying my ideas and the news of the iframe functioning. Good weekend David!

Hello Paolo,

Glad to know that you got it, sir, and, always thank you for your trust. Have a nice weekend too!

---

Hello Paolo,

Talking about IFrames and Android and iOS apps, I want to say something that may can be useful to you, because you must take it into your consideration. Commonly we must take care when deal with possible links inside our apps. This means that we must control all the links that we can place inside HTML controls, for example, handle it and don't leave the link to be opened "in a normal way". What we must to do, basically, is to handle the link and open it in a new window: it's possible to open it in the system's browser or in the browser provide to us by the Cordova "InAppBrowser" plugin.

Maybe it's not your case, however, we must handle the links because, if we don't handle it, they are opened inside our app's Webview, and, this can cause some problems. Not in all apps this problem appears, but, can appears in some specific apps. For example, supose we maintain an user session inside the app: if we allow the links to be opened in the app's Webview, when the user come back to the Webview, we can loss the app's variables, and, therefore, the user session (saved in that app's variables) is also loss. The solution is always the same: use the Cordova "InAppBrowser" plugin to handle the possible links and never allow the link to be opened in the app's Webview.

I want to mention this "link issues", which is not only related with AB, but, with any Apache Cordova app, because the IFrame usage can put us in a trouble if we need to handle the links... basically we can't do it... because the links which are inside the IFrame cannot be controlled outside the IFrame. So this means we cannot use an IFrame control in our apps? Not at all. We can use IFrames and sometimes they are quite useful, but, the content of the Iframe must be more or less know, and, for example, the links inside the IFrame cannot use a "target=blank" in the links, ni other words, all the links inside an IFrame must be opened in the same IFrame.

Again, maybe this is not a problem in your specific app: maybe the app don't rely in variables, so, maybe we can loss the control with a link who are opened in the app's Webview, and then, we can get back to the app without problems. However, I think that I must refer this possible problem in case you plan to use links to with "target=blank" in your IFrame's content. Because a "target=blank" means "open the link in a new window", and, this new window (for the IFrame) is the app's Webview itself. If your website, then, don't open links in new windows, there is no problem, because your website's links will be opened inside the IFrame, so you don't loss the control at all.

Please, post here if you have any questions or doubt about what I am trying to explain here around the possible link issues inside IFrames. I am not sure about what you are trying to do, so, I don't know if you need to use an IFrame (for example, you no need it if you want to post some information in your website's database, you can use an HTTP control to post it, or just use an XMLHttpRequest to do it). But, if you really want to use an IFrame, then you must take note about the links inside the IFrame's content: the links can be only opened inside the same IFrame / window, and, never have links with "target=blank", since the links will be opened in the app's Webview and this can cause some unexpected (in fact expected, but, anyway a non desired) behaviour.

---

You have been very clear and detailed, what I need to better assimilate my knowledge, I take into account all what you have said, and I will make good use of it. I am trying to understand How to make the most of your wonderful app. Starting from the initial base interact with the website, and subsequently I hope to work better with direct calls to the database and have the customized output site interface (like UI app).

Thanks

Hello Paolo,

No problem! I am sure that, with time and work, you can get something useful and working as expected.

---