김대철

Merge branch 'detail' of http://khuhub.khu.ac.kr/2015104153/CafeRecommend into detail

...@@ -61,19 +61,24 @@ https://2015104153.oss2021.tk:3000 ...@@ -61,19 +61,24 @@ https://2015104153.oss2021.tk:3000
61 ``` 61 ```
62 npm install 62 npm install
63 ``` 63 ```
64 -6. 발급받은 구글 로그인 ClientID를 `index.js`, `index.ejs`, 지도 API키를 `map.ejs`에 각각 넣기 64 +6. 발급받은 구글 로그인 ClientID를 `index.js` 지도 API키를 `map.ejs`에 각각 넣기
65 ``` 65 ```
66 var CLIENT_ID = "발급받은 ClientID" // index.js 66 var CLIENT_ID = "발급받은 ClientID" // index.js
67 ``` 67 ```
68 68
69 ```HTML 69 ```HTML
70 - <meta name="google-signin-client_id" content="발급받은 ClientID"> // index.ejs
71 - ```
72 -
73 - ```HTML
74 <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=발급받은API키&libraries=services"></script> // map.ejs 70 <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=발급받은API키&libraries=services"></script> // map.ejs
75 ``` 71 ```
76 -7. MySQL connection 연결 설정 (index.js) 72 +7. Session File Store 설정 (index.js)
73 + ```
74 + session({
75 + secret: "원하는 암호",
76 + resave: false,
77 + saveUninitialized: true,
78 + store: new FileStore(),
79 + })
80 + ```
81 +8. MySQL connection 연결 설정 (index.js)
77 ``` 82 ```
78 var connection = mysql.createConnection({ 83 var connection = mysql.createConnection({
79 host: "IP주소 입력 (localhost 또는 AWS 서버 주소)", 84 host: "IP주소 입력 (localhost 또는 AWS 서버 주소)",
...@@ -82,7 +87,7 @@ https://2015104153.oss2021.tk:3000 ...@@ -82,7 +87,7 @@ https://2015104153.oss2021.tk:3000
82 database: "스키마이름 입력", 87 database: "스키마이름 입력",
83 }); 88 });
84 ``` 89 ```
85 -8. 프로그램 실행 90 +9. 프로그램 실행
86 ``` 91 ```
87 npm run start 92 npm run start
88 ``` 93 ```
......
...@@ -5,8 +5,8 @@ var bodyParser = require("body-parser"); ...@@ -5,8 +5,8 @@ var bodyParser = require("body-parser");
5 5
6 var { OAuth2Client } = require("google-auth-library"); 6 var { OAuth2Client } = require("google-auth-library");
7 7
8 -var CLIENT_ID = 8 +const CLIENT_ID =
9 - "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com"; 9 + "발급받은 ClientID";
10 var client = new OAuth2Client(CLIENT_ID); 10 var client = new OAuth2Client(CLIENT_ID);
11 var mysql = require("mysql"); 11 var mysql = require("mysql");
12 const session = require("express-session"); 12 const session = require("express-session");
...@@ -16,7 +16,7 @@ router.use(bodyParser.urlencoded({ extended: false })); //url인코딩 x ...@@ -16,7 +16,7 @@ router.use(bodyParser.urlencoded({ extended: false })); //url인코딩 x
16 router.use(bodyParser.json()); //json방식으로 파싱 16 router.use(bodyParser.json()); //json방식으로 파싱
17 router.use( 17 router.use(
18 session({ 18 session({
19 - secret: "209", // 암호화 19 + secret: "원하는 암호", // 암호화
20 resave: false, 20 resave: false,
21 saveUninitialized: true, 21 saveUninitialized: true,
22 store: new FileStore(), 22 store: new FileStore(),
...@@ -24,22 +24,22 @@ router.use( ...@@ -24,22 +24,22 @@ router.use(
24 ); 24 );
25 25
26 var connection = mysql.createConnection({ 26 var connection = mysql.createConnection({
27 - host: "localhost", 27 + host: "IP주소 입력 (localhost 또는 AWS 서버 주소)",
28 - user: "root", 28 + user: "계정 입력",
29 - password: "g79465", 29 + password: "암호 입력",
30 - database: "caferecommend", 30 + database: "스키마이름 입력",
31 }); 31 });
32 connection.connect(); 32 connection.connect();
33 33
34 /* GET home page. */ 34 /* GET home page. */
35 router.get("/", function (req, res, next) { 35 router.get("/", function (req, res, next) {
36 res.render("index", { 36 res.render("index", {
37 - d: "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com", 37 + client_id: CLIENT_ID,
38 }); 38 });
39 }); 39 });
40 router.get("/index", function (req, res, next) { 40 router.get("/index", function (req, res, next) {
41 res.render("index", { 41 res.render("index", {
42 - d: "94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com", 42 + client_id: CLIENT_ID,
43 }); 43 });
44 }); 44 });
45 45
...@@ -145,7 +145,9 @@ router.post("/login", (req, res) => { ...@@ -145,7 +145,9 @@ router.post("/login", (req, res) => {
145 connection.query(sql, parameter, function (err) { 145 connection.query(sql, parameter, function (err) {
146 if (err) { 146 if (err) {
147 console.log(err); 147 console.log(err);
148 - return res.render("/"); 148 + return res.render("/", {
149 + client_id: CLIENT_ID,
150 + });
149 } else { 151 } else {
150 console.log("새로운 user데이터 입력"); 152 console.log("새로운 user데이터 입력");
151 } 153 }
...@@ -162,7 +164,9 @@ router.post("/login", (req, res) => { ...@@ -162,7 +164,9 @@ router.post("/login", (req, res) => {
162 connection.query(sql2, parameter2, function (err) { 164 connection.query(sql2, parameter2, function (err) {
163 if (err) { 165 if (err) {
164 console.log(err); 166 console.log(err);
165 - return res.render("/"); 167 + return res.render("/",{
168 + client_id: CLIENT_ID,
169 + });
166 } else { 170 } else {
167 console.log("새로운 PREFERENCE데이터 입력"); 171 console.log("새로운 PREFERENCE데이터 입력");
168 } 172 }
...@@ -207,7 +211,9 @@ router.get("/map", function (req, res, next) { ...@@ -207,7 +211,9 @@ router.get("/map", function (req, res, next) {
207 if (req.session.user) { 211 if (req.session.user) {
208 res.render("map", { user: req.session.user }); 212 res.render("map", { user: req.session.user });
209 } else { 213 } else {
210 - res.render("/"); 214 + res.render("/",{
215 + client_id: CLIENT_ID,
216 + });
211 } 217 }
212 }); 218 });
213 219
......
1 +{"cookie":{"originalMaxAge":null,"expires":null,"httpOnly":true,"path":"/"},"__lastAccess":1622998584246,"user":{"email":"cjm104174@gmail.com","picture":"https://lh3.googleusercontent.com/a-/AOh14Gh3nytGsPbviGhkznR8HIwrL6o7xBIoFL08nIeU=s96-c","nickname":"Mayf","age":25,"gender":"male"}}
...\ No newline at end of file ...\ No newline at end of file
...@@ -3,22 +3,12 @@ ...@@ -3,22 +3,12 @@
3 <head> 3 <head>
4 <meta charset="UTF-8" /> 4 <meta charset="UTF-8" />
5 <script src="https://apis.google.com/js/platform.js" async defer></script> 5 <script src="https://apis.google.com/js/platform.js" async defer></script>
6 - <meta
7 - name="google-signin-client_id"
8 - content="94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com"
9 - />
10 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
11 - <title>first</title> 7 + <title>Cafe Map</title>
12 - <link 8 + <meta name="google-signin-client_id" content=<%=client_id%>>
13 - rel="stylesheet" 9 + <meta name="viewport" content="width=device-width, initial-scale=1.0">
14 - href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" 10 + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" integrity="undefined" crossorigin="anonymous">
15 - integrity="undefined" 11 + <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@700&display=swap" rel="stylesheet">
16 - crossorigin="anonymous"
17 - />
18 - <link
19 - href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@700&display=swap"
20 - rel="stylesheet"
21 - />
22 12
23 <style> 13 <style>
24 img { 14 img {
...@@ -59,9 +49,6 @@ ...@@ -59,9 +49,6 @@
59 49
60 <body> 50 <body>
61 <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> 51 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
62 - <a class="navbar-brand" href="/"
63 - ><img src="images/home.png" width="40" height="40" alt="" />
64 - </a>
65 <button 52 <button
66 class="navbar-toggler" 53 class="navbar-toggler"
67 type="button" 54 type="button"
...@@ -106,9 +93,26 @@ ...@@ -106,9 +93,26 @@
106 button 93 button
107 </div> 94 </div>
108 <br /><br /> 95 <br /><br />
96 +</head>
97 +
98 +<body>
99 +<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
100 +
101 + <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
102 + <span class="navbar-toggler-icon"></span>
103 + </button>
104 + <div class="collapse navbar-collapse" id="navbarSupportedContent">
105 + <a class="navbar-brand" href="/" style="margin-left: 10px"><strong>Home</strong></a>
109 </div> 106 </div>
110 </body> 107 </body>
111 108
109 + <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
110 + <script
111 + src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js"
112 + integrity="undefined"
113 + crossorigin="anonymous"
114 + ></script>
115 +
112 <script> 116 <script>
113 function onSignIn(googleUser) { 117 function onSignIn(googleUser) {
114 var id_token = googleUser.getAuthResponse().id_token; 118 var id_token = googleUser.getAuthResponse().id_token;
...@@ -124,11 +128,11 @@ ...@@ -124,11 +128,11 @@
124 }; 128 };
125 xhr.send(JSON.stringify({ token: id_token })); 129 xhr.send(JSON.stringify({ token: id_token }));
126 } 130 }
131 + function signOut() {
132 + var auth2 = gapi.auth2.getAuthInstance();
133 + auth2.signOut().then(function () {
134 + console.log("User signed out.");
135 + });
136 + }
127 </script> 137 </script>
128 - <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
129 - <script
130 - src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js"
131 - integrity="undefined"
132 - crossorigin="anonymous"
133 - ></script>
134 </html> 138 </html>
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
4 <meta charset="UTF-8" /> 4 <meta charset="UTF-8" />
5 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6 6
7 - <title>logined</title> 7 + <title>Sign Up</title>
8 8
9 <link 9 <link
10 rel="stylesheet" 10 rel="stylesheet"
...@@ -37,30 +37,15 @@ ...@@ -37,30 +37,15 @@
37 h5 { 37 h5 {
38 font-family: "Noto Sans KR", sans-serif; 38 font-family: "Noto Sans KR", sans-serif;
39 } 39 }
40 - .middle {
41 - display: inline-block;
42 - vertical-align: middle;
43 - }
44 </style> 40 </style>
45 </head> 41 </head>
46 <body> 42 <body>
47 <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> 43 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
48 - <a class="navbar-brand" href="/" 44 + <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
49 - ><img src="images/home.png" width="40" height="40" alt="" />
50 - </a>
51 - <button
52 - class="navbar-toggler"
53 - type="button"
54 - data-toggle="collapse"
55 - data-target="#navbarSupportedContent"
56 - aria-controls="navbarSupportedContent"
57 - aria-expanded="false"
58 - aria-label="Toggle navigation"
59 - >
60 <span class="navbar-toggler-icon"></span> 45 <span class="navbar-toggler-icon"></span>
61 </button> 46 </button>
62 <div class="collapse navbar-collapse" id="navbarSupportedContent"> 47 <div class="collapse navbar-collapse" id="navbarSupportedContent">
63 - <a class="navbar-brand" href="/"><strong>Home</strong></a> 48 + <a class="navbar-brand" href="/" style="margin-left: 10px"><strong>Home</strong></a>
64 <ul class="navbar-nav mr-auto mt-2 mt-lg-0"> 49 <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
65 <li class="nav-item active"> 50 <li class="nav-item active">
66 <a 51 <a
......
...@@ -9,9 +9,6 @@ ...@@ -9,9 +9,6 @@
9 /> 9 />
10 <title>Cafe Map</title> 10 <title>Cafe Map</title>
11 <style> 11 <style>
12 - .navbar {
13 - background-color: #1d2124 !important;
14 - }
15 .btn-primary { 12 .btn-primary {
16 color: white !important; 13 color: white !important;
17 } 14 }
...@@ -103,9 +100,6 @@ ...@@ -103,9 +100,6 @@
103 </head> 100 </head>
104 <body> 101 <body>
105 <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> 102 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
106 - <a class="navbar-brand" href="/"
107 - ><img src="images/home.png" width="40" height="40" alt="" />
108 - </a>
109 <button 103 <button
110 class="navbar-toggler" 104 class="navbar-toggler"
111 type="button" 105 type="button"
...@@ -118,7 +112,7 @@ ...@@ -118,7 +112,7 @@
118 <span class="navbar-toggler-icon"></span> 112 <span class="navbar-toggler-icon"></span>
119 </button> 113 </button>
120 <div class="collapse navbar-collapse" id="navbarSupportedContent"> 114 <div class="collapse navbar-collapse" id="navbarSupportedContent">
121 - <a class="navbar-brand" href="/"><strong>Home</strong></a> 115 + <a class="navbar-brand" href="/" style="margin-left: 10px"><strong>Home</strong></a>
122 <ul class="navbar-nav mr-auto mt-2 mt-lg-0"> 116 <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
123 <li class="nav-item active"> 117 <li class="nav-item active">
124 <a 118 <a
...@@ -142,7 +136,7 @@ ...@@ -142,7 +136,7 @@
142 > 136 >
143 </li> 137 </li>
144 <li class="nav-item active"> 138 <li class="nav-item active">
145 - <a class="nav-link" style="color: #ffffff" href="/recommend" 139 + <a class="nav-link" style="color: #ffffff" href="javascript:void(0);" onclick="recommend();"
146 >Recommend 140 >Recommend
147 <span class="sr-only">(current)</span> 141 <span class="sr-only">(current)</span>
148 </a> 142 </a>
...@@ -174,10 +168,7 @@ ...@@ -174,10 +168,7 @@
174 <p id="recommend"></p> 168 <p id="recommend"></p>
175 </section> 169 </section>
176 170
177 - <script 171 + <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=발급받은API키&libraries=services"></script>
178 - type="text/javascript"
179 - src="//dapi.kakao.com/v2/maps/sdk.js?appkey=68cbccbcd6f0fef0a213e62ad37393ee&libraries=services"
180 - ></script>
181 <script> 172 <script>
182 var lat = ""; 173 var lat = "";
183 var lon = ""; 174 var lon = "";
...@@ -206,6 +197,7 @@ ...@@ -206,6 +197,7 @@
206 click = true; 197 click = true;
207 removeMarker(); 198 removeMarker();
208 searchPlaces(); 199 searchPlaces();
200 + alert("추천이 활성화 되었습니다.");
209 } 201 }
210 } // 추천 기능 비활성화 202 } // 추천 기능 비활성화
211 else { 203 else {
...@@ -214,16 +206,16 @@ ...@@ -214,16 +206,16 @@
214 click = false; 206 click = false;
215 removeMarker(); 207 removeMarker();
216 searchPlaces(); 208 searchPlaces();
209 + alert("추천이 비활성화 되었습니다.");
217 } 210 }
218 }, 211 },
219 }); 212 });
220 } 213 }
221 -
222 // 지도 기본설정 214 // 지도 기본설정
223 var mapContainer = document.getElementById("map"), 215 var mapContainer = document.getElementById("map"),
224 mapOption = { 216 mapOption = {
225 center: new kakao.maps.LatLng(36.2477502, 127.078164), 217 center: new kakao.maps.LatLng(36.2477502, 127.078164),
226 - level: 3, 218 + level: 12,
227 }; 219 };
228 var map = new kakao.maps.Map(mapContainer, mapOption); 220 var map = new kakao.maps.Map(mapContainer, mapOption);
229 var ps = new kakao.maps.services.Places(map); 221 var ps = new kakao.maps.services.Places(map);
...@@ -376,7 +368,7 @@ ...@@ -376,7 +368,7 @@
376 ' <span class="tel">' + 368 ' <span class="tel">' +
377 place.phone + 369 place.phone +
378 "</span>" + 370 "</span>" +
379 - `<a href="/review/${place.id}"><button>후기 작성</button>`; 371 + `<a href="/review/${place.id}"><button type="button" class="btn btn-outline-danger" style="font-size:70%;">후기 작성</button>`;
380 "</div>" + '<div class="after"></div>'; 372 "</div>" + '<div class="after"></div>';
381 contentNode.innerHTML = content; 373 contentNode.innerHTML = content;
382 placeOverlay.setPosition(new kakao.maps.LatLng(place.y, place.x)); 374 placeOverlay.setPosition(new kakao.maps.LatLng(place.y, place.x));
......
...@@ -33,17 +33,11 @@ ...@@ -33,17 +33,11 @@
33 h5 { 33 h5 {
34 font-family: "Noto Sans KR", sans-serif; 34 font-family: "Noto Sans KR", sans-serif;
35 } 35 }
36 - .middle { 36 +
37 - display: inline-block;
38 - vertical-align: middle;
39 - }
40 </style> 37 </style>
41 </head> 38 </head>
42 <body> 39 <body>
43 <nav class="navbar navbar-expand-lg navbar-dark bg-dark"> 40 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
44 - <a class="navbar-brand" href="/"
45 - ><img src="/images/home.png" width="40" height="40" alt="" />
46 - </a>
47 <button 41 <button
48 class="navbar-toggler" 42 class="navbar-toggler"
49 type="button" 43 type="button"
...@@ -56,7 +50,7 @@ ...@@ -56,7 +50,7 @@
56 <span class="navbar-toggler-icon"></span> 50 <span class="navbar-toggler-icon"></span>
57 </button> 51 </button>
58 <div class="collapse navbar-collapse" id="navbarSupportedContent"> 52 <div class="collapse navbar-collapse" id="navbarSupportedContent">
59 - <a class="navbar-brand" href="/"><strong>Home</strong></a> 53 + <a class="navbar-brand" href="/" style="margin-left: 10px"><strong>Home</strong></a>
60 </div> 54 </div>
61 </nav> 55 </nav>
62 56
......