# Wix 웹사이트 회원 연동 가이드

나만의 Wix 웹사이트에 사용자들이 로그인할 경우 스윙투앱 앱과의 상호 연동을 위해서

필요한 작업들을 소개하도록 하겠습니다.

회원연동을 완료하면 스윙투앱 콘솔에서 웹사이트의 회원을 조회할 수 있으며

연동된 회원을 통해서 웹사이트의 개별 회원에게 푸시 메시지를 발송할 수 있습니다.

## 1. 회원연동 가이드

### 1.1 Wix Dashboard 이동 하기

<figure><img src="/files/m6PQgLme3HhRbrbyMIbV" alt=""><figcaption><p>Wix 콘솔화면</p></figcaption></figure>

### 1.2 홈화면에 Embed HTML 요소 삽입하기

<figure><img src="/files/BMEpSa7C4YkoZrPsuu3B" alt=""><figcaption><p>Wix 콘솔화면 </p></figcaption></figure>

### 1.3 HTML 요소에 소스 삽입하기

<figure><img src="/files/WAaxOG05kSxHY0RNuDA2" alt=""><figcaption><p>Wix 콘솔화면 </p></figcaption></figure>

(1) 번 영역에 아래의 코드를 삽입하기

{% code title="HTML 요소 코드" lineNumbers="true" %}

```html
<script src="https://pcdn2.swing2app.co.kr/swing_public_src/v3/2022_06_17_001/js/swing_app_on_web.js"></script>

<script>
 window.onmessage = (event) => {
    if (event.data) {
       let receivedData = event.data;
      	console.log('login account : ' + receivedData.id + ',' + receivedData.name);
      swingWebViewPlugin.app.login.doAppLogin(receivedData.id,receivedData.name);
    }
  };
  
</script>

```

{% endcode %}

### 1.4 HTML 요소에 아이디를 부여하기

<figure><img src="/files/yww0x1NoAARZo16DAkXJ" alt=""><figcaption><p>Wix 콘솔화면 </p></figcaption></figure>

(1) 생성한 HTML 요소에 ID 를 부여하기&#x20;

&#x20;   다음의 아이디로 반드시 부여해주세요 ID 값 swing2appLogin

### 1.5 페이지 코드 삽입하기 ( 최종단계 )

<figure><img src="/files/I3jiXnA6RtF24Ok8Lrry" alt=""><figcaption><p>Wix 콘솔화면 </p></figcaption></figure>

(1) Home 화면 클릭후 (2) 번 항목 소스 영역에 아래의 코드를 삽입

아래의 코드를 삽입하였다면 모든 작업이 완료되었습니다.

저장후 배포를 하시면 정상 동작할 것입니다.

{% code title="Wix Home 화면에 삽입할 코드" lineNumbers="true" %}

```javascript
import wixUsers from 'wix-users';
import { currentMember } from 'wix-members-frontend';
$w.onReady(function () {
    if (wixUsers.currentUser.loggedIn) {
        currentMember.getMember('FULL')
            .then((member) => {
                const id = member._id;
                const fullName = `${member.contactDetails.firstName} ${member.contactDetails.lastName}`;
                $w("#swing2appLogin").postMessage({
                    id : id ,
                    name : fullName
                });
                return member;
            })
            .catch((error) => {
                console.error(error);
            });
    }
    else{
        console.log('guest login');
        $w("#swing2appLogin").postMessage({
            id : null ,
            name : null
        });
    }
});

```

{% endcode %}

### 1.6 회원연동 확인 작업

&#x20;     연동 작업을 모두 진행하셨다면 앱으로 웹사이트를 실행후 스윙투앱 콘솔화면 접속 후에

&#x20;     푸시&회원 -> 회원조회 화면에 들어가서 웹사이트 회원이 조회가 되는지 확인된다면&#x20;

&#x20;     정상적으로 연동된 것입니다.

<figure><img src="/files/AyTIofgG7kI8DQBoezTQ" alt=""><figcaption><p>스윙투앱 콘솔화면에서 Wix 회원 연동이 확인된 화면</p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://documentation.swing2app.co.kr/developer/webview/user-integration/wix.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
