/* AWS SDK 를 가져옵니다.*/
var AWS = require('aws-sdk');
AWS.config.update({region: 'us-east-1'});
var translate = new AWS.Translate();
exports.handler = function(event, context,callback){
console.log(JSON.stringify(event.body));
const response = JSON.parse(event.body)
//event.body로 POST로 받은 데이터를 받습니다.
try{
const translateParams = {
SourceLanguageCode: 'ko',
TargetLanguageCode: 'en',
Text: response.text
}
//translate SDK를 불러옵니다.
translate.translateText(translateParams, function (err, data) {
if (err) callback(err)
callback(null,{
statusCode:200,
headers: {
"Access-Control-Allow-Origin" : "*", //S3에서 요청을 할 수 있도록 허용해줍니다.
"Access-Control-Allow-Credentials" : true
},
body:data.TranslatedText
})
})
}catch(e){
callback(null,{
statusCode:200,
body:JSON.stringify(e)
})
}
};
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>번역웹사이트</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col align-self-center">
<h5 id="resultText"></h5>
<form action="javascript:void(0)">
<div class="form-group">
<label>텍스트를 입력해주세요.</label>
<textarea class="form-control" id="textInput" rows="3"></textarea>
</div>
<button onclick="sendReqeust()" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
</div>
</body>
<script type="text/javascript">
var inputSelector = document.querySelector('#textInput');
var resultText = document.querySelector('#resultText');
function sendReqeust() {
resultText.innerHTML = "로딩중..."
fetch("your-apigateway-endpoint", {
method: "POST",
body: JSON.stringify({
text:inputSelector.value
})
}).then(function (response) {
return response.text().then(function(text) {
resultText.innerHTML = text;
});
})
}
</script>
</html>
