Share cookies between flutter webviews - javascript

I'm developing a flutter app with Webviews using this plugin: Flutter_inappwebview.
At first, I am loading a webview with the login page in a own domain and later redirect users to a different domain url. On this second url I inject an iframe menu loaded from the same site where the user was logged before. I need the login cookies accesible on this iframe, but i can't get it working.
Menu is loaded and the cookies exists, but the menu injected with an iframe in the second domain doesnt' works.
By the way, i need a way to communicate between javascript loaded in the url and a flutter webview. I tried with the services included in the plugin, but doesn't work.
Thanks for your help =)

You can use the cookies_jar package available for flutter to achieve the behaviour you are expecting.

Related

Using CORS to handle reauthentication on another site

I'm trying to handle reauthentication using a different Authorisation website, while within a Single Page Application (SPA) in my home website. Both websites are internal to a client site.
I can't use the standard "redirect" method as I'll lose my SPA JavaScript context.
I've investigated and had CORS setup on the Auth website so it's now returning Access-Control-Allow-Origin: https://www.mywebsite.com. When I try to load the Auth page into a JQuery UI dialog it fails as the scripts all try to load in the context of the Home website.
i.e.
From my website https://www.mywebsite.com/static/
I'm loading https://www.auth.com/login.html.
When loaded into a JQuery UI dialog it tries to load it's scripts as https://www.mywebsite.com/static/scripts/authscript.js
instead of
https://www.auth.com/scripts/authscript.js
I also tried loading the Auth page into an iframe by changing the src tag but it just reloaded the page.
Is there a way to change the Source directory in the context of the CORS web page I'm trying to show?
So I couldn't get the page to load correctly into a standard jQuery Modal dialog and I have no control over the Auth page I was connecting to. To solve this I investigated the problem I was having with the iframe and used an HTML5 feature sandbox to fix it.
The Auth page was using a "break out" script to reload the page if it was loaded into an iframe and obviously this broke my SPA context. HTML5 allows you to restrict the contents of an iframe.
<iframe src="" id="my_auth" sandbox="allow-forms allow-scripts allow-same-origin"></iframe>
allow-forms Allow form and submit
allow-scripts let it run JavaScript
allow-same-origin let it consider the Origin the same as the script (i.e. the Auth website), this was necessary to enable cookies
Of note is that I am not including allow-top-navigation which is what was allowing the reload of the page and loss of my JavaScript context
VoilĂ , auth page displayed inside a jQuery modal dialog (containing the iframe) with no need to pop up another window.
CORS was necessary to allow the redirect to the Auth website (which happens in the browser before JavaScript gets involved). You could also trap the "Access-control-allow-origin" exception instead.
The iframe with the Siteminder login was accessing a page from my site that set a value in localStorage once the user had logged in. The app just polled localStorage in the background to see if the user had logged in successfully.
Hope this is useful to someone.

Spoof referrer when a iFrame is required to open application

There is an application which has two demands on opening the application.
First of all it has to be loaded via a iFrame. 2nd of all it has to be loaded from a specific referrer. If one of these isnt true, the application cannot be opened.
My question. Is it possible to work around those demands? So I spoof the HTTP request and I load it in a iFrame in my own website.
Ofcourse I can iFrame the application and ofcourse I can spoof the HTTP request. But I can't figure out a way to do it both, I can't see it. Somebody can help me out?
I would suggest creating a PHP file which gets the content of the website hosting the application (take a look here for an idea of how to do it), and then using your iframe to display the PHP page you just created.

Detect if PhoneGap/Cordova when loading external URL

I'm developing a PhoneGap/Cordova app which is acting as a wrapper to load and display an external URL to make a mobile website into an app using the code below:
window.open('http://www.website.com', '_self', 'location=no');
There are some elements of the mobile website which I'd like to remove on load, which aren't applicable when viewing in the app (such as "view full site").
Is there any way to detect, from the external website's JavaScript, if the page is being viewed inside a PhoneGap/Cordova app?
In the end, I used a query string parameter on the PHP page to inform it that it was being loaded inside an app.
I then used a cookie to remember it for the session and load some Javascript code if the query string is defined or if the cookie is set.

Facebook Login from a non hosted web page

I am creating an hybrid app totally based on Html, CSS and Javascript.
I want to add facebook login functionality but as the web page isn't hosted any where i keep getting the warning message :
Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App's settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App's domains.
Also clicking on the login button opens up a blank window.
Following this tutorial:
https://developers.facebook.com/docs/facebook-login/login-flow-for-web/
I am not using Phonegap , sencha or any other framework.
Is there a way I can achieve this?
You need to specify an authorised domain in order to use the Facebook SDK, because your HTML only sits on the handset, you don't have a domain.
Have a look at Parse. Parse is a framework built for Facebook integration within mobile applications.
https://parse.com/docs/js_guide#fbusers-signup
The other option is host the HTML, CSS and JS on a server and pull the content into the app through a WebView, this will allow you to have a domain that you can add to your App settings page.

How do I prevent a phonegap app from navigating away from it's local files?

I have a PhoneGap application with an iFrame which is loading content from a site I control. (same domain as the app)
The problem is that when using Javascript widgets like Facebook and Twitter, it's possible to navigate away from the local top level frame. I wouldn't mind so much if it were just the iFrame, but it's eating the whole app, and my preference really is to just redirect the user to an external browser to show the site.
How does one prevent this?
I've tried to counter with modification to the webView: shouldStartLoadWithRequest: method, but that won't work on other platforms, and I cannot easily distinguish between external resources loading in iFrames (SNS widgets) and the same scripts replacing the top level frame.
I think ChildBrowser Plugin can work for you. It will not redirect the calls to webbrowser but I believe it will satisfy your needs. It supports iOS and Android.
The child browser allows you to display external webpages within your
PhoneGap/Cordova application.
A simple use case would be:
Users can follow links/buttons to view web content without leaving
your app.
Display web pages/images/videos/pdfs in the ChildBrowser.

Categories