Aller au contenu
Transform To APP
FonctionnalitésComment ça marcheTarifsComment publierFAQ
ConnexionCréer mon app
window.TTA

API développeur — window.TTA

Votre site contrôle de vraies fonctions natives directement — le même code marche sur iOS et Android. Sans SDK, sans recompilation : appelez-les depuis votre site.

Détecter l’app

Votre site tourne dans un navigateur normal et dans l’app. Vérifiez window.TTA avant d’utiliser des fonctions natives pour que le web marche partout.

if (window.TTA) {
  // inside the native app
} else {
  // normal browser — your web fallback
}

Méthodes

Les méthodes « opt-in » n’existent que si vous activez la fonction dans le builder — détectez toujours la disponibilité.

window.TTA.platform

'ios' or 'android' — tells your site it runs inside the native app.

if (window.TTA) {
  console.log('Running natively on', window.TTA.platform);
}
window.TTA.haptic(type?)

Native haptic / vibration feedback. Pass a type for richer, contextual feedback: 'success' | 'warning' | 'error' (notification-style multi-pulse), 'light' | 'medium' | 'heavy' (impact strength), or 'selection' (subtle tick). No argument = a medium tap (backward compatible). Use it for form validation, button presses, success/error confirmations — makes the web feel truly native.

form.onSubmit = ok => window.TTA?.haptic(ok ? 'success' : 'error');
row.onSelect = () => window.TTA?.haptic('selection');
window.TTA.share(url?)

Open the native share sheet. Defaults to the current page URL.

window.TTA?.share('https://example.com/product/42');
window.TTA.rate()

Show the native App Store / Google Play review prompt.

window.TTA?.rate();
window.TTA.openExternal(url)

Open a link in the in-app browser instead of leaving your app.

window.TTA?.openExternal('https://help.example.com');
await window.TTA.scan()opt-in · Scanner

Open the full-screen native QR / barcode scanner. Resolves to {text, format} or null if cancelled.

const result = await window.TTA.scan();
if (result) alert('Scanned: ' + result.text);
await window.TTA.scanDocument()opt-in · Document scanner

Open the native document scanner (VisionKit on iOS, ML Kit on Android): auto-detects edges, crops and straightens. Resolves to an array of JPEG data URLs (one per page) or null if cancelled.

const pages = await window.TTA.scanDocument();
if (pages) uploadScans(pages); // ['data:image/jpeg;base64,...']
await window.TTA.recognizeText()opt-in · Text recognition

Native OCR (Vision on iOS, ML Kit on Android): the user captures a page and you get the recognized text. Resolves to a string or null. Great for receipts, IDs, business cards, forms.

const text = await window.TTA.recognizeText();
if (text) prefillForm(text);
window.TTA.logEvent(name, params?)opt-in · Analytics

Send a custom analytics event (Insights). 'app_open' is tracked automatically.

window.TTA?.logEvent?.('add_to_cart', { id: 'sku_42', value: 9.99 });
await window.TTA.getProducts()opt-in · In-app purchases

Fetch your products AND subscriptions: [{ id, type: 'inapp'|'subscription', title, price, priceValue, currency, period }].

const items = await window.TTA.getProducts();
items.forEach(p => renderPrice(p.id, p.price, p.period));
await window.TTA.purchase(productId)opt-in · In-app purchases

Launch the native purchase flow — one-time products or renewable subscriptions. Resolves to { success, productId, transactionId } or { success:false, cancelled }.

const r = await window.TTA.purchase('com.app.pro.monthly');
if (r.success) unlockPro();
await window.TTA.restorePurchases()opt-in · In-app purchases

Return the product IDs the user already owns (restore entitlements).

const owned = await window.TTA.restorePurchases();
if (owned.includes('com.app.pro.monthly')) unlockPro();
await window.TTA.showInterstitial()opt-in · Ads

Show a full-screen interstitial ad (AdMob). Resolves when the ad is dismissed — call it between screens or after an action.

