npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@changenode/capacitor-sign-in-with-apple

v1.0.2

Published

Native Sign In With Apple CapacitorJS Plugin

Downloads

7

Readme

capacitor-sign-in-with-apple

Native Sign In With Apple CapacitorJS Plugin

npm npm

Get your own badge

Requirements

This is only designed to work with the current version of Capacitor (4+ as of this writing).

Install

npm install @changenode/capacitor-sign-in-with-apple
npx cap sync

API

auth()

auth() => Promise<{ response: SignInWithAppleSuccess | any; }>

Returns: Promise<{ response: any; }>


Interfaces

SignInWithAppleSuccess

| Prop | Type | | ----------------------- | ------------------- | | user | string | | state | string | | email | string | | givenName | string | | familyName | string | | identityToken | string | | authorizationCode | string |

Sample Usage

This is a snippet illustrating how I am using this code in my SvelteKit code. I imagine it's largely the same for Ionic - if anyone wants to post a snippet for Ionic feel free to do so in the GitHub Discussions and I'll include and/or link.

<script lang="ts">
	import { Capacitor } from '@capacitor/core';

	import {SignInWithApple} from 'capacitor-sign-in-with-apple';

	let device: any;
	let r: any;
	let e: any;

	async function auth() {
		device = Capacitor.getPlatform();

		SignInWithApple.auth()
			.then((response: any) => {
				console.log(response);
				r = response;
			})
			.catch((response: any) => {
				console.error(response);
				e = response;
			});
	}

	auth();
</script>

The plugin currently is only intended for use on iOS. It would be possible to implement Sign in with Apple on Android and via the web using Apple's REST and/or JavaScript SDKs, but that's out of scope for this plugin. If you do implement that functionality in another plugin let me know and I can include a link.

Errors & Troubleshooting

Unfortunately debugging issues with Sign in with Apple can be difficult. If you run into challenges with a simple "Hello World" app double-check the following:

  • The app id (e.g. com.example.my.App) is correct everywhere
  • The Sign in with Apple capability is set for the app - debug, release, etc.
  • The profiles are set up correctly in XCode
  • The app id is correctly associated with the Sign in with Apple info in the Apple developer portal

Reach out to Apple if Necessary

If everything is set up correctly you can still run into errors due to [mis]configuration on the Apple end of things. One symptom of this is the app will bring up the native dialog in the simulator and on the real device and appear to work but then fail with a large red exclaimation point and the message "Sign Up Not Completed" in the native dialog. You won't get anything in log files until you hit cancel, and then you will get a pretty generic error code that won't show up in Google searches.

As of this writing as part of your Apple Developer fee you get two dev tech support incidents. If you are certain that you have set up everything in your app correctly and you still get Sign Up Not Completed errors, I highly recommending using one of your support incidents to resolve the issue.

History

Based on the implementation by rlfrahm. I also looked through the various public forks of that branch and incorporated some of the changes I found.

Significant changes:

  • Rebuilt the project from scratch using the latest Capacitor 4 plugin generator.
  • Updated to use the most recent Swift bindings for auth from Apple
  • Added a TypeScript definition to match the resulting success data from Apple

Notes

As of this writing I'm able to use Sign in with Apple in an iPad-on-Apple Silicon build target via XCode, which is much faster/easier than using the iOS Simulator.