I'm trying to intercept a specefic post request and get it's body when I load a page using flutter's InAppWebView package.
On iOS this solution, which uses "shouldOverrideUrlLoading" to check on all the requests, works perfectly. But on Android seems like the navite Chrome browser of the Android OS doesn't allow the inAppWebView package to catch post requests.
Also, i'm able to get the all the requests URL's by using "shouldInterceptFetchRequest" from the InAppWebView package but not their bodies, which is what I need.
Related
I am developing an application in which I have to first examine the URL and then allow or disallow the HTTP request. So I wanted to know how can we do this in the Android Studio i.e. to examine every URL HTTP request in the device to pass through my android app so that I can analyze it.
Have a look at Android VpnService (added in API 14.)
There is also a Guide on it.
It probably also would not hurt to look at current opensource VPN projects for android: https://github.com/schwabe/ics-openvpn
So I've created a simple WebView application that wraps an already existing mobile friendly site and displays it on the device. I've enabled javascript, supported screen orientation changes, etc...
I've run into an issue with the oAuth support though. Accessing the site from the chrome browser on the device, everything runs fine.
If I try to access the site from the app/WebView, it will push me over to the oAuth screen, let me input credentials and everything, but the moment it tries to push me back to the website and log me in, I get this:
Failed to recognize URL query:
https://exittix.com/frontend/login/redirect.html#access_token=******************************&expires_in=********&state=****client_id=******************network*****facebook*****display***popup****callback****_hellojs_agj27sx5****state****oauth_proxy***https***auth-server.herokuapp.com%2Fproxy***scope***basic_profile***email***basic***oauth***version***auth***https***facebook.com%2Foauth***
The * is used to protect data.
So, any ideas why oAuth isn't working inside a JS enabled webview but works fine in the mobile chrome browser for android?
Thanks in advance for your help!
EDIT:
Ok, so I've tracked the error I'm getting back to redirect.html.
This page calls some javascript. If the javascript fails to redirect, then it displays that error I have above instead.
The javascript being called to handle the oAuth is Andrew Dodson's hello.js script.
You can see it HERE.
I've concluded that the second half of the error's url is indeed the unhandled JSON.
Here's what the returned data looks like after I've decoded it from the URL encoded characters:
{"client_id":"************.apps.googleusercontent.com","network":"google","display":"popup","callback":"_hellojs_********","state":"","oauth_proxy":"https://auth-server.herokuapp.com/proxy","scope":["https://www.googleapis.com/auth/userinfo.profile","https://www.googleapis.com/auth/userinfo.email","basic"],"oauth":{"version":2,"auth":"https://accounts.google.com/o/oauth2/auth"}}&access_token=***.*.*****_*********************************************************&token_type=Bearer&expires_in=3600
Any ideas why this isn't getting handled properly in the WebView?
This might seem to be a weird problem, but I am curious to know if it would work. I am working on a POC, and hence have to either prove or disprove that this works or not.
The UI in the Android app would be native (Java + XML layouts) + some other device features access like (Camera/File system etc).
There is a JS library that I have built, that has a few functions which do Ajax post and get requests.
In the app, I have an invisible Webview, where I load a blank HTML (referencing this JS library). And into that WebView, I have injected a JavascripInterface. So, essentially, the UI would be native, and you would never see the Webview. That's just a host which provides access to my JS library to the native code.
Now, on some action on my UI, I call the JS functions on the Webview, which in turn tries to make an ajax call (loadUrl calls ex. javascipt:functionName()). But, those calls fail, without any visible errors.
Note: This same HTML file works, if I load it up on my desktop browser. The AJAX calls succeed.
But, when I initiate Ajax calls through the JavascriptInterface(or webview.loadUrl() calls), they fail, with a reponse status 0.
Things apart from AJAX, like simple function calls, alerts, and callbacks through javascript interface work fine though.
Q: I know this is a weird and an unpractical way to do things. But, would it/should it work?
Update: Even after setting the setBlockNetworkLoads(false), it still doesn't work.
I tried logging the JS calls and errors, and got this error.
Request header field X-Requested-With is not allowed by
Access-Control-Allow-Headers.
Any idea how to solve this?
It seems that your are trying to do a cross domain ajax request.
Cross domain requests are not allowed by same origin policy and so the requests will be blocked. If you are loading a local file in webView and then sending ajax requests from it to other domains, this will be the case.
You if that is the case and it is the same origin policy causing you trouble then you might want to look at Cross-origin Resource Sharing (CORS) or JSONP to workaround it.
Given the error you get it seems that your problem is similar to one discussed here:
Cross-Domain AJAX doesn't send X-Requested-With header
You might want to change server settings to allow X-Requested-With header.
Also it seems that from API level 16, webSettings added a method setAllowFileAccessFromFileURLs(). Setting this to true for the webView might solve the problem as well.
I had a similar issue where I was loading a "web-app" locally into a WebView, just doing Ajax remotely. I observed a similar problem where Javascript alerts etc worked fine, but AJAX calls didn't. It turned out that by default the WebView blocks "network loads".
Make sure you do this:
webView.getSettings().setBlockNetworkLoads(false);
That did it for me. Just to clarify, I wasn't using a Javascriptinterface - just loading a web-app as-is using webView.loadDataWithBaseUrl() - the baseUrl parameter passed to this method was where I perform all my AJAX calls (since this method respects the same origin policy)
I created my first Sencha touch 2 app by watching this video (http://youtu.be/5F7Gx0-W-M4) and it has a store page structured like this:
Ext.define('FirstApp.store.Places',{
extend:'Ext.data.Store',
config:{
autoLoad:true,
model:'FirstApp.model.Place',
proxy:{
type:'ajax',
url:'https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=500&types=food&name=harbour&sensor=false&key=AIzaSyCFWZSKDslql5GZR0OJlVcgoQJP1UKgZ5U',
reader:{
type:'json',
rootProperty:'results'
}
}
}
})
The after-build (after running "sencha app build native") package work very well on my MAC (all browsers) but the generated app (i am running it on my nexus phone) works but doesn't collect any data from the google maps json.
Any help would be appreciated
The example you are referring is using google map's place search API. You can not use this API when you build the app for mobile phone with proxy set to ajax . Basically, you can not use any resource that is outside your domain. Like if your site is at yourdomain.com and there is someotherdomain.com, then you can't make ajax request to this someotherdomain.com from yourdomain.com unless that domain allows you to. In this case, your mobile app is not having any domain. You are just loading a page inside webview.
The reason is, ajax will not be able to load cross-origin resources. App build works on browsers because I believe you're using chrome with --disable-web-security flag. To work with CORS you need to use JsonP proxy. It's the only way if you're packaging for mobile app. If in a case, you own the server ( not in this context though ) then you can allow CORS by setting appropriate headers like
Access-Control-Allow-Origin: *
or
Access-Control-Allow-Origin: http://yourdomain.com/resource
Try setting proxy to JsonP .
I'm trying to integrate Twitter sharing functionality into my Android PhoneGap application, and rather than re-implement the controls to shorten URLs and track tweet length, I thought I'd use their premade web intents at https://twitter.com/intent/...
So I'm trying to launch a URL like https://twitter.com/intent/tweet?text=Hello in a ChildBrowser window, so that I can let Twitter's interface take over. The user could sign in with their credentials, and once they're signed in, the text from the URL params would appear in the Tweet box.
It won't work. When I use http://twitter.com/intent/... instead of https://twitter.com/intent/... , ChildBrowser displays the sign-in screen, but as soon as the user submits their credentials, the screen goes white. I suspect this is because Twitter switches over to HTTPS.
I confirmed that this was the case by trying a simple window.open instead of window.plugins.childBrowser.showWebPage. I have no problems with HTTP / HTTPS when using the native browser on Android. However, the native browser prompts me to accept an unverified security certificate. I suspect this is the problem with ChildBrowser - it doesn't know how to handle that prompt.
Using the native browser popover simply isn't an option: the user needs to be able to exit the process after hitting 'Tweet' or 'Follow', etc., but the 'back' button on the Android device simply moves the history one step backward to the POST action for their intent. Then, it re-launches the app from scratch, instead of returning you to the original state.
How can I configure ChildBrowser / my Android Phonegap application to override SSL issues on Twitter, so that I can run web intents in Childbrowser?
The relevant code is:
base="https://twitter.com/intent/tweet?text=";
URL=base+encodeURIComponent("it works!");
// works, but asks to accept a certificate
window.open(URL);
// blank white page
window.plugins.childBrowser.showWebPage(URL, { showLocationBar: true });
My cordova.xml file has whitelists configured as such:
<access origin="http://127.0.0.1*"/> <!-- allow local pages -->
...which I don't suspect should be a problem. However, a basic test of swapping origin=".*" yielded no change in behaviour.
I've also examined the HTTP and HTTPS headers for the Twitter intent landing pages. There doesn't appear to be anything out of line - they're identical, except for the Strict-Transport-Security header for HTTPS, which works elsewhere (e.g. Github).
Please help!
The ChildBrowser is not bound by the whitelist. The whitelist is only used to keep the main PhoneGap app from running code outside of trusted domains.
I'm confident if you go get the latest ChildBrowser code from Android you won't have run into this problem anymore. We've made some changes recently that make it more robust.
Also, Libby has a good tutorial integrating Twitter and the ChildBrowser.
http://www.mobiledevelopersolutions.com/home/start/twominutetutorials/tmt5p1