await window.TTA?.showInterstitial?.();
goToNextScreen();
await window.TTA.showRewarded()opt-in · Ads

Show a rewarded video ad. Resolves to { rewarded: true } if the user earned the reward, { rewarded: false } otherwise.

const r = await window.TTA?.showRewarded?.();
if (r?.rewarded) grantBonus();
window.TTA.setTag(key, value)opt-in · Push

Tag the user in OneSignal to segment push & in-app messages (e.g. mark an abandoned cart and trigger a recovery message).

window.TTA?.setTag?.('cart', 'abandoned');
window.TTA?.setTag?.('plan', 'pro');
window.TTA.startActivity({ title, status, progress?, symbol? })opt-in · Live Activity

Start a Live Activity (iOS: lock screen + Dynamic Island; Android: ongoing live notification). progress is 0..1, symbol is an SF Symbol name (iOS). Great for order/delivery/match status.

window.TTA?.startActivity?.({ title: 'Order #1234', status: 'Preparing', progress: 0.2, symbol: 'shippingbox.fill' });
window.TTA.updateActivity({ status?, progress?, symbol?, title? })opt-in · Live Activity

Update the running Live Activity in real time. Any field you omit keeps its previous value.

window.TTA?.updateActivity?.({ status: 'Out for delivery', progress: 0.8 });
window.TTA.endActivity()opt-in · Live Activity

End the current Live Activity (e.g. when the order is delivered).

window.TTA?.endActivity?.();
window.TTA.addToCalendar({ title, start, end, location?, notes?, allDay? })opt-in · Calendar

Open the native 'new event' sheet pre-filled (the user confirms & saves). start/end are epoch milliseconds. Great for bookings, classes, appointments.

window.TTA?.addToCalendar?.({ title: 'Table for 2', start: Date.now() + 86400000, end: Date.now() + 90000000, location: 'Our restaurant' });
window.TTA.saveContact({ name, phone?, email?, org?, url? })opt-in · Contacts

Open the native 'new contact' sheet pre-filled so the user can save your details to their address book.

window.TTA?.saveContact?.({ name: 'Acme Support', phone: '+1 555 0100', email: '[email protected]', url: 'https://acme.com' });
await window.TTA.saveImage(dataUrlOrUrl) → booleanopt-in · Save images

Save an image to the device gallery (iOS Photos / Android Gallery). Accepts a data: URL (e.g. a canvas-generated QR code or coupon) or an http(s) image URL. Returns a Promise that resolves true on success, or false if it failed or the user denied the gallery permission — so you never tell the user it saved when it didn't. Fires the native add-to-gallery permission automatically.

// Save a generated coupon / QR straight to the gallery, and confirm honestly
const ok = await window.TTA?.saveImage?.(document.querySelector('#qr-canvas').toDataURL('image/png'));
alert(ok ? 'Saved to your gallery' : 'Could not save — check gallery permission');
// …or a hosted image
await window.TTA?.saveImage?.('https://acme.com/ticket-1234.png');
await window.TTA.addToWallet(passUrl) → booleanopt-in · Wallet

