Kakao auth popup closes unexpectadly in mobile browsers

JavaScript
1

I have integrated kakao as a social login to my application and using JavaScript SDK.
But I am facing an issue with mobile browser. In mobile browser when the user clicks on login with kakao it opens the popup but the popup suddenly closes and this happens for 3-4 times before completely opening the popup with email and password field and allowing the user to login. sometimes it keeps closing forever.
I found link to this page http://test-tam.pe.kr/kakao.php from the docs and checked if it is working in my browser it is working fine. I tried this with mobile mode of Chrome developer tools and it is working fine.

I just noticed that when the popup closes suddenly the url is about:blank

Need help to debug this.

2

hello,

could you please provide a reproducible URL for detailed verification?

3

Hello,
Thanks for replying, I am reproducing the issue on my local server .Here is the video of the issue I am facing and the URL which is opening in the popup

As you can see the popup closes for 2-3 times and then opens with correct content.

Here is the link opened in the popup
https://accounts.kakao.com/login/simple/?continue=https%3A%2F%2Fkauth.kakao.com%2Foauth%2Fauthorize%3Fproxy%3DeasyXDM_Kakao_oe53dedg8yi_provider%26ka%3Dsdk%252F1.43.1%2520os%252Fjavascript%2520sdk_type%252Fjavascript%2520lang%252Fen-US%2520device%252FLinux_x86_64%2520origin%252Fhttps%25253A%25252F%25252Flocalhost%25253A3000%26origin%3Dhttps%253A%252F%252Flocalhost%253A3000%26response_type%3Dcode%26redirect_uri%3DJS-SDK%26state%3D9m04fdkpbapkj0subqhg6%26through_account%3Dtrue%26client_id%3D&talk_login=hidden#simpleLogin

Thankss

4

Please refrain from using popup login in mobile view mode disguised as an iPhone. When popups open in your browser, the UserAgent values are conflicting between “Ubuntu” and “iOS Firefox”. Kindly turn off mobile view mode for testing, and I recommend using the redirect_uri method.

5

Actually this is happening on Safari mobile browser and Chrome mobile browser on IOS. I was replicating this on local machine(Ubuntu) to debug why this was happening.

6

If the user is already connected (logged in with Kakao) to the service, the consent screen will not be displayed, and the popup will close immediately. (This process may appear as a brief flicker.)

If the issue persists on your actual device, please provide the video of the test along with the time(UTC).
Additionally, if we could access the URL where the issue is reproducible from our end, it would greatly assist in identifying the cause.

7

Hey sorry for the late response.
You can reproduce the issue here https://www.sephora.kr/sign_in?return_to=%2F for mobile web on IOS.

8

hi, @pkle8deb7

I tried the same, but it wasn’t reproduced.

On the http://test-tam.pe.kr/kakao.php page, the pop-up login is handled as follows.

<script type="text/javascript">
    function loginWithKakaoPopUp() {
        Kakao.Auth.login({
            success: function(authObj) {
                console.log("success")
                console.log(JSON.stringify(authObj));
                Kakao.Auth.setAccessToken(authObj.access_token);
            },
            fail: function(err) {
                console.log("fail")
                console.log(JSON.stringify(err))
            },
            always: function(sc, fc) {
                console.log("always")
                console.log(JSON.stringify(sc))
                console.log(JSON.stringify(fc))
            }
        })
    }
</script>

There is no difference between login on your site and login on my site.
However, since my site said it was working normally, I think there will be a problem with your site dependency.

Please make a page where only Kakao login is applied and check it

9

Hi the login is working fine on desktop browser. The issue is with the mobile browsers, You can refer to the video below of the issue.

I am using js-sdk popup.

LMK if you need code related to Kakao setup.

10

Hi, @pkle8deb7

Works fine on mobile safari and chrome.
I couldn’t reproduce it.

(1) From the attached video, it seems that Google login is also failing.
(2) The device you tested does not appear to be able to access the talk-apps.kakao.com Universal link.

Please check it in another test device, another network environment.

We need to check if the site you developed has an impact.
Please check the normal operation with the html page with only Kakao login.

11

Hi

  1. I clicked on Google login by mistake and canceled it, hence the error message.
  2. I have tested on 2 devices with different network both of them having the same issue.

We need to check if the site you developed has an impact.
The issue is happening only on mobile site.

Normal operations on web are working properly, user is able to sign in using Kakao.

12

Have you checked by applying only one Kakao login on a separate page?
Are you saying that if I do this, my mobile device browser will work fine?

13

I haven’t tried implementing kakao login on a seperate page and trying it. Let me try this.

Are you saying that if I do this, my mobile device browser will work fine?
I didn’t get you here

1개의 좋아요
14

I have created a blank page with kakao login button. The issue still persists for IOS.
Attaching video for both ios and android
Android:

IOS:

Here is the URL to the test server
https://6abd-150-129-146-74.ngrok-free.app/kakao-test

15

Hi @tim.l
Were you able to look at the above?

16

image
image976×2104 44.7 KB

It cannot be reproduced in the URL you provided.
Could you please provide a URL that is accessible for confirmation? Additionally, could you please share the code you implemented? Thank you.

17

Hi @woody.ho
You can use this URL to test https://99dd-150-129-146-74.ngrok-free.app/kakao-test

Do you need code for the complete setup or for a specific functionality?

18

image
image1180×368 32 KB

please use SDK without wrapping with Promise.

Additionally, the Kakao.Auth.login feature, a pop-up login method, is not allowed in many in-app browsers(instagram, facebook, etc…).
We recommend that you use the Kakao.Auth.authorize method.

19

The requirement for my application is to have popup login method.
Kakao.Auth.authorize redirects to Kakao where user will complete the login process but this breaks my current sign in flow which works for other social logins.

Is there any way to fix the issue on mweb and still use popup login method?

20

Have you tried using the approach without Promises and tested it out?
There might be unexpected behavior if a popup is invoked while the user interaction is disconnected.