I have build an app with an NativeScript WebView and all working good. But the speed performance of the content inside the WebView is much slower then in for exemple Safari.
main-page.js
var createViewModel = require("./main-view-model").createViewModel;
var webViewModule = require("tns-core-modules/ui/web-view");
function onNavigatingTo(args) {
var page = args.object;
var webView = page.getViewById("webview");
webView.on(webViewModule.WebView.loadFinishedEvent, function () {});
webView.src = "https://google.com";
page.bindingContext = createViewModel();
}
exports.onNavigatingTo = onNavigatingTo;
My question is:
Is NativeScript WebView an UIWebView? And if so, how do I get the UIWebView to and WKWebView?
NativeScript 3.4+ uses WKWebView.
Related
i am new to react native and very familiar to iOS with swift language.My requirement is in an iOS existing app there will be a web view which is loading a react native app ,here i want to use some values of iOS app in react native.
for example , in iOS app there will be an authorization code ,this auth code i want to use in react native app which is loading in UIWebview.
override func viewDidLoad() {
super.viewDidLoad()
loadReactNativeApp()
}
func loadReactNativeApp(){
let link = "https://staging.abcdefg.com:1442/appname_web/"
let finalUrl:URL!
finalUrl = URL(string: link)
let urlRequest = URLRequest.init(url: finalUrl!)
webview.load(urlRequest)
}
I don't have idea how could we pass the values to react native app.Can any one help me to solve my problem would be great.Thankyou
You have to use the injectedJavaScript prop from WebView.
Eg:
First declare a jsCode variable:
const amount = 2
const jscode = `
if (document.getElementById('txtAmount') == null) {
// field not existing, deal with the error
} else {
document.getElementById('txtAmount').value = '${amount}';
}
`
Please notice the " ` " character. Used to put variables in strings.
Then use it like so:
<WebViewBridge
injectedJavaScript={jsCode}
Using swift 4 and IOS 12 ,i am using a webViewKit to load a website. One of the features of the web app is to scan qrcode, i have successfully loaded the website but i am still struggling how to access the device camera to scan qr code, in android everything works fine including this qr code scanner using webView onPermissionRequest method. I have already tried this
Key : Privacy - Camera Usage Description in info.plist
and also adding these lines of codes here AVCaptureDevice.authorizationStatus(for: .video) on url load before pressing the web button to scan qr code. According to our web developer this button press executes a javascript undefined function, but i don't know how to make webViewKit respond to this button click event and the hardest part is that there are no logs or NSLogs to evaluate. I am new to IOS development for about almost a month. Thank you
var WebCodeCamJS = function(element) {
'use strict';
this.Version = {
name: 'WebCodeCamJS',
version: '2.7.0',
author: 'Tóth András',
};
var mediaDevices = window.navigator.mediaDevices;
mediaDevices.getUserMedia = function(c) {
return new Promise(function(y, n) {
(window.navigator.getUserMedia || window.navigator.mozGetUserMedia || window.navigator.webkitGetUserMedia).call(navigator, c, y, n);
});
}
HTMLVideoElement.prototype.streamSrc = ('srcObject' in HTMLVideoElement.prototype) ? function(stream) {
this.srcObject = !!stream ? stream : null;
} : function(stream) {
if (!!stream) {
this.src = (window.URL || window.webkitURL).createObjectURL(stream);
} else {
this.removeAttribute('src');
}
};
Above code is a js function named webcodecamjs.js that is being executed from a button click event on the web page. I found similar problem with solution here , but i'm not quite sure how to implement it, it says
Now Add JS file (WebRTC.js) that defines various WebRTC classes, functions & passes the calls to the WKWebView.
In the WKWebView inject the script at the document start:
where do i put this WebRTC.js file? what i did was to create a new file in my ios project and named it WebRTC.js , i also tried renaming it to webcodecamjs.js like what we have in web js files, how i did it in func viewDidAppear
let contentController = WKUserContentController()
contentController.add(self, name: "callbackHandler")
let script = try! String(contentsOf: Bundle.main.url(forResource: "webcodecamjs", withExtension: "js")!, encoding: String.Encoding.utf8)
contentController.addUserScript(WKUserScript(source: script, injectionTime: WKUserScriptInjectionTime.atDocumentStart, forMainFrameOnly: true))
let preferences = WKPreferences()
preferences.javaScriptEnabled = true
let configuration = WKWebViewConfiguration()
configuration.preferences = preferences
configuration.userContentController = contentController
configuration.allowsPictureInPictureMediaPlayback = true
webView.navigationDelegate = self
webView.configuration.preferences = configuration.preferences
WKWebView.load(webView)(NSURLRequest(url: NSURL(string: encodedLoginUrl)! as URL) as URLRequest)
webView is a
#IBOutlet weak var webView: WKWebView
not declared as below
var webView: WKWebView
that's why i can't do something like below, cause it gives me 'weak' warning
webView = WKWebView(frame: CGRect.zero, configuration: config)
Could you add code snippet to check?
I have a web application that uses the WkWebview and has offline data stored in an IndexedDB. I am trying to load an offline PDF file from within the WkWebview using the following javascript.
var blob = b64toBlob(UserResource_data[i].PDF,'text/html'); //Stored as base 64 in indexeddb
file = new Blob([blob], {type: 'application/pdf'});
fileURL = webkitURL.createObjectURL(file);
ResourceLink = 'View PDF';
However nothing loads in the webview I just get a white screen and nothing crashes.
Swift Code:
self.webView!.loadRequest(navigationAction.request)
I have implemented a method to handle links with _blank for the target and it works fine for loading external pdf files.
Is this supported by WkWebView? or does anyone have any better ideas.
Embedding these files within the project is not an option as they must be externally update-able
EDIT - Found Workaround
Instead of using "createObjectURL()" I created a data URL
function LoadOfflinePDF(id){
var blob = b64toBlob(UserResource_data[id].PDF,'text/html');
var reader = new FileReader();
var out = new Blob([blob], {type: 'application/pdf'});
reader.onload = function(e){
//window.open(reader.result,'_blank');
console.log("LoadedpdfURL: "+id);
UserResource_data[id].PDF = reader.result;
}
reader.readAsDataURL(out);
}
Then created a popup with the dataURL
function openPDFReader(){
var id = this.id;
id = id.split("_");
id = id[1];
console.log("Opening: "+id);
window.open(UserResource_data[id].PDF);
}
So now I can properly display my offline PDF files stored in IndexedDB using the WKWebView
I used webview to display a pdf which contain url links to images. However, I want to intercept the link click to display a new view instead
my webview code
webView = new UIWebView (View.Bounds);
string fileName = "EMG.pdf"; // remember case-sensitive
string localDocUrl = Path.Combine (NSBundle.MainBundle.BundlePath, fileName);
webView.LoadRequest(new NSUrlRequest(new NSUrl(localDocUrl, false)));
webView.ScalesPageToFit = true;
I looked up how to do it in obj c but I can't seem to find the equivalent method in xamarin ios
I am using Phonegap 2.6 on iOS and when a link opens it uses the fullscreen with no way of going back to the app. Is there a way to trigger some sort of controls to go back to the app? The code I have is below:
function shareonfb()
{
photoid = sessionStorage.PhotoId;
filename = sessionStorage.PhotoFilename;
postUrl = "http://site.com/sharedimage.php?photoid="+photoid;
imageUrl = "http://site.com/images/"+filename;
var sSiteUrl="http://www.facebook.com/sharer.php?s=100&u="+postUrl;
var ref = window.open(sSiteUrl, '_self', 'location=yes', 'presntationstyle=pagesheet');
}
Solved the issue by changing _self to _blank
So:
var ref = window.open(sSiteUrl, '_blank', 'location=yes');