Add a pass to the device wallet — loyalty cards, tickets, coupons, memberships. On iOS pass a .pkpass (as an https URL or a data: URL) → presents the native Apple Wallet add sheet. On Android pass a Google Wallet 'save' link (https://pay.google.com/gp/v/save/<jwt>) → opens Google Wallet. The pass is generated and signed by YOUR backend (we don't need your certificate). Returns a Promise that resolves true once the wallet sheet/flow was shown, false if the pass couldn't be loaded. Use window.TTA.platform to choose the right pass per OS.

const url = window.TTA.platform === 'ios'
  ? 'https://acme.com/passes/loyalty-1234.pkpass'        // Apple Wallet (.pkpass)
  : 'https://pay.google.com/gp/v/save/eyJhbGciOi...';   // Google Wallet save link
const ok = await window.TTA?.addToWallet?.(url);
if (!ok) showToast('Could not add the pass');
window.TTA.openMaps(addressOrCoords)opt-in · Maps

Open native maps (Apple Maps on iOS, Google Maps on Android) at a location or with turn-by-turn directions. Pass a string (address/place) or an object { lat, lng, label?, mode? }. Set mode:'directions' to start navigation to the destination.

// A place by address
window.TTA?.openMaps?.('Plaza Mayor, Madrid');
// …or coordinates, with directions
window.TTA?.openMaps?.({ lat: 40.4154, lng: -3.7074, label: 'Our store', mode: 'directions' });
await window.TTA.dictate(locale?) → string | nullopt-in · Voice to text

Native voice dictation. Opens the native speech recognizer (Speech framework on iOS, Google recognizer on Android), shows a listening UI, and resolves with the transcribed text — or null if cancelled / nothing heard. Optional BCP-47 locale (e.g. 'es-ES'). Great for voice search and form fields.

const text = await window.TTA?.dictate?.('es-ES');
if (text) document.querySelector('#search').value = text;
window.TTA.setSecureScreen(on)opt-in · Screen security

Toggle screen security at runtime. On Android it adds/removes FLAG_SECURE (blocks screenshots and screen recording); on iOS it blurs the app in the app switcher. You can also enable it globally for the whole app from the builder. Ideal for banking, health or paid-content screens.

// Protect a sensitive screen, then relax on a public one
window.TTA?.setSecureScreen?.(true);
// …later
window.TTA?.setSecureScreen?.(false);
await window.TTA.readNFC() → string | nullopt-in · NFC

Read an NFC tag. Presents the native scan UI (iOS) / reader prompt (Android), reads the first NDEF record (URI or text) and resolves with its content — or null if cancelled / no tag. Use for tap-to-earn loyalty, product authentication, pairing. iOS requires the NFC capability on your App ID.

const tag = await window.TTA?.readNFC?.();
if (tag) console.log('NFC says:', tag); // e.g. a URL or your own payload
await window.TTA.writeNFC(textOrUrl) → booleanopt-in · NFC

Write an NFC tag. Presents the native scan UI and writes an NDEF record to the tag the user taps (a URI record if the text is a URL, otherwise a text record). Resolves true on success, false if cancelled / the tag is read-only / it failed. Use to program loyalty tags, posters, product tags.

const ok = await window.TTA?.writeNFC?.('https://acme.com/loyalty/visit?id=42');
showToast(ok ? 'Tag written' : 'Could not write tag');
await window.TTA.authenticate(reason?) → booleanopt-in · Biometrics

Ask the user to confirm with biometrics (Face ID / Touch ID on iOS, fingerprint/face on Android), with a device-passcode fallback. Resolves true if they pass, false if they cancel/fail or no biometrics are set up. Use it to gate sensitive actions — confirm a payment, reveal a code, open a private section. Requires the biometric feature enabled.

const ok = await window.TTA?.authenticate?.('Confirm your payment');
if (ok) submitPayment(); else showError('Authentication required');
await window.TTA.print() → booleanopt-in · printing

Open the system print dialog for the current page (AirPrint on iOS, Android print service). Perfect for receipts, tickets, invoices, labels, boarding passes — render the document as a page and call print(). Resolves true when printing is triggered (on iOS, false if the user cancels). No permission. Tip: use a print-only CSS @media print stylesheet to format the printout.

printBtn.onclick = async () => {
  document.body.classList.add('printing'); // your @media print styles
  await window.TTA?.print?.();
};
window.TTA.startBackgroundAudio({ title, artist, album, artwork }) · updateBackgroundAudio(info) · stopBackgroundAudio() · onMediaCommand(cb)opt-in · backgroundAudio

Keep your HTML5 <audio>/<video> playing while the app is minimized or the screen is locked — for podcasts, audiobooks, courses, radio and music. Call startBackgroundAudio when playback starts (shows now-playing info + lock-screen controls on iOS, a media notification on Android). Call updateBackgroundAudio on track change / play-pause / progress. The system controls (play/pause/next/prev) come back to your page as a 'tta:mediacommand' DOM event — handle them with onMediaCommand(cb) and drive your own <audio>. Call stopBackgroundAudio when playback ends. artwork must be an https URL.

const audio = document.querySelector('audio');
audio.addEventListener('play', () => window.TTA?.startBackgroundAudio?.({ title: track.name, artist: track.author, artwork: track.cover }));
audio.addEventListener('pause', () => window.TTA?.updateBackgroundAudio?.({ title: track.name, playing: false }));
window.TTA?.onMediaCommand?.((action) => {
  if (action === 'play') audio.play();
  else if (action === 'pause') audio.pause();
  else if (action === 'next') playNext();
  else if (action === 'prev') playPrev();
  else if (action === 'stop') { audio.pause(); window.TTA?.stopBackgroundAudio?.(); }
});
await window.TTA.pickFile({ accept, maxSize }) → { name, mimeType, size, dataUrl } | nullopt-in · filePicker

Open the native file picker and get the chosen document back as a base64 data URL — upload-ready, no <input> element needed. `accept` filters by MIME type (e.g. ['application/pdf','image/*']); `maxSize` caps the bytes (default 20MB; larger files resolve { name, mimeType, size, tooLarge:true } without dataUrl). Returns null if cancelled. Perfect for KYC, document attachments, forms, support tickets. No permission.

const f = await window.TTA?.pickFile?.({ accept: ['application/pdf'], maxSize: 10*1024*1024 });
if (f?.dataUrl) await fetch('/api/kyc', { method:'POST', body: JSON.stringify({ name: f.name, file: f.dataUrl }) });
await window.TTA.viewAR({ usdz, glb }) → booleanopt-in · arViewer

Open a 3D model in the device's native AR viewer — AR Quick Look on iOS (.usdz), Scene Viewer on Android (.glb) — so the customer can place your product in their real space through the camera. Perfect for furniture, decor, retail. Provide both formats (host a .usdz and a .glb of each product). Resolves true if the native AR viewer opened; on Android it resolves false when the device has no Scene Viewer/ARCore, so you can fall back to your own in-page 3D viewer. The model is fetched over HTTPS only. No SDK, no permission.

arBtn.onclick = () => window.TTA?.viewAR?.({
  usdz: product.usdzUrl,  // iOS
  glb: product.glbUrl,    // Android
});
await window.TTA.pickContact() → { name, phone, email } | nullopt-in · contactPicker

Open the system contact picker and get back the chosen contact as { name, phone, email }, or null if cancelled. The picker runs out-of-process so it needs NO contacts permission — the user explicitly chooses one contact and your site only ever sees that one. Great for invite-a-friend, refer-a-friend, or autofilling a recipient/delivery contact. Note: on Android the permission-free picker returns name + phone (email is empty); iOS returns all three.

const c = await window.TTA?.pickContact?.();
if (c) { inviteName.value = c.name; invitePhone.value = c.phone; }
await window.TTA.takePhoto({ maxWidth, quality }) · pickImage({ maxWidth, quality }) → dataURL | nullopt-in · imageCapture

Capture a photo with the camera (takePhoto) or pick one from the gallery (pickImage) and get back a JPEG data URL — already EXIF-rotated, downscaled to maxWidth (longest side, default 1280px) and compressed to quality (0–1, default 0.8). Resolves null if the user cancels. Unlike a raw <input type=file>, you control the output size, so uploads are fast and consistent. takePhoto asks for camera permission; pickImage needs none.

const dataUrl = await window.TTA?.pickImage?.({ maxWidth: 1024, quality: 0.7 });
if (dataUrl) {
  avatar.src = dataUrl;
  await fetch('/api/upload', { method: 'POST', body: JSON.stringify({ image: dataUrl }) });
}
await window.TTA.secureStore(key, value) → bool · secureGet(key) → string|null · secureRemove(key) → boolopt-in · secureStorage

Hardware-backed secure storage: persist tokens, credentials or sensitive values in the iOS Keychain / Android Keystore instead of localStorage. Encrypted at rest, sandboxed to your app, and it survives a WebView cache clear (localStorage does not). Ideal for auth tokens, refresh tokens, API keys, biometric-gated secrets. It's device-bound (does not sync or migrate to other devices) and cleared on app uninstall on both platforms. Note: it's app-scoped storage accessible to your own web content — protects at-rest and cross-app, so still avoid exposing secrets to untrusted third-party scripts on your page.

await window.TTA?.secureStore?.('authToken', token);
// later…
const token = await window.TTA?.secureGet?.('authToken');
if (!token) redirectToLogin();
// logout
await window.TTA?.secureRemove?.('authToken');
await window.TTA.getNetworkStatus() → { online, type }opt-in · networkStatus

Get the current network state: { online: boolean, type: 'wifi' | 'cellular' | 'wired' | 'other' | 'none' }. Unlike navigator.onLine (which only says online/offline and is unreliable in WebViews), this tells you the connection TYPE — so you can warn before a large download on cellular, drop video quality on mobile data, or show an accurate offline banner. No sensitive permissions.

const net = await window.TTA?.getNetworkStatus?.();
if (net?.type === 'cellular' && !confirm('Download over mobile data?')) return;
if (!net?.online) showOfflineBanner();
await window.TTA.speak(text, { lang, rate, pitch }) → boolean · window.TTA.stopSpeaking()opt-in · textToSpeech

Read text aloud with the device's native voice (text-to-speech). Resolves true when it finishes speaking, false if cancelled/failed. Options: lang (BCP-47, e.g. 'en-US'), rate and pitch (multipliers where 1.0 = normal; values further from 1.0 are approximate and can differ slightly between iOS and Android, which use different speech engines). Call stopSpeaking() to cut it off. Great for accessibility and hands-free content — read articles, product descriptions, or instructions out loud. No permissions needed.

// Read the current article aloud
await window.TTA?.speak?.(article.innerText, { lang: 'en-US', rate: 1.0 });
// stop button
stopBtn.onclick = () => window.TTA?.stopSpeaking?.();
await window.TTA.requestNotificationPermission() → booleanopt-in · scheduledNotifications

Prompt for notification permission at the moment YOU choose (after the user sees value — not on cold launch), and get back whether it was granted. This typically lifts opt-in rates dramatically vs prompting immediately. Part of the scheduled-notifications feature. On Android <13 / iOS it resolves the system's current state.

// Ask only after the user finishes their first order
if (await window.TTA?.requestNotificationPermission?.()) {
  await window.TTA?.scheduleNotification?.({ id:'tips', title:'Welcome!', body:'Order tips inside', at: Date.now()+86400000 });
}
await window.TTA.scheduleNotification({ id, title, body, at }) → booleanopt-in · scheduledNotifications

Schedule a LOCAL notification that fires on its own at the given time (`at` = epoch milliseconds) — even if the app is closed, with NO push server. `id` is your key (calling again with the same id replaces it). Returns true if scheduled (false if the user denied notifications). Re-engagement without a backend: cart reminders, appointment alerts, 'your code expires in 1h'. Cancel with window.TTA.cancelNotification(id).

// Remind the user in 1 hour about their cart
const in1h = Date.now() + 60*60*1000;
await window.TTA?.scheduleNotification?.({ id: 'cart', title: 'Still there? 🛒', body: 'Your items are waiting', at: in1h });
// …user checked out → cancel it
window.TTA?.cancelNotification?.('cart');
window.addEventListener('tta:active' | 'tta:background', handler)opt-in · Always on

Lifecycle events. The app fires a DOM event 'tta:active' when it returns to the foreground and 'tta:background' when it leaves. Listen with addEventListener to refresh data when the user comes back, or pause videos / timers / polling when they switch away. Always available — no native call needed.

window.addEventListener('tta:active', () => refreshFeed());
window.addEventListener('tta:background', () => { pauseVideo(); stopPolling(); });
window.TTA.openAppSettings()opt-in · Always on

Open this app's settings page in the OS — the place where the user can re-enable a permission they previously denied (camera, location, notifications, Photos…). Always available. Pair it with a 'permission denied? open settings' prompt for a complete permission flow.

// User denied the camera? send them to settings to fix it
if (cameraDenied) {
  if (confirm('Enable camera access in Settings?')) window.TTA?.openAppSettings?.();
}
await window.TTA.getDeviceInfo() → objectopt-in · Device controls

Get native device info for adaptive UX — things the web can't read on its own: { platform, osVersion, model, appVersion, appBuild, battery: { level 0-1, charging }, darkMode, language }. Use it to enable a battery-saver mode, match the OS dark theme, gate by app version, etc. (Part of the device-controls feature.)

const info = await window.TTA?.getDeviceInfo?.();
if (info?.battery?.level < 0.15 && !info.battery.charging) enableLowPowerMode();
if (info?.darkMode) document.documentElement.classList.add('dark');
window.TTA.setBrightness(0..1) · setKeepAwake(bool) · setFlashlight(bool)opt-in · Device controls

Device controls. setBrightness(level) sets screen brightness 0–1 (pass a negative value to restore) — perfect for max-brightness display of a QR code, barcode or wallet pass to a scanner. setKeepAwake(true) stops the screen from sleeping (menus, kiosks, reading). setFlashlight(true) toggles the torch. No special permissions.

// Show a loyalty QR at full brightness, screen stays on
window.TTA?.setBrightness?.(1);
window.TTA?.setKeepAwake?.(true);
// …restore when the user leaves the QR screen
window.TTA?.setBrightness?.(-1);
window.TTA?.setKeepAwake?.(false);
// Torch
window.TTA?.setFlashlight?.(true);
window.TTA.shareImage(dataUrlOrUrl, text?)opt-in · Native share

Share an image to other apps (WhatsApp, Mail, Messages, Photos…) via the native share sheet. Pass a data: URL (e.g. a canvas-generated coupon/QR) or an https image URL, plus optional accompanying text. Great for letting users share a generated pass, ticket or QR. (Uses the native share feature.)

// Share a generated coupon image with a caption
window.TTA?.shareImage?.(canvas.toDataURL('image/png'), 'Here is your 20% coupon!');
// …or a hosted image
window.TTA?.shareImage?.('https://acme.com/ticket-1234.png');
window.TTA.copyToClipboard(text) · await window.TTA.getClipboard() → stringopt-in · Clipboard

Native clipboard access — reliable inside the app, where the browser's navigator.clipboard is often blocked or empty in a WebView. copyToClipboard writes text; getClipboard resolves with the current clipboard text (may be empty).

window.TTA?.copyToClipboard?.('PROMO-2026');
const pasted = await window.TTA?.getClipboard?.();
if (pasted) applyCode(pasted);

Fonctionne automatiquement

Avec la fonction activée, les API web standard marchent dans l’app : navigator.geolocation (Localisation), caméra getUserMedia pour les librairies QR web (Caméra), <input type=file> et téléchargements.

Créez votre app avec ces super-pouvoirs

Ouvrir le builder
Transform To APP

La plateforme nº1 pour transformer des sites web en applications natives.

[email protected]

Produit

  • Fonctionnalités
  • Tarifs
  • Comment ça marche
  • Comment publier
  • Intégrations
  • Développeurs

Solutions

  • Restaurants
  • Boutiques en ligne
  • Salles de sport
  • Immobilier

Entreprise

  • À propos
  • Comparatifs
  • Contact

Mentions légales

  • Confidentialité
  • Conditions
  • Cookies
© Transform To APP. Tous droits réservés.transformtoapp.com