김대철 / CafeRecommend

Go to a project
Toggle navigation Toggle navigation pinning
김대철
0e470a87 1 parent 8dc87a62

카페 후기정보 등록 API 작성 

index.js comment 정보 입력 후 테이블 저장 구현
Inline Side-by-side
Showing 4 changed files with 308 additions and 250 deletions
var express = require("express");
var router = express.Router();
var request = require("request");
var bodyParser = require("body-parser");
var { OAuth2Client } = require("google-auth-library");
var querystring = require("querystring");
var CLIENT_ID =
"94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com";
......@@ -13,15 +11,18 @@ var client = new OAuth2Client(CLIENT_ID);
var mysql = require("mysql");
var session = require("express-session");
var FileStore = require("session-file-store")(session);
router.use(bodyParser.urlencoded({ extended: false })); //url인코딩 x
router.use(bodyParser.json()); //json방식으로 파
router.use(bodyParser.json()); //json방식으로 파싱
router.use(
session({
secret: "209", // 암호화
resave: false,
saveUninitialized: true,
store: new FileStore(),
}))
})
);
var connection = mysql.createConnection({
host: "localhost",
user: "root",
......@@ -29,6 +30,7 @@ var connection = mysql.createConnection({
database: "caferecommend",
});
connection.connect();
/* GET home page. */
router.get("/", function (req, res, next) {
res.render("index", {
......@@ -49,7 +51,7 @@ router.post("/index", (req, res) => {
audience: CLIENT_ID, // Specify the CLIENT_ID of the app that accesses the backend
});
const payload = ticket.getPayload();
const userid = payload['sub']
const userid = payload["sub"];
}
verify()
.then(() => {
......@@ -61,7 +63,7 @@ router.post("/index", (req, res) => {
router.get("/login", checkAuthenticated, (req, res) => {
let user = req.user;
req.session.user=user;
req.session.user = user;
var sql = "SELECT * FROM USER WHERE EMAIL=?";
var parameter = [req.session.user.email];
connection.query(sql, parameter, function (err, row) {
......@@ -111,7 +113,7 @@ router.post("/login", (req, res) => {
req.session.user.age,
req.session.user.gender,
];
connection.query(sql, parameter, function (err, row) {
connection.query(sql, parameter, function (err) {
if (err) {
console.log(err);
} else {
......@@ -123,8 +125,6 @@ router.post("/login", (req, res) => {
});
});
module.exports = router;
function checkAuthenticated(req, res, next) {
let token = req.cookies["session-token"];
let user = {};
......@@ -158,3 +158,34 @@ router.get("/logout", function (req, res) {
req.session.destroy(); //세션비우기
res.redirect("/");
});
// 카페 후기 등록
router.post("/comment", function (req, res) {
var cafeId = req.body.cafeId;
var price = req.body.price;
var kindness = req.body.kindness;
var noise = req.body.noise;
var accessibility = req.body.accessibility;
// 입력받지 않은 데이터가 하나라도 존재 (카페아이디는 후기작성시 자동으로 받아옴)
if (!price || !kindness || !noise || !accessibility) {
console.log("입력받지 않은 데이터 존재");
return; // 후기작성으로 다시 이동
}
var sql =
"INSERT INTO COMMENT(CAFE_ID, PRICE, KINDNESS, NOISE, ACCESSIBILITY) VALUES(?,?,?,?,?)";
var parameter = [cafeId, price, kindness, noise, accessibility];
connection.query(sql, parameter, function (err) {
if (err) {
console.log(err);
} else {
console.log("새로운 comment 데이터 입력");
}
});
return res.render("map");
});
module.exports = router;
......
{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"__lastAccess":1621766908867,"user":{"name":"‍김대철[학생](소프트웨어융합대학 컴퓨터공학과)","email":"kdc9619@khu.ac.kr","nickname":"Meerkat","age":"26","gender":"male"}}
\ No newline at end of file
{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"__lastAccess":1621952163379}
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="stylesheets/bootstrap.css">
<title>Cafe Map</title>
<style>
.navbar{
background-color: #1d2124 !important;
}
.btn-primary{
color : white !important;
}
p{font-family: 'Noto Sans KR', sans-serif;}
h1{font-family: 'Noto Sans KR', sans-serif;}
h4{font-family: 'Noto Sans KR', sans-serif;}
h2{font-family: 'Noto Sans KR', sans-serif;}
h3{font-family: 'Noto Sans KR', sans-serif;}
h5{font-family: 'Noto Sans KR', sans-serif;}
.placeinfo_wrap {
position: absolute;
bottom: 28px;
left: -150px;
width: 300px;
}
.placeinfo {
position: relative;
width: 100%;
border-radius: 6px;
border: 1px solid #ccc;
border-bottom: 2px solid #ddd;
padding-bottom: 10px;
background: #fff;
}
.placeinfo:nth-of-type(n) {
border: 0;
box-shadow: 0px 1px 2px #888;
}
.placeinfo_wrap .after {
content: "";
position: relative;
margin-left: -12px;
left: 50%;
width: 22px;
height: 12px;
background: url("https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png");
}
.placeinfo a,
.placeinfo a:hover,
.placeinfo a:active {
color: #fff;
text-decoration: none;
}
.placeinfo a,
.placeinfo span {
display: block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.placeinfo span {
margin: 5px 5px 0 5px;
cursor: default;
font-size: 13px;
}
.placeinfo .title {
font-weight: bold;
font-size: 14px;
border-radius: 6px 6px 0 0;
margin: -1px -1px 0 -1px;
padding: 10px;
color: #fff;
background: #d95050;
background: #d95050
url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/arrow_white.png)
no-repeat right 14px center;
}
.placeinfo .tel {
color: #0f7833;
}
.placeinfo .jibun {
color: #999;
font-size: 11px;
margin-top: 0;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="/"><img src="images/home.png" width="40" height="40" alt="">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<a class="navbar-brand" href="/" ><strong>Home</strong></a>
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<head>
<link rel="stylesheet" href="stylesheets/bootstrap.css" />
<title>Cafe Map</title>
<style>
.navbar {
background-color: #1d2124 !important;
}
.btn-primary {
color: white !important;
}
p {
font-family: "Noto Sans KR", sans-serif;
}
h1 {
font-family: "Noto Sans KR", sans-serif;
}
h4 {
font-family: "Noto Sans KR", sans-serif;
}
h2 {
font-family: "Noto Sans KR", sans-serif;
}
h3 {
font-family: "Noto Sans KR", sans-serif;
}
h5 {
font-family: "Noto Sans KR", sans-serif;
}
.placeinfo_wrap {
position: absolute;
bottom: 28px;
left: -150px;
width: 300px;
}
.placeinfo {
position: relative;
width: 100%;
border-radius: 6px;
border: 1px solid #ccc;
border-bottom: 2px solid #ddd;
padding-bottom: 10px;
background: #fff;
}
.placeinfo:nth-of-type(n) {
border: 0;
box-shadow: 0px 1px 2px #888;
}
.placeinfo_wrap .after {
content: "";
position: relative;
margin-left: -12px;
left: 50%;
width: 22px;
height: 12px;
background: url("https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/vertex_white.png");
}
.placeinfo a,
.placeinfo a:hover,
.placeinfo a:active {
color: #fff;
text-decoration: none;
}
.placeinfo a,
.placeinfo span {
display: block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.placeinfo span {
margin: 5px 5px 0 5px;
cursor: default;
font-size: 13px;
}
.placeinfo .title {
font-weight: bold;
font-size: 14px;
border-radius: 6px 6px 0 0;
margin: -1px -1px 0 -1px;
padding: 10px;
color: #fff;
background: #d95050;
background: #d95050
url(https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/arrow_white.png)
no-repeat right 14px center;
}
.placeinfo .tel {
color: #0f7833;
}
.placeinfo .jibun {
color: #999;
font-size: 11px;
margin-top: 0;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="/"
><img src="images/home.png" width="40" height="40" alt="" />
</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<a class="navbar-brand" href="/"><strong>Home</strong></a>
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
<li class="nav-item active">
<a
class="nav-link"
style="color: #ffffff"
href="/"
onclick="signOut();"
>Logout<span class="sr-only">(current)</span></a
>
</li>
</ul>
</div>
</nav>
<div class="pricing-header px-3 py-1 pt-md-3 pb-md-1 mx-auto text-center">
<h3 class="display-6 font-weight-bold">Map</h3>
</div>
<li class="nav-item active">
<a class="nav-link" style="color:#ffffff" href="/" onclick="signOut();">Logout<span class="sr-only">(current)</span></a>
</li>
</ul>
</div>
</nav>
<div class="pricing-header px-3 py-1 pt-md-3 pb-md-1 mx-auto text-center">
<h3 class="display-6 font-weight-bold" >Map</h3>
</div>
<div id="map" style="width: 100%; height: 575px"></div>
<script
type="text/javascript"
src="//dapi.kakao.com/v2/maps/sdk.js?appkey=68cbccbcd6f0fef0a213e62ad37393ee&libraries=services"
></script>
<script>
var lat = "";
var lon = "";
var placeOverlay = new kakao.maps.CustomOverlay({ zIndex: 1 });
var contentNode = document.createElement("div");
var markers = [];
var currCategory = "CE7"; // 카테고리코드: 카페
var order = 1;
var mapContainer = document.getElementById("map"),
mapOption = {
center: new kakao.maps.LatLng(36.2477502, 127.078164),
level: 3,
};
var map = new kakao.maps.Map(mapContainer, mapOption);
var ps = new kakao.maps.services.Places(map);
kakao.maps.event.addListener(map, "idle", searchPlaces);
contentNode.className = "placeinfo_wrap";
addEventHandle(contentNode, "mousedown", kakao.maps.event.preventMap);
addEventHandle(contentNode, "touchstart", kakao.maps.event.preventMap);
placeOverlay.setContent(contentNode);
function addEventHandle(target, type, callback) {
if (target.addEventListener) {
target.addEventListener(type, callback);
} else {
target.attachEvent("on" + type, callback);
}
}
placeOverlay.setContent(contentNode);
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
lat = position.coords.latitude;
lon = position.coords.longitude;
var locPosition = new kakao.maps.LatLng(lat, lon);
displayCurrentPosition(locPosition);
});
} else {
var locPosition = new kakao.maps.LatLng(36.2477502, 127.078164);
displayCurrentPosition(locPosition);
}
function displayCurrentPosition(locPosition) {
map.setCenter(locPosition);
}
kakao.maps.event.addListener(map, "idle", searchPlaces);
function searchPlaces() {
if (!currCategory) {
return;
}
placeOverlay.setMap(null);
ps.categorySearch(currCategory, placesSearchCB, { usemapBounds: true });
}
function placesSearchCB(data, status, pagination) {
if (status === kakao.maps.services.Status.OK) {
displayPlaces(data);
}
}
function displayPlaces(places) {
for (var i = 0; i < places.length; i++) {
var marker = addMarker(
new kakao.maps.LatLng(places[i].y, places[i].x),
order
);
(function (marker, place) {
kakao.maps.event.addListener(marker, "click", function () {
displayPlaceInfo(place);
<div id="map" style="width: 100%; height: 575px"></div>
<script
type="text/javascript"
src="//dapi.kakao.com/v2/maps/sdk.js?appkey=68cbccbcd6f0fef0a213e62ad37393ee&libraries=services"
></script>
<script>
var lat = "";
var lon = "";
var placeOverlay = new kakao.maps.CustomOverlay({ zIndex: 1 });
var contentNode = document.createElement("div");
var markers = [];
var currCategory = "CE7"; // 카테고리코드: 카페
var order = 1;
var mapContainer = document.getElementById("map"),
mapOption = {
center: new kakao.maps.LatLng(36.2477502, 127.078164),
level: 3,
};
var map = new kakao.maps.Map(mapContainer, mapOption);
var ps = new kakao.maps.services.Places(map);
kakao.maps.event.addListener(map, "idle", searchPlaces);
contentNode.className = "placeinfo_wrap";
addEventHandle(contentNode, "mousedown", kakao.maps.event.preventMap);
addEventHandle(contentNode, "touchstart", kakao.maps.event.preventMap);
placeOverlay.setContent(contentNode);
function addEventHandle(target, type, callback) {
if (target.addEventListener) {
target.addEventListener(type, callback);
} else {
target.attachEvent("on" + type, callback);
}
}
placeOverlay.setContent(contentNode);
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
lat = position.coords.latitude;
lon = position.coords.longitude;
var locPosition = new kakao.maps.LatLng(lat, lon);
displayCurrentPosition(locPosition);
});
})(marker, places[i]);
}
}
function addMarker(position, order) {
var imageSrc =
"https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/places_category.png";
var imageSize = new kakao.maps.Size(27, 30);
var imgOptions = {
spriteSize: new kakao.maps.Size(72, 220),
spriteOrigin: new kakao.maps.Point(46, 150),
offset: new kakao.maps.Point(11, 28),
};
var markerImage = new kakao.maps.MarkerImage(
imageSrc,
imageSize,
imgOptions
);
var marker = new kakao.maps.Marker({
position: position,
image: markerImage,
});
marker.setMap(map);
markers.push(marker);
return marker;
}
function displayPlaceInfo(place) {
var content =
'<div class="placeinfo">' +
' <a class="title" href="' +
place.place_url +
'" target="_blank" title="' +
place.place_name +
} else {
var locPosition = new kakao.maps.LatLng(36.2477502, 127.078164);
displayCurrentPosition(locPosition);
}
function displayCurrentPosition(locPosition) {
map.setCenter(locPosition);
}
kakao.maps.event.addListener(map, "idle", searchPlaces);
function searchPlaces() {
if (!currCategory) {
return;
}
placeOverlay.setMap(null);
ps.categorySearch(currCategory, placesSearchCB, { usemapBounds: true });
}
function placesSearchCB(data, status, pagination) {
if (status === kakao.maps.services.Status.OK) {
displayPlaces(data);
}
}
function displayPlaces(places) {
for (var i = 0; i < places.length; i++) {
var marker = addMarker(
new kakao.maps.LatLng(places[i].y, places[i].x),
order
);
(function (marker, place) {
kakao.maps.event.addListener(marker, "click", function () {
displayPlaceInfo(place);
});
})(marker, places[i]);
}
}
function addMarker(position, order) {
var imageSrc =
"https://t1.daumcdn.net/localimg/localimages/07/mapapidoc/places_category.png";
var imageSize = new kakao.maps.Size(27, 30);
var imgOptions = {
spriteSize: new kakao.maps.Size(72, 220),
spriteOrigin: new kakao.maps.Point(46, 150),
offset: new kakao.maps.Point(11, 28),
};
var markerImage = new kakao.maps.MarkerImage(
imageSrc,
imageSize,
imgOptions
);
var marker = new kakao.maps.Marker({
position: position,
image: markerImage,
});
marker.setMap(map);
markers.push(marker);
return marker;
}
function displayPlaceInfo(place) {
var content =
'<div class="placeinfo">' +
' <a class="title" href="' +
place.place_url +
'" target="_blank" title="' +
place.place_name +
'">' +
place.place_name +
"</a>";
if (place.road_address_name) {
content +=
' <span title="' +
place.road_address_name +
'">' +
place.place_name +
"</a>";
if (place.road_address_name) {
content +=
' <span title="' +
place.road_address_name +
'">' +
place.road_address_name +
"</span>" +
' <span class="jibun" title="' +
place.address_name +
'">(지번 : ' +
place.address_name +
")</span>";
} else {
content +=
' <span title="' +
place.address_name +
'">' +
place.address_name +
"</span>";
}
content +=
' <span class="tel">' +
place.phone +
place.road_address_name +
"</span>" +
"</div>" +
'<div class="after"></div>';
contentNode.innerHTML = content;
placeOverlay.setPosition(new kakao.maps.LatLng(place.y, place.x));
placeOverlay.setMap(map);
}
</script>
<script src="javascripts/bootstrap.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</body>
' <span class="jibun" title="' +
place.address_name +
'">(지번 : ' +
place.address_name +
")</span>";
} else {
content +=
' <span title="' +
place.address_name +
'">' +
place.address_name +
"</span>";
}
content +=
' <span class="tel">' +
place.phone +
"</span>" +
"</div>" +
'<div class="after"></div>';
contentNode.innerHTML = content;
placeOverlay.setPosition(new kakao.maps.LatLng(place.y, place.x));
placeOverlay.setMap(map);
}
</script>
<script src="javascripts/bootstrap.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
</body>
</html>
......