Explore the integration of web technologies within your app. Discuss building web-based apps, leveraging Safari functionalities, and integrating with web services.

All subtopics
Posts under Safari & Web topic

Post

Replies

Boosts

Views

Activity

Issue sending web push notification to iOS
Hello all, I'm building a web application in ASP.NET MVC (.NET Framework 4.7.2), from this web app I need to send push notifications to users. For the ones who are logged in with windows/android, everything works as expected, but I can't manage to get it work on the apple side. If I use the same methods to subscribe to push notifications, it shows me the popup that asks the user to enable push notifications, and then I get an endpoint like this: https://web.push.apple.com/QKC1Muic0H7... It doesn't work using this (taking the part after https://web.push.apple.com/), I keep getting "Bad device token" (trying to send the notification via APNS). Then I found out that there is another method to register the device from the frontend, and this one should give me the real device token: window.safari.pushNotification.requestPermission But this one doesn't show me the popup, it gives me "denied" without a reason. I'm trying to a test application which is here https://pwa.vctplanner.it, the web push id is web.it.vctplanner, I created a push package downloadable from POST https://pwa.vctplanner.it/api/v2/PushPackages/web.it.vctplanner, and the code from the frontend is this: function registerSafariPush() { // Controlla se Safari Push Notifications è disponibile if (!('safari' in window) || !('pushNotification' in window.safari)) { console.log("Safari Push Notifications non supportate su questo browser."); return; } // Il tuo Website Push ID registrato su Apple Developer var websitePushId = "web.it.vctplanner"; // Controlla lo stato della permission var permissionData = window.safari.pushNotification.permission(websitePushId); switch (permissionData.permission) { case 'default': // L'utente non ha ancora deciso window.safari.pushNotification.requestPermission( 'https://pwa.vctplanner.it', // URL del server che serve il Push Package websitePushId, {}, // dati opzionali da inviare al server function (permission) { if (permission.permission === 'granted') { console.log("Notifiche push abilitate!"); sendSubscriptionToServer({ endpoint: permission.deviceToken }); } else { console.log("Notifiche push non abilitate dall'utente."); } } ); break; case 'denied': // L'utente ha negato console.log("Notifiche push negate."); break; case 'granted': // L'utente ha già autorizzato console.log("Notifiche push già autorizzate."); sendSubscriptionToServer({ endpoint: permissionData.deviceToken }); break; } } Any suggestions of what I'm missing? Is there a complete guide to how generate the push package? Thank you
0
0
277
Sep ’25
iOS26 Safari private mode blocking our page code from reading inputs
With most recent Safari update, our page started having some of it's core functionality broken while users access it on Private mode due to Fingerprinting protection. The issue is that the code that breaks is our first-party code and I want understand why it is breaking and how to properly fix it. One thing we discovered was that a service of ours that uses the same code base doesn't have these issues and current assumption is that their page bundles are served on the same domain as the actual page request, while ours is coming from a different one. The other assumption was that the domain which we use for serving the bundles of the page are set on the domain that is flagged as tracking domain. Is there some documentation on how Safari decides which code is allowed reading user inputs and which isn't and what is the appropriate approach to fix this issue as it would be possible that these changes get release as default in the future?
Topic: Safari & Web SubTopic: General
0
0
167
Oct ’25
In Safari's JavaScript geolocation, is altitude based on MSL or WGS84 ellipsoid?
Hello all, I'm trying to retrieve geolocation data on the web, but I'm having trouble with the altitude value, which seems to differ from what I get on Android. When using navigator.geolocation.getCurrentPosition in Safari, is the altitude value based on mean sea level, or is it ellipsoidal altitude based on the WGS84 ellipsoid? altitude (WebKit JS): https://developer.apple.com/documentation/webkitjs/coordinates/1631861-altitude altitude (Core Location): https://developer.apple.com/documentation/corelocation/cllocation/altitude ellipsoidalAltitude (Core Location): https://developer.apple.com/documentation/corelocation/cllocation/ellipsoidalaltitude If anyone has any insight into this topic I would greatly appreciate it!
0
0
73
Jun ’25
Mailto href is not working in iOS 18.3.2
Hi Team, I'm using the simple mailto functionality in the demo page and when I tested the same via Safari mailto functionality is not working. However, the same feature is working as expected via Chrome. Demo: https://jsfiddle.net/xut0ed4y/ Kindly help.me to resolve this issue.
Topic: Safari & Web SubTopic: General Tags:
0
0
280
Mar ’25
WebXR Consent Dialog
Based on the "Build immersive web experiences with WebXR"-Video for visionOS there is no way to disable the consent prompts for entering an immersive experience or consent hand-tracking. For the microphone it's possible to "greenlight" specific websites for mic input, which works great. I'd welcome it, if it were possible to add specific websites in the settings, in which those consent dialogs aren't shown each time. In my opinion, the user interaction through a button that launches the experience would be sufficient to not disorient.
0
1
109
Jun ’25
Do page img-src CSPs apply to Safari WebExtension content scripts injected HTML img tag?
I am currently developing a Chrome, Firefox and Safari web extension, and I am facing a CSP issue on the content script on Safari. The extension I develop has a content script that injects an img tag in the DOM of web pages the user is visiting. That img tag fetches its content at a specific URL. On Chrome and on Firefox, the img tag content fetches the content at the URL with no issue on every web pages, including those that set the CSP header img-src. On Safari, I'm getting the following error on web sites that set the img-src CSP header: Refused to load https://axxlfrmnpq.cloudimg.io/www.macifavantages.fr/wp-content/uploads/2021/06/Garmin-logo.png?func=bound&w=225&h=113 because it does not appear in the img-src directive of the Content Security Policy. Here is the actual CSP img-src header content of the web page where, on Safari, the injected img tag does not load the content at https://axxlfrmnpq.cloudimg.io/www.macifavantages.fr/wp-content/uploads/2021/06/Garmin-logo.png?func=bound&w=225&h=113: Content-Security-Policy: img-src https://secure.adnxs.com https://www.facebook.com https://.garmin.cn 'self' data: .garmin.com .trustarc.com .truste.com https://static.garmincdn.com https://www.google.com https://www.google.co.uk https://prefmgr-cookie.truste-svc.net https://res.cloudinary.com https://res.garmin.com https://.criteo.com https://.doubleclick.net https://www.googleadservices.com https://px.adentifi.com https://rtb.adentifi.com https://.teads.tv https://www.googletagmanager.com https://bat.bing.com https://.yahoo.com https://sync.outbrain.com https://*.google-analytics.com https://stats.g.doubleclick.net https://static.hotjar.com https://script.hotjar.com .akamaihd.net https://.tealiumiq.com https://deploytealium.com https://pixel.mediaiqdigital.com; My question is, is the page CSP blocking the img tag injected in the web page by the extension's content script? If so, is this behavior documented somewhere, or is it a Safari bug? I saw there is a similar post on the forum, but I couldn't find if the issue is a bug or if it's the expected behavior on Safari: https://developer.apple.com/forums/thread/651542?login=true. Thank you very much for your help.
0
0
586
Feb ’25
DNR Redirect Rule Won’t Redirect to Extension Path
DNR rules redirecting to an extension path lead to an error page: “Safari can’t open the page. The error is: “The operation couldn’t be completed. (NSURLErrorDomain error -1008.)” (NSURLErrorDomain:-1,008).” Here is a demo extension that replicates the bug: https://github.com/lenacohen/Safari-Test-Extensions/tree/main/dnr-extension-path-redirect This is an example of a redirect rule that leads to an error page instead of the extension path page: chrome.declarativeNetRequest.updateDynamicRules({addRules: [ { id: 2, priority: 1, action: { type: "redirect", redirect: { extensionPath: "/web_accessible_resources/test_redirect.html" } }, condition: { urlFilter: "||washingtonpost.com^", resourceTypes: [ "main_frame" ] } } ]}); The extension path is included in web_accessible_resources in the extension manifest: "web_accessible_resources": [{ "resources": [ "web_accessible_resources/test_redirect.html" ], I also submitted a bug report on Apple's Feedback Assistant: FB16607632
0
1
531
Feb ’25
Safari Web Extension service_worker failed to load
I built and extension for chrome, edge, and firefox. I'm porting the chrome extension to safari using the safari-web-extension-converter tool. This has worked successfully and I was able to publish my extension to the app store. I made some updates to the service worker code recently and I'm now being hit with an error when trying to load my unsigned extension into safari: The service_worker script failed to load due to an error. I've looked online at some other forums and haven't found anything helpful around how to debug this kind of error. Because the service worker is non-persistent in safari, I don't have access to the console logs of the service worker through the Develop > Web Extension Background Context menu. Has anyone successfully debugged this kind of error? Are there logs I can pull directly from safari that would help me here? Thanks in advance for the help!
0
0
322
Feb ’25
(iOS 26 / WebKit): Fixed-position header misaligned after keyboard interaction and interactive swipe-back in WKWebView
Steps to Reproduce 1. Create a native UIViewController with a WKWebView, loading test-1.html (contains position:fixed header that displays correctly). 2. Push another UIViewController also with a WKWebView, this time loading test-2.html. 3. In test-2.html, tap into the to summon the on-screen keyboard. 4. Without calling blur(), perform an interactive swipe-back gesture to go back to the first view controller. 5. Observe that the fixed header in test-1.html is now offset downward by approximately the height of the keyboard and does not return to its original position. demo-link : https://bugs.webkit.org/attachment.cgi?id=476324
Topic: Safari & Web SubTopic: General Tags:
0
3
469
Aug ’25
Notification sound (Web or PWA)
Good morning fellow developers, For a while i am struggeling with providing sound to my users on IOS (Safari on Mac is no problem and every other device is not a problem) (we have an existing phone system and made a chat as well), the case is very simple: the notification sound is only for users who are logged in and online for chat. i have tried multiple things: Audio play with javascript (start with mute, play when user clicks a button so the sound is familiar, play when user clicks a button and directly pause it and continue when needed) PWA: the dashboard has been made available as pwa and notifications using google firebase. The popup does show for notifcations to be allowed (and receiving the notifications does work on any other device) But any IOS device cannot register. The information i find is that notifications were supported with 16.4 or higher but also have been deprecated around IOS 17, auto play is not allowed. We have an app in development for our product as well were we will have a notification which will handle this, but that is not the solution we can use now. Long story, short question: is it still somehow possible to push a notification to the user when using the PWA or play a sound in the browser (based on an ajax function). The app/website wont be in the background, so it will always be on the screen. Languages we use: html/javascript (mostly vanilla)/php
0
0
111
Mar ’25
Inquiry Regarding Unsubscribe Flow for Recurring Payment Processing
We would like to confirm the unsubscribe flow related to recurring payment processing. When a user unsubscribes, does your system send any notification to us? If no notification is provided, we will not be able to detect the unsubscribe event and will continue to send recurring payment requests to the gateway periodically. Would this cause any issues? We would appreciate it if you could share the specific unsubscribe flow with us. Thank you in advance for your support.
0
0
59
Aug ’25
Embedded Power BI reports crashes in mobile layout using iOS
We're embedding the Power BI reports into our portal by using JS library. While testing them, we found that mobile layout of the reports don't work as we expect on iOS devices (tested in Chrome and Safari). There are two principals issues: 1) the site is automatically refreshed when the users filter the data (we reduced them to lower expression) and 2) the site also crashes after a while using the dashboard by applying different filters.
0
0
70
Mar ’25
Suggestions for OAuth2 in Swift
Hello! I have a few questions about integrating an OAuth2 API into my Swift application. I am using this API to access user data from the website (users will authenticate themselves within the app). I have seen other apps use this API in the way that I am describing it so I know that it is possible. However, I am not sure how to implement it. Are there any recommended ways to use an OAuth2 API in my application? The API that I am using does not specifically say that it supports PKCE. However, I have heard from some sources that it does. If it does not support PKCE, how do I still create a secure app infrastructure that will pass App Store Review? At a more basic level, what is the difference between OAuth2 and PKCE? What should I use in my app? Are there any resources to learn a little bit more about these protocols so that I understand them better? Thanks!
0
0
76
Jun ’25
WebKit https post return html use javascript send WebSocket Request
In my application, I use HTML pages to display the interface. Since it’s a cross-platform app, the pages and interactions work properly on other platforms. However, in WebKit, because HTTPS protocol is used, JS requests from the page cannot use the ws protocol but must use the wss protocol under HTTPS. Is there any way to allow a webpage under HTTPS to use ws requests normally? Google Chrome can do this.
Topic: Safari & Web SubTopic: General
0
0
97
Jun ’25
Embed issue
When we embed some of the youtube videos are unable to load in the Mobile app but at the same time it works in Website. I need to allow it in both places. I have tried both embed and native sdk for youtube in iOS.
0
0
483
Jul ’25
When loading a .webarchive in WKWebView does it handle local storage differently in iOS 18?
I have multiple web views of the same domain that share the same local storage, as expected. One of them though, is loading a .webarchive file. The web archive is of the same domain, and is loaded using the same base URL. For some reason, in most cases, the local storage is not shared with this web view when loading the web archive, although if I make that same web view load the actual live web page it does share local storage. I say in most cases, because for some users it works as expected, but for a significant portion of users it isn't sharing local storage. I think that the main difference between working and not is iOS version. iOS 17 seems to be able to share the local storage but iOS 18 does not. I can't find anything related in the release notes of iOS 18 versions. There is nothing in the documentation for load(_:mimeType:characterEncodingName:baseURL:), or the header file, that explains anything specific about local storage and webarchive loading. Does anyone know for sure how local storage is handled when a webarchive is loaded into a web view, and did something change with iOS 18 in regards to this?
0
0
119
Apr ’25
SFSafariApplication doesn't transmitt messages to docked website.
Hi! I'm working on a web extension for Safari and I need to send messages from the containing application to JavaScript. For this I use the method class func dispatchMessage( withName messageName: String, toExtensionWithIdentifier identifier: String, userInfo: [String : Any]? = nil ) async throws of the SFSafariApplication class. If the site is opened in Safari in normal mode, everything works as expected. However, if the site is "docked", the messages are not transmitted to this "Web App".
0
0
89
May ’25
Cookie Missing After App Upgrade During OAuth Consent Flow on iOS (Safari ITP?)
Scenario Overview: In our app, we open an in-app browser to complete a third-party consent flow. The sequence is: App → Website A (set cookie and redirect) → Google → Website A (check cookie) → App After upgrading the app, the first consent attempt fails because the cookie cannot be written, causing the check cookie step to fail. However, if we use the native Safari browser, this issue does not occur. Observed Behavior: Scenario Result Upgrade app → Consent ❌ Fail Upgrade app → Consent fail → Consent again immediately ✅ Pass Upgrade app → Consent fail → Upgrade again after 1–2h → Consent ✅ Pass Upgrade app → Consent fail → Upgrade again after 1d → Consent ❌ Fail Install a new app → Consent ✅ Pass Upgrade app → Consent, cancel flow → Consent again ✅ Pass Install new app → Wait for upgrade → Upgrade app → Consent ✅ Pass Install new app → Wait 1–2h → Upgrade app → Consent ✅ Pass Investigation: From Safari documentation, this seems related to Intelligent Tracking Prevention (ITP), which restricts cross-site cookie behavior during first-party interactions. However, I haven’t found a clear mitigation strategy yet. Question: Has anyone encountered similar issues with Safari ITP after app upgrades? Are there recommended approaches to ensure cookies persist across this redirect flow?
Topic: Safari & Web SubTopic: General
0
0
62
3w
The top of the body pages on my website is cut off on ios
Hello, When I view my website (lasaluade) on iphone or ipad the top of my page bodies are cut off (3-4 first lines). However, on PC, Mac or Android everything is OK (see screenshots). For the record, I built this site with Wordpress and Divi Builder, and I've the same result on Safari and Chrome. Not being a developer, I don't know where to look (I just think it's iOS-related). Have you already had this problem? Do you have any ideas? Thanks for your help!
Topic: Safari & Web SubTopic: General
0
0
36
Apr ’25