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

ShieldActionDelegate uses a different webDomain than the one I shielded
I shield a web domain picked by users like this (discouragedSelections is an instance of FamilyActivitySelection() btw) : let webDomainTokens = discouragedSelections.webDomainTokens store.shield.webDomains = webDomainTokens The domain is correcly shielded and I can see the restricted screen when I access it via Safari. When I tap on the main button of that restricted view, I receive a different token than the one I got from .webDomainTokens from the code above. Why? override func handle(action: ShieldAction, for webDomain: WebDomainToken, completionHandler: @escaping (ShieldActionResponse) -> Void) { // webDomain here is different from the one in store.shield.webDomains }
2
1
373
Jul ’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
Apple Pay button not appearing
On an older iPhone I'm testing with (6s, iOS 12.5.7), connected to the same Sandbox Apple ID that I'm using on multiple other devices, the Apple Pay button is not appearing. Neither on my web application, whatever version I set in the PaymentRequest, nor on the official demo site. Further, 2 sandbox cards that were added fine to these other devices are failing to add on this one. Same cards and CVV codes are getting errors. At least "Invalid Card" on one of them. Although the other failed several times, then just worked this time when I tried it again :confused: But on this phone, I have two cards successfully added, so the button should be appearing. On the demo site, whether I select Apple Pay JS API or Payment Request API, the button does not appear.
1
0
406
Aug ’24
HTML input option datalist tag not working properly in IOS 17.4.1
If I set an input text box connected to a datalist-options, in order to suggest pre-coded values, this is what happens: The text field shows properly. When I start typing, one or more coincident "options" from the datalist are shown at the bottom of the available screen. When one option is selected, the data contained in it is NOT transcript to the input field. The same webtest works fine on Ipad mini w/ios 15. Try this simple code, it doesn't work: <label for="browser">Choose your browser from the list:</label> <input list="browsers" name="browser" id="browser"> <datalist id="browsers"> <option value="Edge"> <option value="Firefox"> <option value="Chrome"> <option value="Opera"> <option value="Safari"> </datalist>
3
3
1.1k
Apr ’24
Issue in the payment processing after the merchant validation
session.onvalidatemerchant = function(event) { const validationURL = event.validationURL; console.log("Validation URL:", validationURL); document.getElementById('methodapplepay').value = "validate"; document.getElementById('validationURL').value = validationURL; $.ajax({ url: 'ajax/processInternalDonate.php', type: 'POST', data: $("#payment_form").serialize(), success: function(dataValidate) { dataValidate = JSON.parse(dataValidate); session.completeMerchantValidation(dataValidate); }, error: function(xhr, status, error) { console.error('Merchant validation failed:', error); session.abort(); } }); }; session.onpaymentauthorized = function(event) { var payment = event.payment; $.ajax({ url: 'ajax/processInternalDonate.php', type: 'POST', data: {pay_mode:"pay_mode",method:"process_payment",payment:JSON.stringify(payment)}, success: function(dataprocess) { if (dataprocess.success) { session.completePayment(ApplePaySession.STATUS_SUCCESS); } else { session.completePayment(ApplePaySession.STATUS_FAILURE); } }, error: function(xhr, status, error) { console.error('Payment processing failed:', error); session.completePayment(ApplePaySession.STATUS_FAILURE); } }); }; from this above two session methods for the first method I got the merchant validation response from the API calling from that method but for the session.onpaymentauthorized when the second API is calling then I got the message payment not processed on my apple pay popup upon autorisation from my phone so I want that you provide me the correct backend flow for this API calling so we get the amount charged and I also got the payment object from event.object on logging in my console.
0
0
294
Aug ’24
Safari Extension load wasm file in popup wrong MIME type error
After loading Safari Web Extension, when making request from the popup to load wasm file it return with wrong MIME type, which makes the WebAssembly compileStreaming to reject the response from fetch. Summary URL: safari-web-extension://ECF91D91-37F4-499D-8D7E-6AA029A2DBED/canvaskit/canvaskit.wasm Status: 200 Source: — Initiator: flutter_bootstrap.js:10:505 Request Accept: / Referer: safari-web-extension://ECF91D91-37F4-499D-8D7E-6AA029A2DBED/index.html User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.0 Safari/605.1.15 Response Access-Control-Allow-Origin: * Content-Length: 6751354 Content-Security-Policy: script-src 'self' 'wasm-unsafe-eval'; object-src 'self'; Content-Type: application/octet-stream In the response the inner server that returns files for safari-web-extension should return application/wasm
2
0
315
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
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
Issue with Authentication Sharing Between Native App and WebView
I’m working on an iOS app using WKWebView, and I’ve implemented the following authentication flow: Sign-In Process: The sign-in process is handled natively. Access Token Storage: Once the user is signed in, the access token is stored within the app. WebView Cookie Setting: When a webview is opened, the app sets the access token in the webview’s cookies. Token Validation: The web server validates the access token from the cookie. Problem: I’m encountering an issue where the authentication state between the native app and the webview doesn’t always synchronize correctly. Specifically: Sign-In Issue: If a user signs in while the webview is already open, the native app attempts to set the cookie in the webview. However, there are cases where the cookie isn’t set properly, and the server fails to retrieve the access token, similar to when a user is signed out. Sign-Out Issue: When a user signs out, the native app deletes the cookie. Although the app reports success in deleting the cookie, the webview sometimes still retains the cookie, which can cause inconsistencies. These issues don’t happen consistently, and the behavior seems to be somewhat random. My Questions: Is there a problem with how I’m sharing authentication between the native app and the webview? Do you have any suggestions or best practices for ensuring that the cookie management between the native app and WKWebView is reliable? Thank you in advance for your help! I believe that the native app should manage the cookies for the WKWebView. However, I’m encountering issues where the cookies are not always synchronized properly between the native app and the webview.
0
0
245
Aug ’24
Safari web extension content blocker takes time to reflect on simulator few devices
We have implemented a content blocker using the Safari Web Extension, which can be toggled on or off as needed. However, we've noticed that changes in the Safari browser take effect only after the page is reloaded again. This behaviour has been observed across all simulators as well as on iPhone 8 Plus running iOS 16.7.8. Is this due to a delay in the JS file rules updation on simulator and lower devices?
1
0
252
Aug ’24
SFSafariViewController lifecycle delegate
Hello, Is it possible to use a delegate or other approach to detect lifecycle events like form submissions / navigation events from the SFSafariViewController from the application that creates the Safari instance? The use case is a centralised session keep-alive requirement to extend the ttl on tokens for multiple third-party clients that use Single-Sign-On via browser cookies for authentication.
1
0
165
Aug ’24
Username & Password
I have a project where I have two text fields for a user to enter a username and password. When the user clicks the submit button, I want the text they enter to auto inject into a username/password field on a website to log them in. Any ideas how I can make this?
2
0
235
Aug ’24
Mobile IOS v17.5 crashes when opening specific pdf
I have a few pdfs that contains images/grayscale images that opened properly on my app with IOS 16.5 but since upgrading to 17.5, the app crashes with “A problem has repeatedly occured on...” this means the IOS itself is not able to handle the pdf otherwise we would get an error from our app. Previously, while we got a warning in the console saying that the max canvas has been exceeded. The app did not crash. Would it be possible to know what was the changes coming in version 17.0+ that could have caused this? And if so, should this be a bug that gets fixed? I’ve looked at the release note and can’t pinpoint which changes could have caused this new behaviour. This occurs on safari and chrome.
1
0
247
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
AASA File Not Working as Expected with Hybrid Mobile App and Web Authentication
Hello, We are currently offering both a mobile web and a mobile app service. Our mobile app operates in a hybrid manner by utilizing the mobile web. However, when the app is installed, it seems that the AASA file is not functioning correctly on the mobile web. The AASA file we are using is as follows: AASA : { "applinks": { "apps": [], "details": [ { "appID": "Z9VSKJ792A.com.coke.cokeplaynew", "components": [ { "exclude": true, "/": "/payment/" }, { "exclude": true, "/": "/member/pass/" }, { "exclude": true, "/": "/member/check/pass" }, { "exclude": true, "/": "/member/passWeb" }, { "exclude": true, "/event/spritecoolcoupon" } ] } ] } } We are experiencing an issue when performing pass authentication on the mobile web. When opening a new window for authentication, the new window is generated correctly in the mobile web browser. However, after completing the authentication and posting back to the parent window at the /member/check/pass URL, the app is being launched, which causes a service error. (This URL is excluded in the AASA file.) It doesn’t seem like there’s an issue with the AASA configuration, but we are wondering if there might be another underlying problem. Thank you for your assistance.
1
0
171
Aug ’24
safaridriver failing to launch
MacOS Sonoma 14.6.1 Safari 17.6 Have been trying to launch Safaridriver and consistently getting the error: ERROR: safaridriver could not launch because it is not configured correctly or you need to authenticate. Re-run safaridriver(1) and pass the '--enable' flag to configure and/or authenticate. I have admin rights on the machine, but when I try the flag --enable, I get 'Password is not valid, please try again' (tried with different admin accounts). Sudo lets me use the --enable flag, but still getting the same error when trying to run. This seems to be a recent problem - worked a couple of months ago.
1
1
243
Aug ’24