DEV Community: Jason Safaiyeh

[Boost]

Jason Safaiyeh — Tue, 29 Apr 2025 21:34:47 +0000

Jason Safaiyeh

Apr 29 '25

Why You Can’t Deploy Your iOS App to France (and How to Fix It in 5 Minutes)

#ios #appstore #mobile

Comments 1

1 min read

Why You Can’t Deploy Your iOS App to France (and How to Fix It in 5 Minutes)

Jason Safaiyeh — Tue, 29 Apr 2025 21:34:38 +0000

Quick heads-up:

If you already know you need to file French crypto paperwork for your iOS app, you can generate it automatically here: Nova Store.

“Why won’t Apple let me launch in France?!”

If you’ve ever tried distributing your iOS app to France and hit weird legal or compliance issues - you're not alone.

Most devs don’t realize that just using HTTPS, APNs, Keychain, or CryptoKit puts your app in a category that requires a cryptography declaration under French law. No one warns you, but Apple still expects you to comply.

This comes from Décret n°2007-663 — a French regulation that classifies basic cryptographic usage (like SSL/TLS) as “means of cryptology.”

If you don’t file the required documents with ANSSI, your app can get blocked or delayed.

What Are You Supposed to Do?

Technically, you need to:

Fill out a 6-page declaration form (in French)
Attach detailed technical descriptions of your app’s crypto functions
Email it manually to the French government (ANSSI) before launch
Hope it’s accepted without requiring revisions

Most devs find out about this only when they want to launch.

How to Fix It in Minutes

Rather than spend hours digging through French legal forms, you can now generate the full required documentation automatically.

I built Nova Store to handle this.
• Fill in basic app info
• Auto-generate a complete, compliant PDF

Submit it directly to ANSSI without worrying about legal mistakes
It saves hours of time - and helps you avoid customs or compliance issues down the line.

Svelte: Google Sign In/Out

Jason Safaiyeh — Sun, 19 Jan 2020 23:18:39 +0000

You got your awesome Svelte app and it is time to integrate some authentication flows. Sign in with Google is one way to support many users to log into your app.

Google makes it simple to plug in their ready made Google Sign In button for any web project.

Let's get started.

Google Prerequisite

A client ID from Google is necessary to integrate sign in. Configure a project here: https://developers.google.com/identity/sign-in/web/sign-in#before_you_begin

Once you navigated the Google API dashboards and have a client ID, add a meta tag to your root HTML file. If you generated your Svelte app with the default configuration, it should be in public/index.html.



<!doctype html>
<html>
<head>
  <meta name="google-signin-client_id" content="CLIENT_ID.apps.googleusercontent.com">
</head>
...
</html>

Set up the Google Sign In Button

Let us create a new component GoogleSignInButton.svelte to handle the UI and sign in.

Let start off with the component, we need to add the Google Platform and display the button.



<svelte:head>
  <script src="https://apis.google.com/js/platform.js" async defer></script>
</svelte:head>

<div class="g-signin2" data-longtitle="true" data-onsuccess="onSignIn" />

Success! ✅ You should see your button.

The div takes a property data-onsuccess="onSignIn". It looks for the function window.onSignIn and uses that as the on sign in callback.



<script>
  window.onSignIn = (googleUser) => {
     const profile = googleUser.getBasicProfile();
     console.log('ID: ' + profile.getId());
     console.log('Name: ' + profile.getName());
     console.log('Image URL: ' + profile.getImageUrl());
     console.log('Email: ' + profile.getEmail());
  };
</script>

<svelte:head>
  <script src="https://apis.google.com/js/platform.js" async defer></script>
</svelte:head>

<div class="g-signin2" data-longtitle="true" data-onsuccess="onSignIn" />

Now you have access to the public information of the user. You can use the attributes to create a unique user so they can continue to log into your app.

Logging out

To logout we need to use Google API AuthInstance to call sign out, we included this API in our root HTML file.

Let's create a Logout.svelte component.



<script>
  window.signOut = () => {
    const auth2 = gapi.auth2.getAuthInstance();
    auth2.signOut().then(() => {
      // User is now signed out
    });
  }
</script>

<a onclick="signOut">Sign out</a>

We are using the onclick attribute to reference our signOut logic. Now we have signing out! ✅🎉

Persisting Session

It would be a pain if the user had to sign in every time they want to access your site. So let's make sure the session is persisted.

We need to know when the Google API has loaded before we try to access it. We can add an on load callback by using the onload URL param.

In GoogleSignInButton.svelte, append the platform URL with ?onload=<NAME OF CALLBACK>



<script src="https://apis.google.com/js/platform.js?onload=onLoadCallback" async defer></script>

In App.svelte we can handle the case where the user accesses the site. We check if a Google User exists and act accordingly.



<script>
  let userLoggedIn = false;
  window.onLoadCallback = () => {
    userLoggedIn = gapi.auth2.getAuthInstance().isSignedIn.get();
    if (userLoggedIn) {  
      // Handle login
    }
  }
</script>

Now we have persistent sessions with Google authentication! ✅🎉

Leave a comment if this was helpful or have any questions!

You can find me on Twitter @safaiyeh

or maintaining react-native-webview and @react-native-community/react-native-cookies.

Keep Building!

React Native: Authentication with WebView

