I have wkwebview, from it the camera is triggered, a photo is taken and uploaded to the web.
The problem is that when the photo is taken nothing happens on the web, the camera just closes and that's it, the button in webview that opens the camera stops triggering until you re-enter the application. Permishen to use the camera is added.
If you open through safari - everything works, android also has the expected behavior, but in webview ais does not want to load. Maybe something new has appeared in webview that needs to be enabled, given permission?
Tryedto allow inlinedmediaplayback, allowArbitryLoads
WebKit JS
RSS for tagAccess and modify DOM elements within a webpage, including touch events and visual effects, using WebKit JS.
Posts under WebKit JS tag
49 Posts
Sort by:
Post
Replies
Boosts
Views
Activity
Problem Description:
In the current scenario, I am dealing with a website platform that lacks traditional APIs for service access. To circumvent this limitation, the mobile application necessitates hosting a "web server" locally on "ws://127.0.0.1:****". The idea is that the website, loaded in a WKWebView, should establish a WebSocket connection with the locally hosted server. The responsibility for creating this WebSocket lies with the loaded website.
I am utilizing "Telegraph" to set up the local server within the iOS application. To verify the functionality of the local Webserver, I attempted to establish a WebSocket connection to it outside of the WKWebView, and the connection was successfully established.
Question:
Despite the success of the direct WebSocket connection outside of WKWebView, I am encountering difficulties when attempting to establish the same connection within the WKWebView. Is this approach even feasible? If it is, could you kindly point out any potential oversights or provide guidance on what might be missing in my implementation? Your assistance in resolving this matter is greatly appreciated.
Currently I am using Objective-C and embedding a React website into the WKWebview. I have a component with scroll function and I also have some text description with an input component in the scroll function component. If the input component is shown all and I onClick the input component for inputting value in it, it works normally. However, when the input component shows only half of it and another half is hidden by the scroll component (Because it scrolls to see only half of the input component), it will triggers an unexpected issue that the WKWebview will have a white bar on the bottom and it will keep exists and affecting my UI. I have checked with web inspector that it is outside of the tag. Therefore, seems it is related to the issue with the external keyboard behaviour.
Please provide some suggestion if anyone have any idea on this topic. Thanks a lot
Hi - Any suggestions on how I add my website into my Xcode App Build, using Xcode 13.4?
I want to develop the application where I can able to capture and send the touch events like TAP,Press,Swipe etc from iphone
to browser(Client) for remote support .can anyone suggest any method or API to capture Touch Events and the method to send on browser.
Is there any document or link is available or support for the same
Problems when connecting Bluetooth speakers on iOS devices. When trying to use the Web Speech Api -(Text-To-Speech) in safari immediately after connecting to a Bluetooth speaker, it playing the sound using the phone's speakers instead of the connected Bluetooth speaker's. Then, when I summon Siri and briefly use the voice function, the Web Speech API in the web browser uses the Bluetooth speaker, and it works. It seems that there may be some kind of limitation or issue when switching between Bluetooth devices and voice apis.
I built a web application that is designed to be run from my application bundle by using webView.loadFileURL(htmlFile, allowingReadAccessTo: projectFolder) on a WKWebView.
Inside of the site's folder is a directory of svg images (from the ionicons project). At runtime the code tries to load one of those images using:
req = fetch(url).then((rsp) => {
if (rsp.ok) {
return rsp.text().then((svgContent) => {
if (svgContent && sanitize !== false) {
svgContent = validateContent(svgContent);
}
(code from the ionicons project).
The rsp.ok check simply examines the response to the fetch request to see if the status code is in the range 200-299. For the "file://" URL, however Safari on both MacOS and iOS returns 0 in the status.
In spite of that 0, however the request has succeeded and the browser has the content of the file. If I modify the code to ignore rsp.ok the following call accessing rsp.text() succeeds.
I'm not sure what the expectations are for a file:// URL passed through fetch. Is the 0 status code a bug in Webkit or Safari, or is it an expected result for a file:// URL and the code making the fetch request needs work?
I have the following lines of code in our app:
@objc convenience init(webView: WKWebView, delegate: SomeDelegate, navigationDelegate: WKNavigationDelegate) {
self.webView = webView
self.webView.makeInspectable()
self.webView.navigationDelegate = navigationDelegate
self.webView.uiDelegate = self
self.webView.configuration.suppressesIncrementalRendering = true
self.webView.configuration.userContentController.add(weakSelf ?? self,
name: "handlerOne")
self.webView.configuration.userContentController.add(weakSelf ?? self,
name: "handlerTwo")
injectUserScripts() // Injects WKUserScripts into the webView.configuration.userContentController
}
My JS script looks as follows:
(function() {
addEventListener('mousedown', function() {
window.webkit.messageHandlers.handlerOne.postMessage('WKUserScriptMouseDown');
}, true);
})();
if (MyApp.getProperty("os") != null) {
window.webkit.messageHandlers.handlerTwo.postMessage(url);
} else {
console.log(url);
// non-mobile browser (for testing)
}
However I keep seeing an error in my Safari debugger:
TypeError: undefined is not an object (evaluating 'window.webkit.messageHandlers.handlerOne')
TypeError: undefined is not an object (evaluating 'window.webkit.messageHandlers.handlerTwo')
Hi guys, I'm a XR Developer, lately making a lot of web ar apps, I'm having an issue with iOS 17 at least on my iphone 14 Pro where the sound comes out of the call speaker, resulting very very low volume, sometimes I'm not sure how if I lock the phone and move it when I unlock it and go back to the webapp the sound it normal, loud and coming out of the media speakers.
How I used to do this is my "start button" I unmute a play and pause it, and with this I used to be able to play later sounds of videos on the browser.
Did something change with the last iOS 17 update? Is there a workaround for this? In the end what I want is be able to play sounds and videos on the web browser...
This is a tag of a project that was working fine before the 17 update:
And this is what I do on the start button:
video.muted = false;
video.play();
video.pause();
Help would be appreciated since I'm in the middle of deployment, thanks in advance
Javascript is being executed while using UI and WK WebView.
However, since iOS 17.0.3, the WTFCrashWithInfoImpl issue has been posted in CrashReport, and it has been determined that Javascript is not supported in WebView for certain users.
I wonder if there has been a fix in JavascriptCore.
window.getSelection().getRangeAt(0) is giving indexSizeError after selecting text from wkwebview in iOS 17. We are using evaluateJavascript functions for interactions. This was working fine in earlier versions. This problem is seen since the recent iOS 17 upgrade.
I want to save a CK record with a png-image as data into an asset field. The image is representated by a base64-string variable in the javascript.
Have given up after one week searching for an answer.
Hi,
I'm using MediaRecorder for screen recording of canvas , along with audio.
simplified code to implement screen recorder
//intialise stream
const canvas = document.querySelector('.main-canvas');
const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
for (let track of canvas.captureStream().getTracks()) {
stream.addTrack(track);
}
recorder = new MediaRecorder(stream);
chunks = [];
recorder.ondataavailable = ({ data }) => {
if (data) chunks.push(data);
};
recorder.start();
recorder.onstop = () => {
const videoBlob = new Blob(chunks, {
type: 'video/mp4'
});
chunks = []
//stop mic access after use
try{
for (let track of stream.getTracks()) {
track?.stop();
}
}catch(e){}
return videoBlob;
}
so when i call recorder.stop() , the recorder.onstop method is not getting called sometimes randomly.
And also in case when recorder.onstop is not called , recorder.ondataavailable is not called even a single time,So it returns empty Blob output.
This only occurs in iOS 15 device's , it occurs randomly 40% of the times.
Is there any workaround for this, or what is cause of this issue?
Thanks in advance
In iOS16.4 the push notifications on progressive web apps are working but they didn’t have any sound while they appear.
is this a bug or is there any way to enable the sound on push notifications on web apps ?
When use jsCore, The error reporting location is where JS communicates with Native, and the stack does not contain any valid information. Anyone konws what's the problem.....
Does webkit have a way to display a smart banner for a home screen web app similar to how a smart banner can be displayed for native apps?
I recently noticed (10/23) that Twitter showed a smart banner encouraging Home Screen web app on my Mac running Sonoma.
How is this done?
I randomly get this crash in my webview application when loading data. There is no pattern to it, it can happen in all areas where images are being loaded into vram.
Here is the error:
2023-09-16 19:57:55.404378+0200 Bluelife[3284:194440]
[Process x10d004350 - [PID=3445]
WebProcessProxy: :didClose: (web process 0 crash)
2023-09-16 19:57:55.404500+0200 Bluelife3284:194440]
[Process] 0x10d004350 - [PID=3445
WebProcessProxy::processDidTerminate0rFailedToLaunch:
reason=Crash
2023-09-16 19:57:55.404579+0200 Bluelife[3284:194440]
[ProcessSuspension] 0x10c01dfe - ProcessAssertion:
Failed to acquire RBS Background assertion
'XPCConnectionTerminationWatchdog' for process because
PID 0 is invalid
2023-09-16 19:57:55.410251+0200 Bluelife[3284:194440]
[Process] 0x130856218 - [pageProxyID=14, webPageID=15,
PID=3445] WebPageProxy: :processDidTerminate: (pid
3445), reason=Crash
2023-09-16 19:57:55.411392+0200 Bluelife[3284:211863]
[ProcessSuspension] 0x10c01dfe -
ProcessAssertion::acquireSync Failed to acquire RBS assertion 'XPCConnectionTerminationWatchdog' for process with PID=0, error: (null)
2023-09-16 19:57:55.424321+0200 Bluelife[3284:194440]
[Loading] 0x130856218 - [pageProxID=14, webPageID=15, PID=3445] WebPageProxy::dispatchProcessDidTerminate:
reason=Crash
When rendering 2 'div' components with 'display:flex' placed on top of each other, the preceding one sometimes comes up. The 'position:absolute' has been set and the second 'div' component is being generated after the first one. However, when inspecting the iOS webview in Safari, I enable-disable the 'display:flex' property, everything starts working again. This is possibly a bug in the layout engine.
I tried the same process in iOS 16.4 and there are no issues at all.
Hello.
I'm trying to stop my webview from asking for mic permission every time it runs, as I already handle it out in the application. This is the code I use, but it doesn't seem to run the code for the permission at all (tried printing and debugging, and it doesn't go into it at all). I am using visionOs if that makes a difference. Are there any alternative solutions to this?
import SwiftUI
import WebKit
import AVFAudio
struct WebView: UIViewRepresentable {
let urlString: String
func makeUIView(context: Context) -> WKWebView {
let webView = WKWebView()
webView.navigationDelegate = context.coordinator
if let url = URL(string: urlString) {
let request = URLRequest(url: url)
webView.load(request)
}
return webView
}
func updateUIView(_ uiView: WKWebView, context: Context) {}
func makeCoordinator() -> Coordinator {
Coordinator()
}
class Coordinator: NSObject, WKUIDelegate, WKNavigationDelegate {
// Handle media capture permissions
func webView(_ webView: WKWebView,
decideMediaCapturePermissionsFor origin: WKSecurityOrigin,
initiatedBy frame: WKFrameInfo,
type: WKMediaCaptureType) async -> WKPermissionDecision {
return .grant
}
// Handle URL authentication challenges
func webView(_ webView: WKWebView, didReceive challenge: URLAuthenticationChallenge, completionHandler: @escaping (URLSession.AuthChallengeDisposition, URLCredential?) -> Void) {
let username = "user"
let password = "password"
let credential = URLCredential(user: username, password: password, persistence: .forSession)
completionHandler(.useCredential, credential)
}
}
}
struct AssistantView: View {
@Environment(\.dismissWindow) private var dismissWindow
var body: some View {
WebView(urlString: "https://somelink.com/")
.edgesIgnoringSafeArea(.all)
.frame(width: 500, height: 800)
}
}
We have observed that safari / IOS WKWebView waits for ~250 renderable bytes before it starts to render HTML as received in the browser. This is different from the behaviour in chrome / Firefox where they start to render the content as soon as the first byte is available. We wanted to know if there’s a way to stop this behaviour, to bring parity across the two browsers. Also is there any official doc / announcement establishing this limit of ~250 characters which we’ve found experimentally.
Details of our experiment:
We created a simple HTTP Server In python that:
Emits a stream of (100) characters
Sleeps for 3 seconds
Emits some more characters
You can find the experiment code towards the end of the post
The ideal behaviour (which we observed in chrome) is that the content should be rendered progressively. Implying that the 100 characters before the .sleep() should be rendered immediately. This should be followed by a gap of 3 seconds, and then the rest of the characters are displayed. You can see this behaviour where I reload the page:
https://drive.google.com/file/d/1JD_ZbghX3OOz_CpSR2iGn_Se7_2HDRTw/view?usp=sharing
The text "Before Sleep" followed by a line of 100 dashes is the content before .sleep() which appears immediately. The text “After Sleep” apears after a time of 3 seconds which is the desired behaviour.
In safari however, all of the content appears at once after 3 seconds, instead of being rendered progressively as seen here when I reload the page :
https://drive.google.com/file/d/1RiD7eFuwGYL5lGIcU1CF2gcpoSysHJ9C/view?usp=sharing
However if we increase the number of characters emitted before the .sleep() to ~250 (256 to be exact) safari behaves similar to chrome and the content appears progressively. You can see this here on page reload :
https://drive.google.com/file/d/1JlHFbZPdFuIiaAlkgYCWo61amBIysKL1/view?usp=sharing
We found this value of ~250 experimentally via hit and trial.
Not only rendering, we also found this delaying the execution of external .js (that is present in a separate .js file embedded via tag). To prove this, I added a simple console.log(performance.now()) at the top of the .js file (outside of any function).
In safari with artificially inserted ~260 extra bytes this log was printed at ~1 - 1.5 secs. However without the extra bytes this log came at ~3 - 4 seconds. This gap corresponds to the time taken to make rest of the page ready. Note that embedded .js present in the HTML was not affected by this.
Wondering if other’s have faced the same problem and if there's an official doc stating this limit / any workarounds.
Python HTTP Server code that we executed for our experiment
from http.server import BaseHTTPRequestHandler, HTTPServer
import time
import sys
class handler(BaseHTTPRequestHandler):
def do_GET(self):
self.send_response(200)
self.send_header('Content-type','text/html')
self.end_headers()
self.flush_headers()
# Content before .sleep()
message = f' <!DOCTYPE html> \
<html lang="en"> \
<head> \
<meta charset="UTF-8"> \
<title></title> \
</head> \
<body> \
'
self.wfile.write(bytes(message, "utf8"))
self.wfile.flush()
beforeSleep = 'Before Sleep'
self.wfile.write(bytes(beforeSleep, "utf8"))
self.wfile.flush()
lineBreak = '<br/>'
self.wfile.write(bytes(lineBreak, "utf8"))
self.wfile.flush()
blankChar = "-"
fillerString = "";
for x in range(260):
fillerString = fillerString + blankChar
self.wfile.write(bytes(fillerString, "utf8"))
# Sleep for 3 seconds
time.sleep(3)
self.wfile.write(bytes(lineBreak, "utf8"))
self.wfile.flush()
# Content after .sleep() which should be rendered progressively
afterSleep = "After Sleep"
self.wfile.write(bytes(afterSleep, "utf8"))
self.wfile.flush()
with HTTPServer(('', 8000), handler) as server:
server.serve_forever()```