...
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
// URL과 API Key를 설정하는 경우
'aiWriteSupporter.config': {
ai: 'gpt',
url: 'https://api.openai.com/v1/chat/completions',
apiKey: 'sk-abc123...456xyz' // 브라우저에 노출되므로 안전하지 않음
}
// URL만 설정하는 경우
'aiWriteSupporter.config': {
ai: 'gpt',
url: '/requestrequestGPT'
}
|
Naver HyperCLOVA X 설정
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
// url: HyperCLOVA X로 요청을 하도록 구현한 URL
'aiWriteSupporter.config': {
ai: 'hcx',
url: '/requestrequestHCX',
} |
Request Body 설정
API 요청 시 추가로 필요한 값들을 설정합니다.
...
| 적용된 모습 | 설정 |
|---|
|
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
| // 즐겨찾기 카테고리에 커스텀 메뉴 추가
'aiWriteSupporter.config': {
categoryConfig: {
favorites: ['my-custom-menu1', 'my-custom-menu2', 'my-custom-menu3']
},
customPrompts: [
{
key: 'my-custom-menu1',
type: 'prompt',
label: {
ko: '나의 커스텀 메뉴 1',
en: 'My custom menu'
},
prompt: {
ko: '바나나를 영어로',
en: 'banana in english',
}
},
{
key: 'my-custom-menu2',
type: 'immediately',
label: {
ko: '나의 커스텀 메뉴 2',
en: 'My custom menu'
},
prompt: {
ko: '포도를 영어로',
en: 'grape in english',
}
},
{
key: 'my-custom-menu3',
type: 'group',
label: {
ko: '내가 제일 자주쓰는 메뉴 모음',
en: 'My most used menu'
},
items: ['englishTranslation', 'tabularFormat']
}
]
} |
|
| Status |
|---|
| |
|---|
| colour | Yellow |
|---|
| title | verSion3.0 이상 |
|---|
|
생성형 이미지 AI를 연동해 자동으로 이미지를 생성하여 콘텐츠 생성을 지원하도록 했습니다.
Image Added
툴바에 버튼 추가하기
AI에게 글 작성을 요청하는 버튼을 툴바 영역, 벌룬, 바로 삽입, 메뉴 영역에 추가할 수 있습니다.
툴바에 추가
Image Added
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
//...
'editor.toolbar': [
// AI 요청하기 버튼
'openTextAI',
// AI 이미지 요청하기 버튼
'openImageAI',
// ...
],
// ... |
바로 삽입에 추가
Image Added
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
//...
'editor.quickInsert': [
// AI 요청하기 버튼
'openTextAI',
// AI 이미지 요청하기 버튼
'openImageAI, // ...
],
// ... |
URL, API Key 설정
요청을 보낼 API의 URL, API Key를 설정합니다.
URL은 OpenAI의 API 주소 (https://api.openai.com/v1/chat/completions) 또는 OpenAI의 API로 요청을 하도록 한 URL을 설정합니다.
URL은 필수 값이기 때문에 설정을 하지 않으면 툴바나 메뉴 등에 플러그인의 'AI 요청하기' 버튼이 보이지 않습니다.
API Key에는 openAI에서 발급받은 키를 설정합니다. API Key를 클라이언트에 설정하게 되면 브라우저의 개발자 도구 > 네트워크 탭에 Key 값이 노출되기 때문에 안전하지 않습니다. Key 값을 보이지 않게 감추려면 해당 설정을 사용하지 않고, 서버에서 요청을 하도록 해야 합니다.
| Code Block |
|---|
| language | js |
|---|
| theme | Emacs |
|---|
| title | synapeditor.config.js |
|---|
|
// URL과 API Key를 설정하는 경우
'aiWriteSupporter.config': {
text: {
url: 'https://api.openai.com/v1/chat/completions',
apiKey: 'sk-abc123...456xyz' // 브라우저에 노출되므로 안전하지 않음
},
image: {
url: 'https://api.openai.com/v1/images/generations',
apiKey: 'sk-abc123...456xyz' // 브라우저에 노출되므로 안전하지 않음
}
}
// URL만 설정하는 경우
'aiWriteSupporter.config': {
text: {
url: '/requestGPT'
},
image: {
url: '/requestDalle'
}
} |
플러그인 설정하기
추가로 사용 가능한 키
| Key | Type | 필수 | 기본값 | 설명 |
|---|
| areaSize | object | X | {width: 380, height: 260} | - 프롬프트 및 미리보기 창 사이즈를 설정합니다.
|