Jason Safaiyeh — Mon, 13 Jan 2020 03:27:59 +0000

A more interactive tutorial: https://getleaf.app/dsps301/reactnativeau-pvopbxhp

You have a web application with all your features built out and now it is time to build your mobile app. You find yourself writing out the same business logic over again and think, "hmm maybe there is a quicker way to initially implement features, to iterate faster?"

Good news, you can! 🎉

Using the power of web views, mobile applications can wrap login flows and authenticate users without having to rewrite the logic.

React Native WebView

Let's get started with a powerful tool called react-native-webview.

Starting with a basic example that loads the login page.

import React, { FunctionComponent } from 'react';
import { WebView } from 'react-native-webview';

const LoginWebView: FunctionComponent = () => (
  <WebView
    source={{ uri: 'https://mywebapp.com/login' }}
  />
);

Now the user can see the login page and go down any of the app's auth flows.

Features supported:
✅ Login
✅ Sign Up
✅ Forgot Password

URL Param Tokens

Some authentication flows will redirect to a URL containing the user's access token as a URL param.

Taking advantage of react-native-webview's prop onNavigationStateChange, we can watch the URL changes and act accordingly.

We will detect when the token is in the URL, then parse it out so it can be used in the mobile app.

import React, { FunctionComponent } from 'react';
import { WebView, WebViewNavigation } from 'react-native-webview';

const onNavigationStateChange = (navigationState: WebViewNavigation) => {
  const url = navigationState.url;

  // parseURLParams is a pseudo function.
  // Make sure to write your own function or install a package
  const params = parseURLParams(url);

  if (params.token) {
    // Save token for native requests & move to the next screen
  }
};

const LoginWebView: FunctionComponent = () => (
  <WebView
    source={{ uri: 'https://mywebapp.com/login' }}
    onNavigationStateChange={onNavigationStateChange}
  />
);

Now the user is authenticated and the token can be used in your app!

Features supported:
✅ URL Param Token-based Auth

Cookies Based Auth

For more complex auth flows, you may need several cookies to authenticate a user.

Taking advantage of react-native-webview's prop onMessage, we can send the document's cookies to the native code.

Every time navigationStateChange is triggered, we will inject a script using injectJavaScript that returns cookie information for onMessage to process.

import React, { createRef, FunctionComponent } from 'react';
import { WebView, WebViewNavigation } from 'react-native-webview';

// Send the cookie information back to the mobile app
const CHECK_COOKIE: string = `
  ReactNativeWebView.postMessage("Cookie: " + document.cookie);
  true;
`;

const onNavigationStateChange = (navigationState: WebViewNavigation) => {
  ...

  // Check cookies every time URL changes
  if (webViewRef.current) {
    webViewRef.current.injectJavaScript(CHECK_COOKIE);
  }
};

const onMessage = (event: NativeSyntheticEvent<WebViewMessage>) => {
  const { data } = event.nativeEvent;

  if (data.includes('Cookie:')) {
    // process the cookies
  }
};

let webViewRef = createRef<WebView>();
const LoginWebView: FunctionComponent = () => (
  <WebView
    ref={webViewRef}
    source={{ uri: 'https://mywebapp.com/login' }}
    onNavigationStateChange={onNavigationStateChange}
    onMessage={onMessage}
  />
);

Now the application has cookies for future requests.

Features Supported:
✅ Cookie Based Auth

iOS Quirk

WKWebView stores session cookies on the device. It will not be returned in the CHECK_COOKIE script we used above.

To get around this we need to use @react-native-community/react-native-cookies to extract the cookies from the device cookie manager.

We need to set the sharedCookiesEnabled prop to true. This tells WebView to save the cookies onto the native cookie manager.

import React, { createRef, FunctionComponent } from 'react';
import { WebView, WebViewNavigation } from 'react-native-webview';
import CookieManager from '@react-native-community/react-native-cookies';

// Send the cookie information back to the mobile app
const CHECK_COOKIE: string = `
  ReactNativeWebView.postMessage("Cookie: " + document.cookie);
  true;
`;

const onNavigationStateChange = (navigationState: WebViewNavigation) => {
  ...

  // Check cookies every time URL changes
  if (webViewRef.current) {
    webViewRef.current.injectJavaScript(CHECK_COOKIE);
  }
};

const onMessage = async (event: NativeSyntheticEvent<WebViewMessage>) => {
  const { data } = event.nativeEvent;

  if (data.includes('Cookie:')) {
    // process the cookies
    const storedCookies = await CookieManager.get(
      'https://mywebapp.com/login', 
      true
    );
};

let webViewRef = createRef<WebView>();
const LoginWebView: FunctionComponent = () => (
  <WebView
    ref={webViewRef}
    source={{ uri: 'https://mywebapp.com/login' }}
    onNavigationStateChange={onNavigationStateChange}
    onMessage={onMessage}
    sharedCookiesEnabled
  />
);

Features:
✅ iOS Support

Conclusion

Web views can be used in very creative ways to build mobile applications; especially, if you want to iterate quick.

Let me know if there are other ways of authenticating through web views or a different type of authentication that you want to be seen done!

Leave a comment if this was helpful or have any questions!

You can find me on Twitter @safaiyeh

or maintaining react-native-webview and @react-native-community/react-native-cookies.

Keep Building!