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

General Documentation

Post

Replies

Boosts

Views

Activity

In iOS 18, browser.tabs.getSelected returns 'Undefined' for the Safari iOS App Extension
I was able to obtain the URL in iOS 17+ and lower versions by using the browser.tabs.getSelected method in background.js, and it was successful. I upgraded to iOS 18 and now this function is returning 'Undefined'. As a result, the Safari Extension feature is broken. Is this browser.tabs.getSelected no longer available or deprecated as of iOS 18? As an alternative, browser.tabs.query functions. is a useful substitute for that.
3
0
496
Aug ’24
Flutter Webview permission issues
nw_application_id_create_self NECP_CLIENT_ACTION_GET_SIGNED_CLIENT_ID [80: Authentication error] Failed to resolve host network app id Invalidating grant <invalid NS/CF object> failed The above rights issue comes up NSAppTransportSecurity NSAllowsArbitraryLoads This authority has already been set up
0
1
576
Aug ’24
Inconsistent Memory Management in Safari on iPhone 12 Pro
We have tested on iPhone 12 Pro and observed that Safari allowed approximately 1.5GB of RAM usage. Page refreshes when trying to allocate more memory. After performing a hard reset and erasing all content, I noticed that Safari allowed approximately 3GB of RAM usage for our webpage. However, after 2-3 days, the maximum allowable RAM usage in Safari decreases to about 1.5GB. Once 1.5GB limit is reached, the system reloads the page. To further investigate, I performed another hard reset on my device, and once again, Safari allowed around 3GB of RAM usage. Additionally, we tested this on iPhone 15 Pro and 15 Pro Max, where the RAM limitation in Safari is consistently around 3GB (page is reloading after reaching 3GB). Could you please clarify why the memory limit fluctuates after hard reset? Is there any specific setting or flag within Safari or iPhone that controls the maximum RAM usage, which could be causing this behavior? I also posted the issue there: https://bugs.webkit.org/show_bug.cgi?id=277848 I would appreciate any guidance or potential solutions to this issue. If this is a known limitation or issue, understanding the root cause would be extremely helpful. Thank you for your attention to this matter. Model Name: iPhone 12 Pro iOS Version: 17.5.1 Capacity: 128gb
1
1
219
Aug ’24
Safari only browser to block GET requests to our dockerized web application
Hi, We are running a React application as a pod on a Kubernetes cluster with an Nginx Ingress, which needs to make requests to a server running Apache. On Safari only (all other browsers are fine) and on all browsers on iOS, the React application is unable to get a response from the Apache server. We can see the server is responding and we can see the pod is getting the responses too, they are all logged as 200 on both sides. Here is what we are able to see in the developer tools on Safari: The also console logs "Failed to load resource: The network connection was lost." We have tried solutions such as this and this, as well as many other solutions we could find on various forums but nothing worked so far. I repeat myself here: this only happens on Safari on desktop and on all browsers on iOS, other browsers such as Chrome and Firefox are unaffected. Has anyone ever ran into a similar issue or have an idea about how to fix this?
0
1
286
Aug ’24
Needed: Apple Sign-In JWT Not Returning Email for Users Except Using My AppleID
Hi everyone, I've been working on integrating Apple Sign-In with my web app and have hit a roadblock that I can't seem to resolve. I've successfully set up an Nginx reverse-proxy for development purposes enabling SSL/TLS to provide HTTPS. I have configured everything using the values from the Apple Developer Console, including identifiers, keys, and IDs. The sign-in flow works perfectly when I use my Apple ID (which is linked to my developer account). The Apple Sign-In REST API returns a JWT with my email, as expected. However, when other users sign in with their Apple IDs, the returned JWT doesn't include their email addresses. I am aware that Apple only provides the email on the first sign-in, but this doesn't seem to be the issue here. Below is the relevant code I'm using (Bun.js, Elysia, Arctic): import Bun from 'bun'; import { Apple, type AppleCredentials, type AppleTokens } from 'arctic'; import type { BaseAuthAccountInfo } from './type'; import { createPrivateKey } from 'crypto'; import { sign, decode } from 'jsonwebtoken'; const { APPLE_CLIENT_ID, APPLE_TEAM_ID, APPLE_KEY_ID, APPLE_CLIENT_SECRET, APPLE_CLIENT_SECRET_JWT, } = Bun.env; type AppleReponseJWTPayload = { iss: string; aud: string; exp: number; iat: number; sub: string; at_hash: string; email: string; email_verified: boolean; auth_time: number; nonce_supported: boolean; }; const credentials: AppleCredentials = { clientId: APPLE_CLIENT_ID!, teamId: APPLE_TEAM_ID!, keyId: APPLE_KEY_ID!, certificate: `-----BEGIN PRIVATE KEY-----\n${APPLE_CLIENT_SECRET}\n-----END PRIVATE KEY-----`, }; const apple = new Apple(credentials, 'https://intellioptima.com/api/v1/aus/auth/apple/callback'); const appleAuthUrl = async (state: string) => { const appleUrl = await apple.createAuthorizationURL(state); appleUrl.searchParams.set('response_mode', 'form_post'); appleUrl.searchParams.set('scope', 'email'); return appleUrl; }; const getAppleTokens = async (code: string) => { console.log('Authorization code:', code); const appleResponse = await apple.validateAuthorizationCode(code); console.log('Apple Response:', appleResponse); return appleResponse; }; const getAppleAccount = async (tokens: AppleTokens): Promise<BaseAuthAccountInfo> => { const token = generateJWTApple(); const response = await fetch('https://appleid.apple.com/auth/token', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded', }, body: new URLSearchParams({ client_id: credentials.clientId, client_secret: token, grant_type: 'refresh_token', refresh_token: tokens.refreshToken!, }).toString(), }); if (!response.ok) { throw new Error('Failed to fetch user info'); } const appleResponse = await response.json(); console.log('APPLE_RESPONSE', appleResponse); const decodedUser = decode(appleResponse.id_token) as AppleReponseJWTPayload; if (!decodedUser || !decodedUser.email) { throw new Error('The user does not have an email address.'); } return { id: decodedUser.sub as string, username: decodedUser.email.split('@')[0], email: decodedUser.email!, name: decodedUser.email.split('@')[0], emailVerified: decodedUser.email_verified ?? false, iconUrl: `https://robohash.org/${decodedUser.email.split('@')[0]}.png`, }; }; function generateJWTApple() { const MINUTE = 60; const HOUR = 60 * MINUTE; const DAY = 24 * HOUR; const MONTH = 30 * DAY; const tokenKey = `-----BEGIN PRIVATE KEY-----\n${APPLE_CLIENT_SECRET_JWT!.replace(/\\n/g, '\n')}\n-----END PRIVATE KEY-----`; const privateKey = createPrivateKey(tokenKey); const now = Math.ceil(Date.now() / 1000); const expires = now + MONTH * 3; const claims = { iss: APPLE_TEAM_ID, iat: now, exp: expires, aud: 'https://appleid.apple.com', sub: 'com.intellioptima.aichat', }; return sign(claims, privateKey, { header: { kid: APPLE_KEY_ID, alg: 'ES256', }, }); } export { apple, appleAuthUrl, getAppleAccount, getAppleTokens }; I would greatly appreciate any insights or suggestions on what might be going wrong. I'm at a loss, and any help would be invaluable! Thanks in advance! <3333
1
0
362
Aug ’24
ios17 remember full screen status and playsinline not working
I encountered an issue when playing WebRTC video using the H5 video tag on an iPhone with iOS 17. After performing the following operations, the video automatically plays in fullscreen mode: Create the video tag, specify the playback source, and set the autoplay attribute to true. Call the API to enter fullscreen playback mode. Exit fullscreen by swiping with a finger. Stop playback and destroy the video tag. Repeat step 1; at this point, the video does not correctly default to inline playback but instead automatically plays in fullscreen. It seems as if the system has cached the previous fullscreen state, even though I have exited fullscreen, and the same result occurs with different browsers. I have set the 'playsinline' and 'webkit-playsinline' attributes for the video tag. Anyone encountered the same issue? I would appreciate any solutions that can be shared.
0
0
233
Aug ’24
Sign in with Apple for webapp
Please someone help me.... I have been struggling for quite a while now configuring everything for the flow of using Apple SSI for my web app. I have finally managed to configure a nginx reverse-proxy for development experience. Creating and working correctly with all the values from Apple Developer Console which involves the identifiers, keys and Id's. My issue is now, that everything works for my signin flow. SO when I sign in using my AppleID which is also connected to the developer account I get signed in and Apple signin RESTAPI returns a JWT with my email. But when everyone else signs in with their AppleID's the returned JWT doesn't have the emails. And I know that Apple only gives the email first time user signs in - but that's is not the issue. Here is my code (using bun.js, Elysia, Arctic): import Bun from 'bun'; import { Apple, type AppleCredentials, type AppleTokens } from 'arctic'; import type { BaseAuthAccountInfo } from './type'; import { createPrivateKey } from 'crypto'; import { sign, decode } from 'jsonwebtoken'; const { APPLE_CLIENT_ID, APPLE_TEAM_ID, APPLE_KEY_ID, APPLE_CLIENT_SECRET, APPLE_CLIENT_SECRET_JWT, } = Bun.env; type AppleReponseJWTPayload = { iss: string; aud: string; exp: number; iat: number; sub: string; at_hash: string; email: string; email_verified: boolean; auth_time: number; nonce_supported: boolean; }; const credentials: AppleCredentials = { clientId: APPLE_CLIENT_ID!, teamId: APPLE_TEAM_ID!, keyId: APPLE_KEY_ID!, certificate: -----BEGIN PRIVATE KEY-----\n${APPLE_CLIENT_SECRET}\n-----END PRIVATE KEY-----, }; const apple = new Apple(credentials, 'https://intellioptima.com/api/v1/aus/auth/apple/callback'); const appleAuthUrl = async (state: string) => { const appleUrl = await apple.createAuthorizationURL(state); appleUrl.searchParams.set('response_mode', 'form_post'); appleUrl.searchParams.set('scope', 'email'); return appleUrl; }; const getAppleTokens = async (code: string) => { console.log('Authorization code:', code); const appleResponse = await apple.validateAuthorizationCode(code); console.log('Apple Response:', appleResponse); return appleResponse; }; const getAppleAccount = async (tokens: AppleTokens): Promise => { const token = generateJWTApple(); const response = await fetch('https://appleid.apple.com/auth/token', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded', }, body: new URLSearchParams({ client_id: credentials.clientId, client_secret: token, grant_type: 'refresh_token', refresh_token: tokens.refreshToken!, }).toString(), }); if (!response.ok) { throw new Error('Failed to fetch user info'); } const appleResponse = await response.json(); console.log('APPLE_RESPONSE', appleResponse); const decodedUser = decode(appleResponse.id_token) as AppleReponseJWTPayload; if (!decodedUser || !decodedUser.email) { throw new Error('The user does not have an email address.'); } return { id: decodedUser.sub as string, username: decodedUser.email.split('@')[0], email: decodedUser.email!, name: decodedUser.email.split('@')[0], emailVerified: decodedUser.email_verified ?? false, iconUrl: `https://robohash.org/${decodedUser.email.split('@')[0]}.png`, }; }; function generateJWTApple() { const MINUTE = 60; const HOUR = 60 * MINUTE; const DAY = 24 * HOUR; const MONTH = 30 * DAY; const tokenKey = `-----BEGIN PRIVATE KEY-----\n${APPLE_CLIENT_SECRET_JWT!.replace(/\\n/g, '\n')}\n-----END PRIVATE KEY-----`; const privateKey = createPrivateKey(tokenKey); const now = Math.ceil(Date.now() / 1000); const expires = now + MONTH * 3; const claims = { iss: APPLE_TEAM_ID, iat: now, exp: expires, aud: 'https://appleid.apple.com', sub: 'com.intellioptima.aichat', }; return sign(claims, privateKey, { header: { kid: APPLE_KEY_ID, alg: 'ES256', }, }); } export { apple, appleAuthUrl, getAppleAccount, getAppleTokens }; What could be the issue??? I really hope someone out there can provide me with some details on what is going on <33333
1
0
269
Aug ’24
How can I create a long lasting cookie in Safari?
I have a tipical web app setup where a front end SPA app (Blazor WASM) is communicating with a backend (.NET API). I control both environments and they are hosted at following locations: SPA: https://www.client-portal.company.com API: https://www.api.client-portal.company.com I use cookie authentication to authenticate users via the invite/confirmation code process. The problem is that I want to make a long lasting authentication cookie but Safari (and ONLY Safari) keeps setting the cookie to expire in 7 days. Now I am aware of the Webkit's tracking prevention policies defined here: https://webkit.org/tracking-prevention/#intelligent-tracking-prevention-itp However I'm either unable, or not smart enough to understand the first vs. second vs. third party logic defined there. In my head, the setup I have is the first party setup and I would imagine that many companies have a similar hosting setup/naming. I cannot place the API under the same URL as the front end app unless I do some reverse proxy YARP setup which seems like an overkill just to satisfy the policy of one browser. Am I missing something obvious here? Can you please tell me how/where/what URL should I host my SPA/API in order for the cookie to persist beyond 7 days? For the reference the cookie being created has the following properties: DOMAIN: client-portal.company.com HOSTONLY: true SECURE: true HTTPONLY: true SAMESITE: Strict PATH: / Any help would be greatly appreciated. Thanks!
0
0
163
Aug ’24
Looking for feedback on a Swift dev tool idea
I know this is a more abnormal question to ask on this forum but I really would like to gauge feedback from a community of other Swift developers on an idea. A colleague and I are seriously considering building a open-source web based SwiftUI component catalog that feature a collection of prebuilt modular components very similar to Shadcn for those of you who have worked in React but for SwiftUI where you can also contribute your own SwiftUI elements. Im curious if this would be something iOS/Swift devs would be possibly interested in and would love to hear thoughts on this idea. This is not a component library as Xcode technically has one thats built in, but rather fully built out SwiftUI elements such as UIs that use glass morphism for macOS, calendars for iOS apps, charts, etc.
1
0
302
Aug ’24
Certain Docusign Url does not load on IOS 17.5.1 but works on 17.4.1
Hello, We are seeing a behavior where we find that a certain Url (docusign signing ceremony which is a webpage) works fine on Ipad with OS version 17.4.1 but NOT on Ipads with 17.5.1. This behavior is exactly same if I use chrome browser, safari browser or our custom application (Maui Application and we host the signing ceremony) I am not sure but since the OS is the difference here just wondering if there can be a potential issue here. or its still the cert issue from the provider. NET::ERR_CERT_AUTHORITY_INVALID - is the error shown in Chrome and Safari shows "Safari can't open the page because it could n't establish a secure connection t the server".
0
0
232
Aug ’24
TLS encryption / certificate requirements for Safari
We've had no end of troubles using Safari with internal CAs for internal applications. Every other reasonably-modern browser works fine, but Safari gives us "Safari can't open the page because Safari can't establish a secure connection to the server ." I've not been able to find a list of the specific requirements that Safari has for allowing secure connections, and there doesn't seem to be a way to get a more useful error message out of Safari (does nobody believe in good error reporting anymore?). Our servers are compatible through TLS1.3 and support reasonably modern encryption suites. We do use long-lived certificates on internal hosts, but my understanding is that Safari should be accept this with private CAs (and some of these hosts have zero support for certificate automation, handling this manually would be an obscene amount of work, and if a threat actor can pull private keys off of them then they already have root and this isn't solving anything). Is this documented anywhere, and if so could somebody please be kind enough to point me in that direction?
0
0
142
Aug ’24
apple pay sheet shippingContact display issue
when i integrate apple pay to our website, i pass `ApplePayPaymentRequest ` like this: const paymentRequest = { countryCode, currencyCode, merchantCapabilities, supportedNetworks, total: { label: "Demo (Card is not charged)", amount: totalAmount, type: "final", }, requiredBillingContactFields: [ "postalAddress", ], requiredShippingContactFields: [ "postalAddress", ], shippingContact: { addressLines: ['402 Vinnie Brooks Suite 707'], administrativeArea: "NB", country: "Canada", countryCode: "CA", emailAddress: "qqq@qq.com", familyName: "gfhh", givenName: "dfg", locality: "W*********h", phoneNumber: "6******7", postalCode: "M*****4", }, }; but when apple pay sheet show, the shippingContact dispaly like this (it just show user name, not show the details): should i do what in order to display the details of the shippingContact, please help me. Thanks.
1
0
376
Aug ’24
iOS 18 - Webcam video not rendered within page without interacting with browser chrome
We have a service providing identification services via video, i.e. users get on a WebRTC video call and follow some instructions, all the while seeing themselves full screen. So this web site displays the user's camera full screen with a few overlays. In iOS 18 beta, this stopped working; the video isn't rendered anymore. The remote end of the conversation can see the video fine, so the camera itself and WebRTC are working. No errors in the console. When tapping the site settings button in the address bar and the font size/reader/translate page dialog pops up, now suddenly the video is being rendered just fine, immediately. It suggests it was there the entire time, Safari just didn't bother actually showing it. It's hard to create a minimal reproducible example for this. The behaviour just suddenly changed starting with iOS 18 beta. Has anyone observed something similar or has any tricks which may enable a workaround?
0
0
337
Aug ’24
Authentication Services fail with "Found unsupported attestation type"
Hello, I am writing an AuthenticationService plugin to provide Passkeys to a web browser. The problem is that, after I call ASCredentialProviderExtensionContext.completeRegistrationRequestWithSelectedPasskeyCredential with the attestation object I composed, the operation fails and the MacOS system log contains the error com.apple.AuthenticationServices.Helper: (AuthenticationServices) [com.apple.AuthenticationServices:Authorization] Returned credential failed validation: Error Domain=com.apple.AuthenticationServices.AuthorizationError Code=1002 "Found unsupported attestation type." UserInfo={NSLocalizedFailureReason=Found unsupported attestation type.} Is there a way to find out what part of my attestation is triggering this error? P.S. the same code is able to generate a valid passkey on Windows platforms, so it's not completely broken Thanks, Alberto
1
0
347
Aug ’24
What is the behavior of text encode when OOM occurs
I have some questions about the behavior of encode. For example, with the following code, when we encode a very large string, the result is an empty array. So if memory allocation fails due to insufficient system memory or other reasons, and the returned Uint8Array is not successfully created, what will we get? An empty array, an exception, or an OOM crash? const encoder = new TextEncoder(); const encoded = encoder.encode(largeText);
0
0
243
Aug ’24