생성형 이미지 AI DALL-E를 연동해 자동으로 이미지를 생성하여 콘텐츠 생성을 지원합니다.


툴바에 버튼 추가하기

AI에게 이미지를 요청하는 버튼을 툴바 영역, 벌룬, 바로 삽입, 메뉴 영역에 추가할 수 있습니다.

툴바에 추가 

//...
'editor.toolbar': [
	// AI 이미지 요청하기 버튼
    'openImageAI',
    // ...
],
// ...


바로 삽입에 추가

//...
'editor.quickInsert': [
	// AI 이미지 요청하기 버튼
    'openImageAI',
    // ...
],
// ...


config 설정

AI 글 작성 도우미 플러그인을 3.0.0 버전 이상에서 사용하려면 아래와 같이 설정해 주셔야 합니다.

// URL과 API Key를 설정하는 경우
'aiWriteSupporter.config': {
	image: {
		url: 'https://api.openai.com/v1/images/generations',
		apiKey: 'sk-abc123...456xyz', // 브라우저에 노출되므로 안전하지 않음
		//...
	}
}

// URL만 설정하는 경우
'aiWriteSupporter.config': {
	image: {
		url: '/request',
		//...
	}
}

사용 가능한 키 (image 객체에 설정)

KeyType필수기본값설명
urlstringO''
  • 요청을 보낼 URL을 설정합니다.
    • OpenAI의 API 주소
    • OpenAI의 API로 요청을 하도록 구현한 URL
  • 설정이 되지 않으면 툴바에 플러그인 버튼이 표시되지 않습니다.
apiKeystring
''
  • OpenAI에서 발급받은 API Key를 설정합니다.
  • 해당 설정을 사용하게 되면 브라우저에 Key 값이 노출되기 때문에, Key 값을 설정하지 않고 서버를 통해 요청을 할 수 있도록 하는 것이 안전합니다. 
areaSizeObject

{ width: '300px', height: '340px' }

  • 프롬프트 및 미리보기 창 기본 사이즈를 설정합니다. (단위: px)
  • 최소 사이즈 이하로 설정 시 최소 사이즈로 표현됩니다.
    • 최소 사이즈: { width: '230px', height: '120px' }

프롬프트 및 미리보기 창 기본 사이즈 설정

프롬프트와 미리보기 화면이 나타날 크기를 설정할 수 있습니다. 설정을 하지 않으면 기본값({ width: '300px', height: '340px' })이 적용됩니다.

'aiWriteSupporter.config': {
	image: {
		url: '/request',
		areaSize: { width: '550px', height: '220px' }
		//...
	}
}


areaSize 설정을 하지 않았을 때areaSize 설정을 했을 때
  • 기본 값으로 ({ width: '300px', height: '340px' }) 크기가 설정되어 프롬프트와 미리보기 화면이 타납니다.
  • 설정한 값으로({ width: '550px', height: '220px' } ) 크기가 설정되어 프롬프트와 미리보기 화면이 나타납니다.