contact form 7 plugin 을 설치하고 컨텍폼을 생성하고 아래의 REST API endpoints 에 POST 로 메시지를 전송할 수 있습니다.
inline ad
POST http://www.yourdomain.com/wp-json/contact-form-7/v1/contact-forms/{폼 아이디}/feedback
REST API Endpoint 테스트
insomnia 라는 api test 툴을 이용하여 위의 rest api endpoints 로 데이터를 전송해보겠습니다. insomnia 는 아래 주소를 이용하여 다운로드 받을 수 있습니다.
https://insomnia.rest/download
http 메서드를 POST 를 선택하고 rest api endpoints 를 입력하고 조금 전에 생성한 contact form 입력 필드 항목 키를 입력하고 value 도 입력합니다. 입력 후 send 버튼을 누르면 전송이 되고 아래 결과값을 확인할 수 있습니다.
{
“into”: “#”,
“status”: “mail_sent”,
“message”: “안내문를 보내주셔서 감사합니다. 발송을 완료했습니다.”,
“posted_data_hash”: “46f67f570217da837b87af3bf19c63ec”
}
이제 테스트를 완료했으니 Nuxt.js 를 통해서 입력 받은 데이터를 WordPress Contact Form 으로 전송해보겠습니다. 전송 관련 메소드만 정리해보았습니다.
async send() {
const formData = new FormData()
for (let key in this.formData) {
if (this.formData.hasOwnProperty(key)) {
formData.append(key, this.formData[key])
}
}
const response = await axios.post(
'https://markettraders.kr/wp-json/contact-form-7/v1/contact-forms/3421/feedback', formData, {
headers: {
'Content-Type': 'multipart/form-data'
}
})
this.success(response.data)
return response.data
},
success(res) {
this.status = res
this.dialog = true
if (res.status === 'mail_sent') {
this.clear()
}
}
clear() {
this.$refs.form.reset()
},