> For the complete documentation index, see [llms.txt](https://developers-apps-in-toss.toss.im/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers-apps-in-toss.toss.im/documentation/common/growth/share/share-message.md).

# 메시지 공유

`share` 함수로 사용자가 콘텐츠를 쉽게 공유할 수 있도록, 네이티브 공유 시트를 표시할 수 있어요. 예를 들어, 초대 메시지나 텍스트 정보를 사용자가 설치된 앱 목록에서 원하는 앱(예: 메신저, 메모 앱)을 선택해서 메시지를 공유할 수 있어요. 각 플랫폼(Android, iOS)에서 기본으로 제공하는 공유 인터페이스를 활용해요.

`options.message` 속성에 공유할 메시지를 전달하면, 사용자가 선택할 수 있는 앱 목록이 표시돼요. 예를 들어, 사용자가 텍스트 메시지를 공유하거나 메모 앱에 저장하려고 할 때 유용해요.

**시그니처**

```typescript
function share(message: { message: string }): Promise<void>;
```

**파라미터**

* **options** · 필수 · `object`

  공유할 메시지를 담은 객체예요.

  * **options.message** · 필수 · `string`

    공유할 텍스트 문자열이에요. 예를 들어, "안녕하세요! 이 내용을 공유합니다."

**예제: 공유하기 기능 구현하기**

아래는 버튼을 클릭하면 메시지를 공유하는 간단한 예제예요.

{% tabs %}
{% tab title="js" %}

```js
import { share } from '@apps-in-toss/web-framework';

async function handleShare() {
  try {
    await share({ message: '공유할 메시지' });
    console.log('공유 완료');
  } catch (error) {
    console.error('공유 실패:', error);
  }
}
```

{% endtab %}

{% tab title="React" %}

```tsx
import { share } from '@apps-in-toss/web-framework';

const ShareButton = () => {
  const handleShare = async () => {
    try {
      await share({ message: '공유할 메시지' });
      console.log('공유 완료');
    } catch (error) {
      console.error('공유 실패:', error);
    }
  };

  return <button onClick={handleShare}>공유하기</button>;
};
```

{% endtab %}

{% tab title="React Native" %}

```tsx
import { share } from '@apps-in-toss/framework';
import { Button } from 'react-native';

function MyPage() {
  return <Button title="공유" onPress={() => share({ message: '공유할 메시지입니다.' })} />;
}
```

{% endtab %}
{% endtabs %}

**사용자 입력을 받아 메시지 공유하기**

사용자가 직접 입력한 메시지를 공유하도록 구현할 수도 있어요. 다음은 초대 메시지 작성 기능 예제예요.

```tsx
import { useState } from 'react';
import { TextInput, Button, View, Alert } from 'react-native';
import { share } from '@apps-in-toss/framework';

function ShareWithInput() {
  const [invitationMessage, setInvitationMessage] = useState(''); // [!code highlight]

  const handleShare = () => {
    if (!invitationMessage.trim()) {
      Alert.alert('공유할 메시지를 입력하세요.');
      return;
    }
    share({ message: invitationMessage }); // [!code highlight]
  };

  return (
    <View style={{ padding: 20 }}>
      <TextInput
        style={{
          height: 40,
          borderColor: 'gray',
          borderWidth: 1,
          marginBottom: 10,
          paddingHorizontal: 8,
        }}
        placeholder="초대 메시지를 입력하세요"
        value={invitationMessage}
        onChangeText={setInvitationMessage}
      />
      <Button title="초대 메시지 공유" onPress={handleShare} />
    </View>
  );
}
```

**예제 앱 체험하기**

[apps-in-toss-examples](https://github.com/toss/apps-in-toss-examples) 저장소에서 [with-share-text](https://github.com/toss/apps-in-toss-examples/tree/main/with-share-text) 코드를 내려받거나, 아래 QR 코드를 스캔해 직접 체험해 보세요.

QR 코드 링크: intoss\://with-share-text


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

```
GET https://developers-apps-in-toss.toss.im/documentation/common/growth/share/share-message.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
