66 메일보내기-NaverCloud/Djngo/Python
66.1 Naver Outbound Mailer - 월 1000건 무료
네이버 클라우드 플랫폼에 Outbound Mailer 무료 서비스가 있습니다.
기본 특징은 대용량 및 예약 메일 전송 기능
콘텐츠 개인화
직관적인 통계 제공
수신자 그룹관리 및 조합 발송
이라고 합니다.
이 서비스를 이용하여 제 사이트에 메일보내기 기능을 추가하도록 하겠습니다.
66.2 Naver Outbound Mailer 이용신청
(cloudOutboundMailer 서비스 이용하기 위해서는
회원가입과 이용신청이 필요합니다.
네이버클라우드 플랫폼 회원가입 : https://www.ncloud.com/
cloudOutboundMailer 서비스 이용신청 : https://www.ncloud.com/product/applicationService/cloudOutboundMailer
66.3 ACCESS_KEY와 SECRET_KEY 확인하기
66.4 푸터에 메일 보내기 기능 추가 - footer.html
푸터에 추가하도록 하겠습니다.
카피라이터 부분에 pythonblog 클릭시 팝업이 나타납니다.
부트스트랩 모달을 이용하여 팝업을 만들고,
form 안에 csrf token, textarea, fn_sendmail 함수를 호출 부분을 추가합니다.
요청 url은 mailsend.do로 호출할 예정입니다.
아래 링크에서 모달과 폼 사용법을 확인 할 수 있습니다.
부트스트랩 모달: https://getbootstrap.com/docs/4.1/components/modal/#modal-components
부트스트랩 Form : https://getbootstrap.com/docs/4.1/components/forms/
footer.html 소스
<footer class="py-4 bg-light mt-auto">
<div class="container-fluid">
<div class="d-flex align-items-center justify-content-between small">
<div>Copyright © PythonBlog</a> 2021 - 2022 All rights reserved <br/>
<span>Mail : <a href="#" data-target="#mail_pop" data-toggle="modal">PYTHONBLOG</a>
</span></div>
<div>
</div>
</div>
</footer>
<div class="modal fade" id="mail_pop">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">메일보내기</h4><br/>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body form-floating">
<form name="mailForm">
{%csrf_token%}
<textarea class="form-control" rows="5" placeholder="Write mail here" id="floatingTextarea"></textarea>
<label for="floatingTextarea">주인장에게 보내는 메일입니다.</label>
</form>
</div>
<button class="btn btn-primary btn-log" onclick="fn_sendmail()">보내기</button>
<div class="modal-footer">
<button type="button" class="btn btn-dark btn-sm" data-dismiss="modal">닫기</button>
</div>
</div>
</div>
</div>
66.5 fn_sendmail 스크립트 만들기 - ncp_mail.js
static/js/ncp_mail.js 파일 생성합니다.
ajax를 이용하여 메일 보내기를 요청하고
성공/실패를 보여주는 스크립트입니다.
ncp_mail.js 소스
function fn_sendmail(){
var wordForm = new FormData();
wordForm.append('csrfmiddlewaretoken',document.mailForm.csrfmiddlewaretoken.value);
wordForm.append('mailBody', $('#floatingTextarea').val());
$.ajax({
type: "POST",
url: "https://pythonblog.co.kr/mailsend.do",
contentType: false,
processData: false,
data: wordForm,
dataType: "json",
success: function(data){
if(data.isSend.count == 1){
alert("메일 발송이 완료되었습니다.");
$('#floatingTextarea').val('');
$('.close').click();
}else{
alert("실패하였습니다. 잠시후에 다시 시도해주세요.");
}
},
error: function(request, status, error){
alert("실패하였습니다. 잠시후에 다시 시도해주세요.");
},
});
}
66.6 ncp_mail.js 인클루드 하기 - base.py
모든 페이지에서 사용되어야 하기때문에
base.py에 인클루드 합니다.
base.py 소스일부
<script src="{% static 'js/ncp_mail.js' %}"></script>
66.7 메일 보내는 API 기능 만들기 - common_views.py
공통 뷰인 common_view.py 에 기능 추가합니다.
access_key와 secret_key는 66.3 ACCESS_KEY완 SECRET_KEY 확인하기 에서 받은 KEY입니다.
templateSid는 메일 템플릿을 만들때 생성된 ID를 입력합니다.
recipients
address : 받을 사람 메일주소입니다.
parameters: 입력내용
네이버 클라우드 플랫폼에서 제공하는 가이드를 참고하시면 자세한 내용을 확인 할 수 있습니다. 네이버클라우드플랫폼 가이드 바로가기 : https://guide.ncloud-docs.com/docs/email-email-1-1
common_view.py 소스
import json
import requests
import time
import base64
import hashlib
import hmac
from django.http import HttpResponse
class NaverOutboundMailer(generic.TemplateView):
def __init__(self):
self.ncp_access_key = '회원가입 후 발급받은 키 입력'
self.ncp_secret_key = '회원가입 후 발급받은 키 입력'
self.ncp_mail_uri = 'https://mail.apigw.ntruss.com/api/v1/mails'
self.ncp_sig_uri = '/api/v1/mails'
def post(self, request, *args, **kwargs):
return self.send(request.POST['mailBody'])
def send(self, mailBody):
self.timestamp = str(int(time.time() * 1000))
result = 'N'
if self.make_signature():
try:
data = """ { "templateSid": 7696,
"recipients": [{"address": "ahnsk39@gmail.com","name": "pythonblog",
"type": "R","parameters": {"q": "%s"} }],
"individual": true,
"advertising": false
}
""" % str(mailBody)
headers = {"Content-Type":'application/json',"x-ncp-apigw-timestamp":self.timestamp,"x-ncp-iam-access-key":self.ncp_access_key,"x-ncp-apigw-signature-v2":self.signingKey}
response= requests.post(self.ncp_mail_uri, headers=headers, data=data.encode('utf-8'))
rescode = response.status_code
if(rescode==201):
result = json.loads(response.text)
except Exception as e:
print("mail send : ",e)
return HttpResponse(json.dumps({"isSend":result}), content_type="application/json")
def make_signature(self):
try:
secret_key = bytes(self.ncp_secret_key, 'UTF-8')
method = "POST"
message = method + " " + self.ncp_sig_uri + "\n" + self.timestamp + "\n"+ self.ncp_access_key
message = bytes(message, 'UTF-8')
self.signingKey = base64.b64encode(hmac.new(secret_key, message, digestmod=hashlib.sha256).digest())
return True
except Exception as e:
return False
66.8 url추가하기 - common_urls.py
view에 기능을 만들었으니, urls에 추가합시다.
common_urls.py 소스일부
path('mailsend.do', views.NaverOutboundMailer.as_view(), name="nvOutboundMailer"),
66.9 메일 템플릿 만들기 - 네이버클라우드플랫폼
네이버 클라우드 콘솔로 이동 후 위 그림과 같이 템플릿 생성 화면으로 이동합니다.
클라우드플랫폼 콘솔 바로가기 : https://console.ncloud.com/emailSVR/management
입력 박스에 내용을 넣으시면 되고,
${q} 이부분이 api를 호출하때 파라메터에 넣은 내용부분입니다.
입력내용을 다 채우고 하단의 등록 버튼을 클릭하면 ID가 생성되면
템플릿 등록이 완료된 것입니다.
${q} parameta와 ID(templateSid)는 66.7 메일 보내는 API 기능 만들기 - common_views.py 의 소스에서 확인 할 수 있습니다.
66.9.1 메일보내고 받은 메일 확인하기
66.9.2 에러수정 textarea 엔터 와 location 문제
메일 본문 입력시 엔터를 입력하면 에러가 발생하여 replace 를 추가하였습니다.
메일보내기 호출시 location.href는 문제가 있습니다.
https://pythonblog.co.kr/blog/2/ 페이지에서
메일보내기를 하면 https://pythonblog.co.kr/blog/2/mailsend.do 로
호출하여 에러가 발생합니다.
아래 소스와 같이 수정하였습니다.
wordForm.append('mailBody', $('#floatingTextarea').val().replace(/\n/g,"<br>"));
...
...
url: location.protocol+"//"+location.host+"/mailsend.do",