Sign in with apple js use popUp

I have the same problem with the same initializations.

I also have the same issue. The popup is not turned off and no result is returned.

When I navigate to the link in this post https://medium.com/identity-beyond-borders/how-to-configure-sign-in-with-apple-77c61e336003

(https://appleid.apple.com/auth/authorize?response_type=code&redirect_uri=<redirect_uri>&client_id=<client_id>)

replacing <redirect_uri> and <client_id> with the values I entered in the "Certificates, Identifiers & Profiles" section of the developer page, I'm able to click on "Continue" and be redirected to the redirect_uri.

It looks as though the url that is in the popup doesn't react to the call to /authorize once it returns.

I also haven't been able to verify my domain. Were any one of you getting this even with a verified domain?

I am using https://example-app.com/redirect as the redirect_uri and there is not any response also.

Hi

when "usePopup" set to true, we will only post the data back to the "redirectURI" provided in AppleID.auth.init (redirectURI)

For example if the app that invoked Sign in with Apple JS has url "https://www.example.com/test" then the redirectURI should be "https://www.example.com"

However if the app url is "https://www.example2.com/test" then the app will not get any data

Please refer to this docuemnt https://developer.apple.com/documentation/signinwithapplejs/configuring_your_webpage_for_sign_in_with_apple for more detail how to use usePopup

Where is that stated in the documentation?

APPLE HELP ME PLEASE!
I`m integrating the social login using apple sdk on a big brazilian e-commerce.

Actually our login flow require the apple id popup solution to prevent user get out site, actually Im using this configurations on init:

Init code:

window.AppleID.auth.init({
  clientId: 'example.client.id',
  redirectURI: 'https://www.oursite.com.br/login/callback',
  usePopup: true,
 })

The app url is: https://www.oursite.com.br/login

Login code:

try {
  const data = await AppleID.auth.signIn()
  return data //doest receive
} catch (error) {
  console.error({error})
}

THE PROBLEM IS:

When popup is opened and appleid and password is correctly submit, the popup does`t retuns the promise.

When cancel button is trigger the popup does`t close and error is not called

Just when popup is closed by navigation button the error is called

I need help, whats the problems on implementation?

Hello,

I'm having the issues with testing "Sign in with Apple" button on a localhost of a web page. Why pop up button is not working when I run it locally. The pop up button is not functioning well after I give my credential and it is not giving me any data back from the redirect uri.

Please help me on this.

My understanding of the docs is when `usePopup` is true, no data is posted to the redirect uri but rather the data is returned in a Promise (or DOMEvent) in the page that initiated the pop up.

"If the authorization flow started using the

signIn

function, it returns a promise that will get resolved if the authorization succeeds, or rejected if fails."

(https://developer.apple.com/documentation/sign_in_with_apple/sign_in_with_apple_js/configuring_your_webpage_for_sign_in_with_apple

)

AppleID.auth.init(params);

AppleID.auth.signIn().then((data) => {
     console.log(data);
});

Faceing the same issue, no succcess, posted at https://discussions.apple.com/thread/251588621

For those still struggling with this like I was, chances are you are working off of localhost.

If you’re using usePopup: true as an option, the URL in which the script is initialized NEEDS to match redirectURI at the top level. Since Apple won’t let you use localhost as a valid redirectURI, you’ll need to add an entry to /etc/hosts such as:

Code Block  
127.0.0.1			mywebsite-dev.com

Then you can use mywebsite-dev.com in your redirectURI as long as you added in your certificate.

Hope this helps.

I am running into the same issue, and wasn't able to determine the cause while using Chrome. On Firefox, however, the message was clearer:

Code Block 
Failed to execute ‘postMessage’ on ‘DOMWindow’: The target origin provided (‘https://x.example.com’) does not match the recipient window’s origin (‘https://y.example.com’).

It appears the iframe is only allowed to do the "post" on the same origin as the page that opened the popup. This is not at all explained in Apples documentation.

Is there no way to customize the iframe behavior of the Apple SDK so that additional origins can be allowed for the postMessage call? Currently, our auth service (which is what should receive the callback) is on a different subdomain than the page initiating the popup. Working around this won't be a trivial change for us.

@alexwb did you find a workaround?
@Natthakorn123  do you confirm we cannot have 2 different subdomains to open the popup and receive the callback?

Thank you in advance guys.

I handle the response by adding this on my script:

Code Block 
document.addEventListener('AppleIDSignInOnSuccess', (data) => {
	console.log(data);
})

or this to handle errors

Code Block 
document.addEventListener('AppleIDSignInOnFailure', (error) => {
    console.log(error);
});