Hello, Team.
We used WKWebView for our project. We loaded the HTML file into the webview and added the following configuration.
weak var webView: WKWebView!
func configWebView() {
let webViewConfig = WKWebViewConfiguration()
let controller = WKUserContentController()
controller.add(self, name: "sometest")
webViewConfig.userContentController = controller
webViewConfig.processPool = WKProcessPool()
webViewConfig.setValue(true, forKey: "allowUniversalAccessFromFileURLs")
webViewConfig.mediaTypesRequiringUserActionForPlayback = []
let webpagePreferences = WKWebpagePreferences()
webpagePreferences.allowsContentJavaScript = true
webViewConfig.defaultWebpagePreferences = webpagePreferences
webViewConfig.websiteDataStore = WKWebsiteDataStore.default()
webView = WKWebView(frame: .zero, configuration: webViewConfig)
webView.navigationDelegate = self
webView.uiDelegate = self
webView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(webView)
NSLayoutConstraint.activate([
webView.topAnchor.constraint(equalTo: view.topAnchor),
webView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
webView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
webView.trailingAnchor.constraint(equalTo: view.trailingAnchor)
])
loadWebView()
}
func loadWebView() {
guard let documentsDirectoryURL = FileManager.default.urls(for: .documentDirectory, in: .userDomainMask).first else {
return
}
let contentFolderURL = documentsDirectoryURL.appendingPathComponent("content")
let assetFolderURL = contentFolderURL.appendingPathComponent(interactiveGUID)
if FileManager.default.fileExists(atPath: assetFolderURL.path) {
let documentsPath = NSSearchPathForDirectoriesInDomains(.documentDirectory, .userDomainMask, true).first!
let documentsURL = URL(fileURLWithPath: documentsPath)
let fileToLoadPath = (documentsPath as NSString).appendingPathComponent("content/index_p.html")
let fileURL = URL(fileURLWithPath: fileToLoadPath)
autoreleasepool {
DispatchQueue.main.async { [weak self] in
guard let self = self else { return }
self.webView.loadFileURL(fileURL, allowingReadAccessTo: documentsURL)
}
}
}
We are experiencing webview crashes when loading an HTML file. What happened when I loaded the video file? It automatically looped. Webview frequently crashes when the HTM/JS file is loaded.
When a webview crashes, the delegate method usually calls webViewWebContentProcessDidTerminate. This method calls webview.reload().
Also we are clear and cache/ deallocate eveything when i initialized those configuration mentioned as the above.
Can you suggest a solution to this? Why is webview crashing?
Thank you.
Explore the integration of web technologies within your app. Discuss building web-based apps, leveraging Safari functionalities, and integrating with web services.
Selecting any option will automatically load the page
Post
Replies
Boosts
Views
Activity
When a DNR rule is set for a specific URL and the request receives a server-side redirect (e.g., 302) to a different URL that does not match the urlFilter, the rule still seems to apply to the redirected request. We are using macOS 15.4 and Safari 18.4.
For example, consider two sequential calls: call1 and call2.
call1 triggers a 302 redirect to call2.
A DNR rule is created to add a "Cookie" header to call1 based on its URL.
Unexpectedly, the same cookie is also added to call2, even though call2's URL does not match the rule's urlFilter.
This results in the Set-Cookie response from call1 being ignored, and call2 receiving the manually set cookie instead—leading to incorrect behavior.
This issue doesn't occur in Chrome or Firefox, where the rule is not applied to the redirected request if the URL no longer matches.
We are looking for assistance in fixing these issues and having our Safari Extension function the same as it does in Firefox and Chrome.
I'm injecting some javascript into a WKWebview on iOS. At a certain point the web view spits out these warnings into the console and the javascript execution stops.
0x109018c40 - [PID=778] WebProcessProxy::gpuProcessExited: reason=IdleExit
0x109019200 - [PID=779] WebProcessProxy::gpuProcessExited: reason=IdleExit
Failed to terminate process: Error Domain=com.apple.extensionKit.errorDomain Code=18 "(null)" UserInfo={NSUnderlyingError=0x303c3c060 {Error Domain=RBSRequestErrorDomain Code=3 "No such process found" UserInfo={NSLocalizedFailureReason=No such process found}}}
I can't find any solution for this so am looking if anyone has any idea of what to try.
None of the WKWebview delegate functions trigger when this occurs so I can't attempt to reload the webview at this stage
We’re seeing an issue in our Safari Web Extension where not all cookies from the Set-Cookie response header are accessible. We are using macOS 15.4 and Safari 18.4.
In the webRequest.onHeadersReceived callback, the Set-Cookie header returned by Safari only includes some of the cookies set by the server. If multiple Set-Cookie headers are present, we seem to receive only a partial list, some cookies are missing entirely.
In Chrome and Firefox, the same callback provides all cookies set by the server without issue.
We are looking for assistance in fixing these issues and having our Safari Extension function the same as it does in Firefox and Chrome.
Hi, I am having issue with WebAssembly not able to load wasm file on Safari web extension.
It is showing CompileError: Refused to create a WebAssembly object because 'unsafe-eval' or 'wasm-unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval'".
It was working fine 2 month ago, my original CPS is "script-src 'self' 'unsafe-eval'". But now it is not accepting 'unsafe-eval', I also tried 'wasm-unsafe-eval' did not work.
Is there any changes on Safari browser regarding the CSP for WebAssenbly? Please let me know what CPS value will work.
Here is the example code on how I load the WebAssembly wasm file.
fetch('test_wasm_lib.wasm')
.then(response => {
if (!response.ok) throw new Error('Network response was not ok');
return response.arrayBuffer();
})
.then(bytes => WebAssembly.instantiate(bytes))
.then(results => {
// Use your WebAssembly instance here
console.log('load wasm success')
})
.catch(error => {
console.error('Error loading WASM:', error);
});
Need to connect HTTPS proxy (encrypt all data). If it is possible from iPhone or iPad through phone settings or special app?
Topic:
Safari & Web
SubTopic:
General
This screen time is ruining the battery and always goes to dead while I re open. Any idea how to resolve it?
Push Notification Issue in iOS PWA App
We’ve been trying to implement push notifications in our iOS app, which is a wrapper around a Vite PWA built using PWA Builder. Here's a detailed overview of the issues we’re facing:
Problem Summary
We originally had a working Vite PWA and used Firebase Cloud Messaging (FCM) for push notifications. When converting this PWA to an iOS app using PWA Builder:
The notification permission prompt did not behave as expected in Safari.
Even after requesting permission via a user gesture (e.g., button press), FCM token was not received.
On Safari (both Mac and Windows), permission sometimes works, but the token isn’t saved until Safari is closed and reopened.
In the iOS PWA app, the FCM token never gets retrieved.
We tried the same process on Chrome, and everything works flawlessly there.
What We’ve Tried
Wrapped the permission request and FCM token logic in a user gesture (e.g., button click), as recommended.
Confirmed our manifest includes all necessary fields (see below).
Tested across macOS, Windows, Safari (desktop), and the iOS app.
Manifest.json
{
"name": "Periscopio",
"short_name": "Periscopio",
"start_url": "/",
"display": "standalone",
"background_color": "#f2f2f2",
"lang": "en",
"scope": "/",
"description": "Facilitates the collection of primary data for market research purposes.",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "any"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
},
{
"src": "/maskable_icon_x192.png",
"sizes": "192x192",
"type": "image/png",
"purpose": "maskable"
},
{
"src": "/maskable_icon_x512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
],
"edge_side_panel": {
"preferred_width": 400
},
"display_override": [
"window-controls-overlay",
"standalone"
],
"theme_color": "#08244c",
"orientation": "portrait"
}
Core Logic (Plain TypeScript)
1. Request Notification Permission + FCM Token
async function handleRequestPermission(): Promise<string | null> {
try {
console.log("Requesting notification permission...");
const permission = await Notification.requestPermission();
console.log("Notification permission result:", permission);
if (permission === "denied") {
console.error("Notification permission was denied.");
return null;
}
const token = await requestFCMToken();
console.log("FCM Token:", token);
if (token) {
console.log("Notification setup successful.");
return token;
} else {
console.error("Failed to retrieve FCM token.");
return null;
}
} catch (error) {
console.error("Error requesting FCM token:", error);
return null;
}
}
2. FCM Token Logic
async function requestFCMToken(): Promise<string | undefined> {
try {
let permission = Notification.permission;
if (permission === "default") {
console.log("Requesting notification permission...");
permission = await Notification.requestPermission();
}
if (permission === "granted") {
console.log("Notification permission granted.");
const isSupportedBrowser = await isSupported();
if (!isSupportedBrowser) {
console.error("This browser does not support FCM.");
return;
}
const registration = await navigator.serviceWorker.register("/firebase-messaging-sw.js");
console.log("Service Worker registered:", registration);
const token = await getToken(cloudMessaging, {
vapidKey: "YOUR_PUBLIC_VAPID_KEY_HERE",
serviceWorkerRegistration: registration,
});
if (token) {
console.log("FCM Token:", token);
localStorage.setItem("fcmToken", token);
return token;
} else {
console.warn("No registration token available. Request permission to generate one.");
return;
}
} else if (permission === "denied") {
console.warn("Permission to notify was denied.");
return;
} else {
console.warn("Notification permission not granted.");
return;
}
} catch (error) {
console.error("Error getting FCM token:", error);
return;
}
}
Request for Help
We’d really appreciate support from anyone who’s successfully implemented FCM push notifications in a Vite PWA wrapped as an iOS app using PWA Builder.
Is there something we’re missing about how iOS Safari handles push permissions in PWA mode?
Could there be an issue with the service worker or the manifest setup that causes the token not to register?
Any Safari-specific quirks to be aware of?
Thanks in advance!
Topic:
Safari & Web
SubTopic:
General
JavascriptCore doesn't come with any support for setTimeout (which is an API on the window/DOM object not provide din JavaScriptCore). So you need to implement a version of this yourself - no worries on that (there are examples to refer to out there, so it is fairly easy to set this up).
But I have come across an issue with this that I am not sure how to handle properly. It relates to when the timer callback fires and runs code in the JavaScript engine itself.
Consider this code snippet (assume I have provided an implementation of setTimeout):
console.log('Hello - here we go');
setTimeout(() => {
console.log('Hi from setTimeout callback ...');
}, 0);
Promise.resolve().then(() => {
console.log('Hi from promise');
});
console.log('Hi from main block');
In Node.js or say Safari, I would see this output:
Hello - here we go
Hi from main block
Hi from promise
Hi from setTimeout callback ...
So the promise then() is handled before the settimeout callback is handled. I think this is basically because Promise then() handlers are pushed onto something like a microtask queue, and the setttimeout callbacks on a separate queue, and the microtask queue is emptied before any other queue is processed (after completing the current event loop of course).
But when I implement this in JavaScript core, I don't always see the above - instead I can have:
Hello - here we go
Hi from main block
Hi from setTimeout callback ...
Hi from promise
So the timeout callback can be run BEFORE the promise handler. This obviously is different from Node or Safari.
Now I assume that is because the timeout callback is triggered from Swift native code that uses the call() API on a JSValue object that is provided when the settimeout is given to the native layer to process. And it seems that when native code attempts to execute JavaScript code (via call() or similar) then this is just executed as soon as possible - obviously not interrupting the Javascript core when executing any current event loop code, but potentially running between the point when the Javascript core finishes a normal event loop cycle and then starts processing the queued promise handlers.
This means that code that runs nicely in Node (for example) might not work the same way due to this behaviour.
Also, I also notice another thing: if JavaScript code makes a call to a native-provided method (e.g. by calling the setTimeout I show above, which I implement via a native-side handler) then during that call from JavaScript, it is possible for the native side to execute a call() and run Javascript code it wants. Again this is not what would happen in Node or Safari: it is not possible for timeouts (or network completions) to interrupt any 'builtin' function call, but in JavascriptCore it certainly is (to get around this I set a flag on the JavaScript side indicating a native call is being made, and if any native-triggered callback occurs on the javascript side when this flag is set, I have to 'queue' it via a promise handler for execution AFTER the current event loop is complete).
Are these known issues with Javascript core and are there ways to get around them?
thanks
Hi,
when I display an HTML page with a on Safari iOS, I get a nice UI. Great! At the first look I see a video frame with an arrow-in-a-circle button in the middle. Very nice. I click on the arrow and I get a fullscreen view while the video begins to play. I watch the video then I pause it then I click on the top-left x button. So I go back to my html page and the video is perfectly there as it was before.
But, there is an annoying new detail. The video frame is really dark, it still presents all the controls and a "different" arrow button to play it again. In other words that nice video-frame, that nice picture, is not longer visible on the page. That nice page with nice pictures has now an almost-black rectangle. Too bad.
Sure I can click on the video (outside the controls) then the controls and the black overlaying frame disappear. I can see that nice picture again. Finally. Well, but the arrow-in-a-circle button to play the video disappeared. Now the user cannot longer understand that's a video to play. It looks just like any other pictures to admire statically.
Is any way to get the previous first look of the video? The one clear, with the current frame and the arrow-in-a-circle look?
Starting Safari 18, Declarative Net Request redirections are no longer working (it used to be working on Safari 17). It seems to be related to the regex validation that is not working as expected.
Here is an example of our DNR rule:
{
priority: 1,
action: {
type: 'redirect',
redirect: {
regexSubstitution: `${scheme}//${extensionHost}/index.html\\1#/\\2`,
},
},
condition: {
// app.dashlane.com, *.app.dashlane.com
regexFilter: '^https?://w*\\.?app\\.dashlane\\.com(\\??[^/#]*)[^#]*#?/?(.*)$',
resourceTypes: [
'main_frame'
],
},
}
Is it a known issue ?
Also, it seems to be related to this existing issue:
https://forums.developer.apple.com/forums/thread/763505
Doc URL: https://developer.apple.com/documentation/applepayontheweb/requesting-an-apple-pay-payment-session
How can I send a POST request using PHP, and what certificates are required?
Currently, I have downloaded the following files on the backend: merchant_id.cer, apple_pay.cer, and a local cert.p12 file
This my code:
But,run error:cURL Error: unable to set private key file: '***/private.pem' type PEM%
I'm porting a web extension from Chrome to Safari, and I need to execute a method as a content script that is part of an ES module (in particular its default export).
In Chrome I use following snippet (via Stack Overflow)
const results = await chrome.scripting.executeScript({
args: ["/js/content_script/main.js"],
func: async (path) => {
const src = chrome.runtime.getURL(path);
const { default: asyncMain } = await import(src);
return asyncMain();
}
});
In Safari this seems to either not work, cause the Web Extension Background Context window to close, or crash the browser.
Am I doing something wrong, or is this not possible?
Safari throw a ViewTransition error, called ' Unhandled Promise Rejection: AbortError: Old view transition aborted by new view transition.' however, i don't find how to catch it.
i used 'try..catch' or Promise.catch, or catch it in finished/ready/updateCallbackDone Promise. These all don't work.
Hi,
iOS 18.1 Safari 18 does not play HLS/.m3u8 audio tracks (while all previous iOS Safari still do).
If I turn on the Web Inspector toggle and put it on, restart Safari/ refresh the page, the player works.
Before filing a bug, are you already aware of such behavior or some way to deal with it?
I have a very specific issue that happens only on iOS Simulator version 18.4.
It does NOT happen when I run my app on a real iOS 18.4 device through Testflight.
My app displays a WebView (courtesy of Capacitor, url scheme capacitor://).
Inside that Webview I'm using Firebase JS API (11.2.0) and calling signInWithEmailAndPassword, which works well in all other contexts, i.e. browser, Android webview, iOS webview in all other Simulator versions, and on real devices.
Only when running in Simulator 18.4, I get a failed network request:
cannot parse response
Fetch API cannot load https://identitytoolkit.googleapis.com/v1/accounts:signInWithPassword?... due to access control checks.
Failed to load resource: cannot parse reponse
error: FirebaseError: (auth/network-request-failed)
Everything is working correctly for both:
Capacitor app webview installed on a real 18.4 device with Testflight
Safari (non-webview) in the 18.4 Simulator
The issue is severe for us, because we are unable to develop our app and test it in the simulator on 18.4 Simulator before pushing it through Testflight internal release.
Request headers on the failed request (no response status or headers available).
Request
Accept: /
Content-Type: application/json
Origin: capacitor://localhost
Sec-Fetch-Dest: empty
Sec-Fetch-Mode: cors
Sec-Fetch-Site: cross-site
User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 18_4 like Mac OS X) - AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148
X-Client-Version: Mobile/JsCore/11.2.0/FirebaseCore-web
X-Firebase-Client: (...)
I need to capture the HTTP logs triggered from Websheets on iPad to troubleshoot some production issues, I tried with USB option/Xcode but it is not capturing the HTTP logs. Enabled the developer Mode on ipad and the device is connecting to Mac. Appreciate immediate help on this.
Topic:
Safari & Web
SubTopic:
General
We are experiencing a problem that seems to be caused by a specification changes for Safari.
We would like to discuss how to solve this problem.
Sample JavaScript:
<html>
<head>
<script>
function jumpPage(code) {
document.main.code.value = code;
win1=window.open("","win1","toolbar=no,resizable=yes,menubar=no,scrollbars=yes,status=yes,left=0,top=0");
win1.resizeTo(width=screen.availWidth,height=screen.availHeight);
document.main.action="details";
document.main.target="win1";
document.main.submit();
}
</script>
</head>
<body>
<form name="main" method="post" action="" target="">
<a href="javascript:jumpPage('001')">details</a>
<input type="hidden" name="code" value="">
</body>
</html>
This JavaScript performs the following actions when a link is clicked.
Open a window using window.open in JavaScript
Submit the above opened window by post method to the target in JavaScript.
When this operation is performed, the process in (2) could submit to the
target page with “POST” method before iOS18.1, but
will transition to the page with“GET”method from iOS18.2 onward.
All protocols are http.
This problem does not occur if the URL is specified as an IP address, but it does occur if the host name is specified as.
Please let me know how to use with“POST”method as in iOS 18.2 or earlier.
Best regards,
Topic:
Safari & Web
SubTopic:
General
This is my first time to post on this forum. If there are something we didn't notice, please tell me. Thanks.
Background
We're using canvas to provide a web component to marketing.
https://demo.mescius.jp/spreadjs/BenchmarkSample/
Problem
Recently we have met an issue from customer. He is using iPad 10th to access the web component but when he tries to scroll it and it's very slow on iPad 10th. His iPad OS version is 17.7 and this issue also can be reproduced on our iPad 10th with iPad OS 18.0.1. But if we use iPad 9th with iPad OS 17.7 and 18.0.1, things are fine and there isn't any performance issue.
We developer took some time investigating and found it's because of iPad 10th's safari takes longer time to paint each frame. On iPad 9th, it needs nearly 10ms to paint each frame. But on iPad 10, it needs nearly 70ms to paint each frame.
Also we can provide simple code for you to check the different. We tried to simulate the repaint when user is scrolling. You can see on iPad 9th, it will be 2~3ms but on iPad 10th, it will be more than 10ms for each frame.
test-ipad10.html
It has been happening on iPad 10th only with iPad OS 17.6/17.7/18.0. This will be a big problem for us because it means on the iPad 10th (the latest iPad, non Pro or Air), it can't be used.
Question
Is there anyone knowing similar issue with this one? And do you know how to solve it on iPad 10?
Topic:
Safari & Web
SubTopic:
General
我使用Apple Pay on the Web Interactive Demo构建了一个web应用使用的是Payment Request API方式,但是遇到了几个问题:
拉起的web Apple Pay 底部一直转圈圈无法付款,这个是什么问题?
如何设置sandbox测试付款呢?
如何异步、同步获取支付结果(后端代码获取支付结果)?demo只有await response.complete("success");前端代码获取支付结果的操作
demo网址: https://shop.wowseer.com/rsolomakhin/pr/applepay/