HTML5 and javascript in xcode - javascript

I'm quite new to xcode, because I mostly work with JS and HTML5. I've decided to create a simple webview app that enables me to work with JS and HTML5 (going to put it on Github asap)
Now my question is about accessing certian iPhone features that I cannot use in Safari or Chrome (the reason why I'm creating this).
So the question is: is this possible? for example, I can't access the camera (as a fullscreen background I mean) in an iOS browser, but can I use it in webview?

You need any method of communicating between UIWebView and the containing app. There are libraries out there that do just that, some better some less. In case you do not want them... So to outline the techniques to do that:
App talking to the webView - using [webView stringByEvaluatingJavaScript:...]
Webview talking to the app - using url directives. Which is essentialy window.location = ... with custom fake urls, and then parsing the NSURLs in the delegate method webView:shouldStartLoadWithRequest:navigationType: and of course returning NO to prevent actually navigating to your fake urls.
If you find that you are missing consecutive URL requests, you could write a JS function that takes the URLs, puts them all in an array, pops one by one and sending them to the browser in a setTimeout(..., 0).

You need to use something like this - Cordova or PhoneGap ( Both are the same thing )
"Apache Cordova is a set of device APIs that allow a mobile app developer to access native device function such as the camera or accelerometer from JavaScript. Combined with a UI framework such as jQuery Mobile or Dojo Mobile or Sencha Touch, this allows a smartphone app to be developed with just HTML, CSS, and JavaScript."
Here is a description of all the device features cordova or phonegap allow you to use - Plugin API's

Yes, is it possible, but using a web app container like Phonegap.
If you need more info how install it visit this web.

Related

How to use js bridge in chrome custom tab

Google oAuth is not supported in android webView. Google recommends to use chrome custom tab for proceeding oAuth. I have also requirements of js call from my web app to native. How to configure to call native methods from web app using chrome custom tab in android similarly like js interface in webView?
Update 1
This mod Chang marked the post as duplicate but the post is different. I don't want to run any JS in my web app from native. I want to invoke method from web app to my native code via JS interface. Is there any way for CCT?
Based on Can I Inject Javascript Code into Chrome Custom Tabs the answer appears to be no.
Chrome Custom Tab is based on Chrome itself and has the same security model. The web content is only allowed access to the Web APIs (camera, device orientation, etc.) and has no access to the native app. At best the native app can capture a URI.
Even the Chrome Custom Tab documentation state that the way for a native app to handle content:
Some URLs can be handled by native applications. If the user has the Twitter app installed and clicks on a link to a tweet. She expects that the Twitter application will handle it.
Before opening an url from your application, check if a native alternative is available and use it.
Implies that either a native app handles a URL or not. My interpretation of Chrome Custom Tab is a skinnable Chrome component adjacent to the native app rather than internal to a native app like a WebView where a Javascript bridge exists.
Your desire for a Javascript bridge from a web app would mean that there would be a arbitrary way for any website code to interact outside of the web container. The rational as to why that is not allowed is given as the responses in the first link.

Using Microphone API inside a UIWebView in pure JS

Is it possible to access Audio related stuffs with only JS? Or do i need to use the native code behind the scenes, using a UIWebView and the Objective-c lang to wrap the mic related methods? What i need is something simple, hear to sounds and do some algorithm to the signals received, but only inside a UIWebView, as a web app only. Is this a technical limitation, or is this possible?
I would assume you could use any of the HTML 5 WebAudio APIs from within the webview: https://stackoverflow.com/a/20759947/78496
With iOS 11 supporting getUserMedia() you can now access the microphone using only JS in Safari. However, it will NOT not work in UIWebView, WKWebView or SFSafariViewController (see this answer and this question).
In Safari, once webcam/mic permission is given and the mic data kicks in you can encode the sound using JS libraries like Recorder.js (wav), WebAudioRecorder.js (wav,mp3,Vorbis) or vmsg (mp3).
You can also use the (native) Media Recorder API to capture (Opus) audio - together with this neat polyfill for Safari 11 and Edge - but its still reliant on getUserMedia().

Allow access to weblink only via native iOS and Android apps

I have website link at which I have designed a html/javascript web app. I used iOS and Android app to create an app that encapsulates the web app.
Is there a way to block access to the website link and only allow access to the website link only thru the native apps calling the link.
In short safari, IE, Chrome must not be able to access the link, but the iPhone & Android app should be able to access it.
Is there some way to tell that the app is accessing the site and not the phone or pc browsers.
I am sure there a number of ways to implement this.
Thanks,
It depends on how is the web app implemented. Since native Web Views are pretty much the wrapper for the standard browser (Safari/Chrome), you will find it tough to filter it based on that.
What you can do, however, is to add an extra GET variable (for ex. &ref=youruniquecodehere) or a custom User-Agent, based on which you will be able to identify, whether your application authorized the request (with a proper access code) or if it's a generic request using browser.
However, both of these options can still be bypassed if researched, although it'd require slightly more time. Not sure whether a solution that would work in 100% of cases exists.
Hope that helps, please correct me if I'm wrong.

Google Analytics not working in Webview in iOS app

Let me first start out by saying I know how to use the iOS SDK so please don't answer this with a "just use the SDK." I want to know WHY google analytics is not working.
Here's my setup. I have a web app that is also baked into an android app and ios app via webview. I'm using cordova. The android app works just fine with the GA JS code. The web works just fine. However no events or page views are showing up from iOS. I've heard that GA is tied to the domain so does an iOS Webview do something under the hood to the domain?
I was going to attach my code snippet but it's coffeescript in a few classes so I'll just paste the compiled js
Analytics.prototype.track = function(args) {
window._gaq.push(args);
};
Analytics.track(['_trackEvent', 'SubscriptionModal', "Closed", data]);
This works fine in web and android so it's not a JS. I'm setting the GA _setDomainName to 'focusatwill.com' and can see that both ios and web have a domain of 'www.focusatwill.com'
I've read online a few people talking about this issue and everyone says just use the SDK. I'm looking for the reason why it doesn't work. How do you fix it to use the JS?
edit
I should mention that the html and JS are not baked into the device, ie they don't have a local url but are served up from our webserver
Safari on iOS6+ blocks third party cookies by default, and I'm certain that webviews do too.
Check that you have something similar to the following in the init method of AppDelegate.m:
NSHTTPCookieStorage* cookieStorage = [NSHTTPCookieStorage sharedHTTPCookieStorage];
[cookieStorage setCookieAcceptPolicy:NSHTTPCookieAcceptPolicyAlways];
That's from the standard boilerplate generated by Cordova 3.0.9, but might not be present if you're using a version that predates iOS6. It sets the app-specific cookie policy, which should override the system default.

Sencha Touch and PhoneGap

You built your app in Sencha Touch, loaded it in a web view wrapper in PhoneGAP.
Now how would your Sencha Touch web app access data from PhoneGAP? since its in a web view?
Example you used PhoneGAP to get UDID, or device contact list etc, how are you suppose to send that to sencha? since its in a webview? Possible? If not what do you do?
An Intent? There is nothing more universal in Android than an Intent.
So Sencha Touch part issues an intent. Your PhoneGap HTML5 WebView catches this Intent. A WebView is still in an Activity. Its just a different type of activity I believe. So the activity webview can processed data/generate data based input or whatever and send out in the bundle of an Intent. Either side could also store in SQLite or SharedPreferences, and just use the intent to notify of the data change or request. Also consider startActivityForResult(intent) to get data back.
First for all Sencha Touch is just the framework you use to build your app.
It doesn't control your application.
If you are using Phonegap as your Webview wrapper. By the way Sencha now also offer a "Native Wrapper".
You would call the various javascript api's which Phonegap will map to its native counterpart. Depending which api you called and if any data was returned you can handle this in a callback.
That's about it, there is need send anything to Sencha as you describe it.
Its more a callback centered just like javascript.
The following links might help you.
http://www.sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap/
http://robertdougan.com/posts/packaging-sencha-touch-2-with-phonegap-cordova

Categories

Resources