Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
search-page
Commits
90d3d8ee
Commit
90d3d8ee
authored
Jan 27, 2021
by
Lee SeoYeon
Browse files
..
parent
a0df9bdf
Changes
18
Expand all
Show whitespace changes
Inline
Side-by-side
client/.eslintcache
View file @
90d3d8ee
This diff is collapsed.
Click to expand it.
client/src/App.js
View file @
90d3d8ee
import
React
,
{
useEffect
,
useState
}
from
'
react
'
;
import
React
,
{
useState
}
from
'
react
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
{
Redirect
}
from
'
react-router-dom
'
;
import
ohuh
from
'
./ohuh.PNG
'
import
ohuh
from
'
./ohuh.PNG
'
import
{
Container
,
Row
,
Form
,
Image
,
InputGroup
,
Button
,
Col
,
FormControl
,
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
{
Container
,
Row
,
Form
,
Image
,
InputGroup
,
Button
,
Col
,
Nav
}
from
'
react-bootstrap
'
;
import
{
handleLogout
,
isAuthenticated
}
from
'
./utils/auth.js
'
import
{
handleLogout
,
isAuthenticated
}
from
'
./utils/auth.js
'
function
App
()
{
function
App
()
{
...
...
client/src/Bookmark.js
View file @
90d3d8ee
...
@@ -10,7 +10,6 @@ const INIT_PAGE = {
...
@@ -10,7 +10,6 @@ const INIT_PAGE = {
}
}
const
user
=
isAuthenticated
()
function
Bookmark
()
{
function
Bookmark
()
{
const
[
page
,
setPage
]
=
useState
(
INIT_PAGE
)
const
[
page
,
setPage
]
=
useState
(
INIT_PAGE
)
...
@@ -35,26 +34,9 @@ function Bookmark() {
...
@@ -35,26 +34,9 @@ function Bookmark() {
}
}
}
}
// async function handleSubmit(e){
// setState(true); //버튼이 눌려서 handlesubmit이될때 setState값이 true로 바뀐다
// try { //respons 서버에 post로 요청하여 데이터를 받아온다
// const response = await axios.post('/api/users/bookmark', page)
// setSuccess(true)
// } catch (error) {
// console.log(error)
// catchErrors(error, setError)
// }
// }
// useEffect(() => {
// getBookmark(user)
// }, [user])
return
(
return
(
<
Container
>
<
Container
>
<
Navbar
bg
=
"
primary
"
variant
=
"
dark
"
>
<
Navbar
style
=
{
"
#
"
}
bg
=
"
primary
"
variant
=
"
dark
"
>
<
Navbar
.
Brand
href
=
"
/
"
>
북마크
<
/Navbar.Brand
>
<
Navbar
.
Brand
href
=
"
/
"
>
북마크
<
/Navbar.Brand
>
<
Nav
className
=
"
mr-auto
"
>
<
Nav
className
=
"
mr-auto
"
>
<
Nav
.
Link
href
=
"
/
"
>
Home
<
/Nav.Link
>
<
Nav
.
Link
href
=
"
/
"
>
Home
<
/Nav.Link
>
...
@@ -75,3 +57,19 @@ function Bookmark() {
...
@@ -75,3 +57,19 @@ function Bookmark() {
}
}
export
default
Bookmark
export
default
Bookmark
// async function handleSubmit(e){
// setState(true); //버튼이 눌려서 handlesubmit이될때 setState값이 true로 바뀐다
// try { //respons 서버에 post로 요청하여 데이터를 받아온다
// const response = await axios.post('/api/users/bookmark', page)
// setSuccess(true)
// } catch (error) {
// console.log(error)
// catchErrors(error, setError)
// }
// }
// useEffect(() => {
// getBookmark(user)
// }, [user])
\ No newline at end of file
client/src/Components/PrivateRoute.js
View file @
90d3d8ee
import
React
from
'
react
'
import
React
from
'
react
'
import
{
Route
,
Redirect
}
from
'
react-router-dom
'
import
{
Route
,
Redirect
}
from
'
react-router-dom
'
import
{
isAuthenticated
}
from
"
../utils/auth
"
;
import
{
isAuthenticated
}
from
"
../utils/auth
"
;
//로그인 했을때 경로 실행하게 한다
function
PrivateRoute
({
path
,
children
})
{
function
PrivateRoute
({
path
,
children
})
{
if
(
isAuthenticated
())
{
if
(
isAuthenticated
())
{
return
(
return
(
...
...
client/src/Components/Signup.js
View file @
90d3d8ee
...
@@ -20,7 +20,7 @@ function Signup() {
...
@@ -20,7 +20,7 @@ function Signup() {
const
isUser
=
Object
.
values
(
user
).
every
(
el
=>
Boolean
(
el
))
const
isUser
=
Object
.
values
(
user
).
every
(
el
=>
Boolean
(
el
))
isUser
?
setDisabled
(
false
)
:
setDisabled
(
true
)
isUser
?
setDisabled
(
false
)
:
setDisabled
(
true
)
},
[
user
])
},
[
user
])
//바뀌는것이 있을때 이벤트가 발생하는 함수
?
//바뀌는것이 있을때 이벤트가 발생하는 함수
function
handleChange
(
event
)
{
function
handleChange
(
event
)
{
const
{
name
,
value
}
=
event
.
target
const
{
name
,
value
}
=
event
.
target
setUser
({...
user
,
[
name
]:
value
})
setUser
({...
user
,
[
name
]:
value
})
...
@@ -33,7 +33,6 @@ function Signup() {
...
@@ -33,7 +33,6 @@ function Signup() {
const
response
=
await
axios
.
post
(
'
/api/users/signup
'
,
user
)
const
response
=
await
axios
.
post
(
'
/api/users/signup
'
,
user
)
console
.
log
(
response
.
data
)
console
.
log
(
response
.
data
)
console
.
log
(
user
)
console
.
log
(
user
)
// setUser(INIT_USER)
setSuccess
(
true
)
setSuccess
(
true
)
}
catch
(
error
)
{
}
catch
(
error
)
{
console
.
log
(
error
)
console
.
log
(
error
)
...
...
client/src/EditBookmark.js
deleted
100644 → 0
View file @
a0df9bdf
client/src/Hello.js
deleted
100644 → 0
View file @
a0df9bdf
import
React
from
'
react
'
function
Hello
(
props
)
{
console
.
log
(
props
)
return
(
<>
<
h1
>
Hello
<
/h1
>
<
div
>
안녕하세요
{
props
.
name
}
님
.
<
/div
>
<
input
/>
<
/
>
)
}
export
default
Hello
client/src/Pages/Search.js
View file @
90d3d8ee
...
@@ -6,6 +6,7 @@ import { Container, Form, Row, Col, Card, Image, InputGroup, FormControl, Button
...
@@ -6,6 +6,7 @@ import { Container, Form, Row, Col, Card, Image, InputGroup, FormControl, Button
import
Paginations
from
'
../Components/Paginations
'
;
import
Paginations
from
'
../Components/Paginations
'
;
import
axios
from
'
axios
'
;
import
axios
from
'
axios
'
;
import
queryString
from
'
query-string
'
import
queryString
from
'
query-string
'
import
*
as
Icon
from
'
react-bootstrap-icons
'
;
function
Search
(
props
)
{
function
Search
(
props
)
{
const
endPage
=
10
;
const
endPage
=
10
;
...
@@ -14,10 +15,9 @@ function Search(props) {
...
@@ -14,10 +15,9 @@ function Search(props) {
const
[
showSet
,
setShowSet
]
=
useState
([
false
,
false
,
false
,
false
]);
const
[
showSet
,
setShowSet
]
=
useState
([
false
,
false
,
false
,
false
]);
const
[
search
,
setSearch
]
=
useState
(
queryString
.
parse
(
props
.
location
.
search
).
keyword
);
const
[
search
,
setSearch
]
=
useState
(
queryString
.
parse
(
props
.
location
.
search
).
keyword
);
const
[
mobile
,
setMobile
]
=
useState
();
const
[
mobile
,
setMobile
]
=
useState
();
// const [place, setPlace] = useState([{ name: "", category: "", address: "" }])
// const [imgUrl, setImgUrl] = useState([])
const
[
association
,
setAssociation
]
=
useState
([])
const
[
association
,
setAssociation
]
=
useState
([])
const
[
pagePlace
,
setPagePlace
]
=
useState
([])
const
[
pagePlace
,
setPagePlace
]
=
useState
([])
const
[
bookmark
,
setBookmark
]
=
useState
([
false
,
false
,
false
,
false
])
// console.log("search###############", search)
// console.log("search###############", search)
// const getPlace = () => {
// const getPlace = () => {
...
@@ -58,8 +58,6 @@ function Search(props) {
...
@@ -58,8 +58,6 @@ function Search(props) {
useEffect
(()
=>
{
useEffect
(()
=>
{
// getPlace()
// getImg()
getAssociation
()
getAssociation
()
if
(
window
.
innerWidth
<
960
)
{
if
(
window
.
innerWidth
<
960
)
{
setMobile
(
true
)
setMobile
(
true
)
...
@@ -70,14 +68,10 @@ function Search(props) {
...
@@ -70,14 +68,10 @@ function Search(props) {
},
[]);
},
[]);
useEffect
(()
=>
{
useEffect
(()
=>
{
// getImg()
// getAssociation()
setPagePlace
(
paginate
(
association
,
index
,
association
.
length
))
setPagePlace
(
paginate
(
association
,
index
,
association
.
length
))
},
[
association
])
},
[
association
])
useEffect
(()
=>
{
useEffect
(()
=>
{
// getPlace()
// getImg()
getAssociation
()
getAssociation
()
if
(
state
)
{
if
(
state
)
{
props
.
history
.
push
(
'
/search?keyword=
'
+
search
)
props
.
history
.
push
(
'
/search?keyword=
'
+
search
)
...
@@ -144,7 +138,21 @@ function Search(props) {
...
@@ -144,7 +138,21 @@ function Search(props) {
return
page
return
page
}
}
async
function
handlebookmark
(
index
,
place
)
{
if
(
!
bookmark
[
index
])
{
// const response = await axios.put('/api/bookmark',)
alert
(
'
북마크가 저장되었습니다.
'
)
const
showArr
=
bookmark
showArr
[
index
]
=
true
setBookmark
(
showArr
)
}
else
{
// axios.delete('')
alert
(
'
저장된 북마크가 삭제되었습니다.
'
)
const
showArr
=
bookmark
showArr
[
index
]
=
false
setBookmark
(
showArr
)
}
}
let
time
=
new
Date
()
let
time
=
new
Date
()
...
@@ -174,6 +182,11 @@ function Search(props) {
...
@@ -174,6 +182,11 @@ function Search(props) {
return
(
return
(
<
Col
key
=
{
index
}
md
=
{
6
}
>
<
Col
key
=
{
index
}
md
=
{
6
}
>
<
Card
align
=
"
center
"
border
=
"
info
"
style
=
{{
margin
:
"
3%
"
}}
>
<
Card
align
=
"
center
"
border
=
"
info
"
style
=
{{
margin
:
"
3%
"
}}
>
<
Button
style
=
{{
marginLeft
:
"
50vh
"
}}
onClick
=
{()
=>
handlebookmark
(
index
,
place
)}
>
{
console
.
log
(
bookmark
)}
<
Icon
.
BookmarkStarFill
size
=
{
35
}
/> <Icon.BookmarkStar size=
{35}
/
>
<
/Button
>
<
Card
.
Title
style
=
{{
margin
:
"
3%
"
,
fontSize
:
'
200%
'
,
fontWeight
:
'
bold
'
}}
>
{
place
.
name
}
<
/Card.Title
>
<
Card
.
Title
style
=
{{
margin
:
"
3%
"
,
fontSize
:
'
200%
'
,
fontWeight
:
'
bold
'
}}
>
{
place
.
name
}
<
/Card.Title
>
<
Card
.
Img
variant
=
"
top
"
style
=
{{
padding
:
"
5%
"
,
width
:
"
100%
"
,
height
:
"
340px
"
}}
src
=
{
place
.
img
}
/
>
<
Card
.
Img
variant
=
"
top
"
style
=
{{
padding
:
"
5%
"
,
width
:
"
100%
"
,
height
:
"
340px
"
}}
src
=
{
place
.
img
}
/
>
<
Card
.
Body
>
<
Card
.
Body
>
...
...
client/src/Search.js
deleted
100644 → 0
View file @
a0df9bdf
import
React
,
{
useState
,
useEffect
}
from
'
react
'
;
import
{
Link
,
Redirect
}
from
'
react-router-dom
'
;
import
ohuh
from
'
./ohuh-sm.PNG
'
;
import
Place
from
'
./Components/Place
'
;
import
{
Container
,
Form
,
Row
,
Col
,
Card
,
Image
,
InputGroup
,
FormControl
,
Button
}
from
'
react-bootstrap
'
;
import
Paginations
from
'
./Components/Paginations.js
'
// import catchErrors from './utils/catchErrors.js'
// import * as Icon from 'react-bootstrap-icons';
// import axios from "axios";
const
INIT_PAGE
=
{
title
:
''
,
url
:
''
,
}
//초기페이지에 타이틀이랑 url 저장
function
Search
(
props
)
{
const
endPage
=
10
;
const
[
state
,
setState
]
=
useState
(
false
);
const
[
index
,
setIndex
]
=
useState
(
1
);
const
[
showSet
,
setShowSet
]
=
useState
([
false
,
false
,
false
,
false
]);
const
[
search
,
setSearch
]
=
useState
(
props
.
location
.
state
.
id
);
const
[
mobile
,
setMobile
]
=
useState
();
const
[
show
,
setShow
]
=
useState
(
false
);
const
[
page
,
setPage
]
=
useState
(
INIT_PAGE
)
const
[
success
,
setSuccess
]
=
useState
(
false
)
const
[
error
,
setError
]
=
useState
(
''
)
const
handleClose
=
()
=>
setShow
(
false
);
const
handleShow
=
()
=>
setShow
(
true
);
useEffect
(()
=>
{
if
(
window
.
innerWidth
<
960
)
{
setMobile
(
true
)
}
else
{
setMobile
(
false
)
}
},
[]);
const
places
=
[{
name
:
"
한라산(hallasan)
"
,
address
:
"
제주 서귀포시 토평동 산15-1
"
,
img
:
"
data:image/png;base64,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
"
,
// img: "https://upload.wikimedia.org/wikipedia/commons/thumb/e/eb/KOCIS_Halla_Mountain_in_Jeju-do_%286387785543%29.jpg/269px-KOCIS_Halla_Mountain_in_Jeju-do_%286387785543%29.jpg?size=200x200",
// }, {
// name: "성산일출봉(sungsan)",
// address: "제주 서귀포시 성산읍 성산리 1",
// img: "https://www.jeju.go.kr/pub/site/geopark/images/sub/sub03/02%EC%A7%80%EC%A7%88%EB%A7%88%EC%9D%84%EC%9D%B4%EC%95%BC%EA%B8%B0/%EC%A7%80%EC%A7%88%EB%A7%88%EC%9D%84/%EC%A7%80%EC%A7%88%EB%A7%88%EC%9D%84_%EC%84%B1%EC%82%B0%EC%9D%BC%EC%B6%9C%EB%B4%89/1412402261.jpg?400/400",
// }, {
// name: "해녀의 집(haenyeo)",
// address: "제주 서귀포시 성산읍 한도로 141-13지번오조리 3 오조해녀의집",
// img: "https://mblogthumb-phinf.pstatic.net/MjAxNjExMTdfMTc0/MDAxNDc5MzU3ODU0ODQy.KZYXCjzsXT3rCsE4HXBfxyCg2buvluBvN_7NxVp7BSwg.loJc89d8JjGXdNCn-4yMd7aMWPjfrZn21TI9Hyzemkog.JPEG.icocam11/20161010_100205.jpg?type=w800",
// }, {
// name: "오설록 티 뮤지엄(osulloc)",
// address: "제주 서귀포시 안덕면 신화역사로 15 오설록지번서광리 1235-1 오설록",
// img: "https://cdnweb01.wikitree.co.kr/webdata/editor/202007/01/img_20200701143323_2ced7627.webp",
// }, {
// name: "오설록 티 뮤지엄(osulloc)",
// address: "제주 서귀포시 안덕면 신화역사로 15 오설록지번서광리 1235-1 오설록",
// img: "https://upload.wikimedia.org/wikipedia/commons/thumb/e/eb/KOCIS_Halla_Mountain_in_Jeju-do_%286387785543%29.jpg/269px-KOCIS_Halla_Mountain_in_Jeju-do_%286387785543%29.jpg",
}]
if
(
state
!==
false
)
{
return
<
Redirect
to
=
{{
pathname
:
`/search/
${
search
}
`
,
state
:
{
id
:
search
},
}}
/>
;
}
const
handlePage
=
(
num
)
=>
{
setIndex
(
num
);
}
// async function bookmarkSave() {
// await axios.put('/api/users', {userId:userId, bookmarkId:bookmarkId})
// }
const
handleChange
=
(
e
)
=>
{
setSearch
(
e
.
target
.
value
);
}
async
function
handleSubmit
(
e
){
setState
(
true
);
//버튼이 눌려서 handlesubmit이될때 setState값이 true로 바뀐다
}
function
paginate
(
items
,
pageNumber
,
itemNumber
)
{
const
page
=
[];
//페이지를 빈배열로 설정
const
startIndex
=
(
pageNumber
-
1
)
*
itemNumber
// 처음인덱스 값이 페이지넘버 -1 * 아이템 넘버로
for
(
var
i
=
0
;
i
<
itemNumber
;
i
++
)
{
page
.
push
(
items
[(
startIndex
+
i
)])
}
return
page
}
const
pagePlace
=
paginate
(
places
,
index
,
1
)
return
(
<
Container
>
<
Link
to
=
"
/
"
className
=
"
d-flex justify-content-center
"
><
Image
src
=
{
ohuh
}
/></
Link
>
<
Row
className
=
"
mb-2
"
className
=
"
d-flex justify-content-center
"
>
<
Form
style
=
{{
width
:
"
90vw
"
}}
onSubmit
=
{
handleSubmit
}
>
<
InputGroup
size
=
"
lg
"
>
<
FormControl
placeholder
=
"
검색어를 입력하세요.
"
value
=
{
search
}
aria
-
label
=
"
Large
"
aria
-
describedby
=
"
inputGroup-sizing-sm
"
onChange
=
{
handleChange
}
/
>
<
InputGroup
.
Append
>
<
Button
type
=
"
submit
"
variant
=
"
outline-secondary
"
style
=
{{
maxHeight
:
"
8vh
"
,
maxWidth
:
"
14vh
"
}}
>
검색
<
/Button
>
<
/InputGroup.Append
>
<
/InputGroup
>
<
/Form
>
<
/Row
>
<
Row
className
=
"
d-flex flex-wrap
"
>
{
pagePlace
.
map
((
place
,
index
)
=>
{
return
(
<
Col
key
=
{
index
}
md
=
{
6
}
>
<
Card
align
=
"
center
"
border
=
"
info
"
style
=
{{
margin
:
"
3%
"
}}
>
{
/* <Button onSubmit={handleSubmit} variant="outline-info" style={{ marginLeft: "55vh" }} type='submit'><Icon.BookmarkStar size={30} /></Button> */
}
<
Card
.
Title
style
=
{{
margin
:
"
3%
"
,
fontSize
:
'
200%
'
,
fontWeight
:
'
bold
'
}}
>
{
place
.
name
}
<
/Card.Title
>
<
Card
.
Img
variant
=
"
top
"
style
=
{{
padding
:
"
5%
"
,
width
:
"
100%
"
,
height
:
"
340px
"
}}
src
=
{
place
.
img
}
/
>
<
Card
.
Body
>
<
Card
.
Text
style
=
{{
overflow
:
'
auto
'
,
fontSize
:
'
25px
'
,
width
:
'
100%
'
,
height
:
"
80px
"
}}
>
{
place
.
address
}
<
/Card.Text
>
<
Button
variant
=
"
primary
"
onClick
=
{()
=>
{
const
showArr
=
[
false
,
false
,
false
,
false
]
showArr
[
index
]
=
true
setShowSet
(
showArr
)
}}
>
{
place
.
name
}
자세히
살펴보기
<
/Button
>
<
Place
search
=
{
place
}
index
=
{
index
}
show
=
{
showSet
[
index
]}
onHide
=
{()
=>
setShowSet
([
false
,
false
,
false
,
false
])}
/
>
<
/Card.Body
>
<
/Card
>
<
/Col
>
)
})}
<
/Row
>
{
console
.
log
(
showSet
)}
{
/* show가 전부 true로 바뀌어서 전부 다 보이게 되는 것이다. */
}
<
Row
className
=
"
mt-2 d-flex justify-content-center
"
>
<
Paginations
index
=
{
index
}
endPage
=
{
endPage
}
handlePage
=
{
handlePage
}
><
/Paginations
>
<
/Row
>
<
/Container
>
);
}
export
default
Search
client/src/index.js
View file @
90d3d8ee
...
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
...
@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
import
'
./index.css
'
;
import
'
./index.css
'
;
import
'
bootstrap/dist/css/bootstrap.min.css
'
;
import
'
bootstrap/dist/css/bootstrap.min.css
'
;
import
App
from
'
./App
'
import
App
from
'
./App
'
import
Search
from
'
./Search
'
;
import
Search
from
'
./
Pages/
Search
'
;
import
reportWebVitals
from
'
./reportWebVitals
'
;
import
reportWebVitals
from
'
./reportWebVitals
'
;
import
Signup
from
'
./Components/Signup
'
import
Signup
from
'
./Components/Signup
'
import
Login
from
'
./Components/Login
'
import
Login
from
'
./Components/Login
'
...
...
client/src/utils/auth.js
View file @
90d3d8ee
...
@@ -6,7 +6,7 @@ export function handleLogin(userId) { //로그인할때 로컬스토리지에
...
@@ -6,7 +6,7 @@ export function handleLogin(userId) { //로그인할때 로컬스토리지에
export
async
function
handleLogout
()
{
export
async
function
handleLogout
()
{
localStorage
.
removeItem
(
'
loginStatus
'
)
//로컬스토리지에서 로그인상태를 지운다
localStorage
.
removeItem
(
'
loginStatus
'
)
//로컬스토리지에서 로그인상태를 지운다
await
axios
.
get
(
'
/api/auth/logout
'
)
//?
await
axios
.
get
(
'
/api/auth/logout
'
)
window
.
location
.
href
=
'
/
'
//경로 지정
window
.
location
.
href
=
'
/
'
//경로 지정
}
}
//유저가 로그인 했는 지 확인하는 함수
//유저가 로그인 했는 지 확인하는 함수
...
...
server/controllers/auth.controller.js
View file @
90d3d8ee
...
@@ -6,33 +6,27 @@ import config from "../config.js"
...
@@ -6,33 +6,27 @@ import config from "../config.js"
const
login
=
async
(
req
,
res
)
=>
{
const
login
=
async
(
req
,
res
)
=>
{
const
{
email
,
password
}
=
req
.
body
//구조분해해서 하나씩
const
{
email
,
password
}
=
req
.
body
//구조분해해서 하나씩
console
.
log
(
email
,
password
)
console
.
log
(
email
,
password
)
try
{
//적어도 3개 맥시멈 10개 가 아니면
try
{
// 1) 사용자 확인
const
user
=
await
User
.
findOne
({
email
}).
select
(
'
+password
'
)
const
user
=
await
User
.
findOne
({
email
}).
select
(
'
+password
'
)
// 2) 이메일 사용자가 없으면 에러 반환
if
(
!
user
)
{
if
(
!
user
)
{
return
res
.
status
(
404
).
send
(
`
${
email
}
이 없습니다`
)
return
res
.
status
(
404
).
send
(
`
${
email
}
이 없습니다`
)
}
}
// 3) 비밀번호 일치 확인
const
passwordMatch
=
await
bcrypt
.
compare
(
password
,
user
.
password
)
const
passwordMatch
=
await
bcrypt
.
compare
(
password
,
user
.
password
)
// 4) 비밀번호가 맞으면 토큰 생성 후 쿠키에 저장
if
(
passwordMatch
)
{
if
(
passwordMatch
)
{
//비밀스럽게 한다 노출되면 안된다 문자열
const
token
=
jwt
.
sign
({
userId
:
user
.
_id
},
config
.
jwtSecret
,{
const
token
=
jwt
.
sign
({
userId
:
user
.
_id
},
config
.
jwtSecret
,{
expiresIn
:
'
7d
'
//만기날짜
expiresIn
:
'
7d
'
})
})
// 쿠키의 이름, 쿠키의 value
res
.
cookie
(
'
token
'
,
token
,
{
res
.
cookie
(
'
token
'
,
token
,
{
maxAge
:
config
.
cookieMaxAge
,
//쿠키 얼마동안 살아있을지 생성일이 지나면 자동으로 사라짐
maxAge
:
config
.
cookieMaxAge
,
httpOnly
:
true
,
//client쪽에서 자바스크립트에서 쿠키 접근 불가
httpOnly
:
true
,
secure
:
config
.
env
===
'
production
'
//true가되면 https로만 접근가능
secure
:
config
.
env
===
'
production
'
})
})
res
.
json
({
userId
:
user
.
_id
})
res
.
json
({
userId
:
user
.
_id
})
// 5) 비밀번호가 틀리면 에러 반환
}
else
{
}
else
{
res
.
status
(
401
).
send
(
'
비밀번호가 일치하지 않습니다
'
)
res
.
status
(
401
).
send
(
'
비밀번호가 일치하지 않습니다
'
)
}
}
}
catch
(
error
)
{
//다른 과정에서 에러가 나면 실행
}
catch
(
error
)
{
console
.
log
(
error
)
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
로그인 에러
'
)
res
.
status
(
500
).
send
(
'
로그인 에러
'
)
}
}
...
...
server/controllers/user.controller.js
View file @
90d3d8ee
...
@@ -6,7 +6,7 @@ import bcrypt from "bcryptjs";
...
@@ -6,7 +6,7 @@ import bcrypt from "bcryptjs";
const
signup
=
async
(
req
,
res
)
=>
{
const
signup
=
async
(
req
,
res
)
=>
{
const
{
name
,
email
,
password
}
=
req
.
body
//구조분해해서 하나씩
const
{
name
,
email
,
password
}
=
req
.
body
//구조분해해서 하나씩
console
.
log
(
name
,
email
,
password
)
console
.
log
(
name
,
email
,
password
)
try
{
//적어도 3개 맥시멈 10개 가 아니면
try
{
if
(
!
isLength
(
name
,
{
min
:
3
,
max
:
10
}))
{
if
(
!
isLength
(
name
,
{
min
:
3
,
max
:
10
}))
{
return
res
.
status
(
422
).
send
(
'
이름은 3-10자 사이입니다
'
)
return
res
.
status
(
422
).
send
(
'
이름은 3-10자 사이입니다
'
)
}
else
if
(
!
isLength
(
password
,
{
min
:
6
}))
{
}
else
if
(
!
isLength
(
password
,
{
min
:
6
}))
{
...
@@ -39,7 +39,7 @@ const userById = async (req, res, next, id) => {
...
@@ -39,7 +39,7 @@ const userById = async (req, res, next, id) => {
res
.
status
(
404
).
send
(
'
사용자를 찾을 수 없습니다
'
)
res
.
status
(
404
).
send
(
'
사용자를 찾을 수 없습니다
'
)
}
}
req
.
profile
=
user
req
.
profile
=
user
next
()
//만나는 순간 다음 미들웨어로 진행 없으면 가만히 있는다
next
()
}
catch
(
error
)
{
}
catch
(
error
)
{
console
.
log
(
error
)
console
.
log
(
error
)
res
.
status
(
500
).
send
(
'
사용자 아이디 검색 실패
'
)
res
.
status
(
500
).
send
(
'
사용자 아이디 검색 실패
'
)
...
@@ -64,25 +64,8 @@ const getBookmark = async (req, res) => {
...
@@ -64,25 +64,8 @@ const getBookmark = async (req, res) => {
res
.
send
(
updatedUser
)
res
.
send
(
updatedUser
)
}
}
// const putBookmark = async (req, res) => {
// function handlebookmark() {
// const newBookmark = new Bookmark ({
// const bookmarkUser = await User.findOne({})
// bookmark,
// }).save()
// console.log(newBookmark)
// res.json(newBookmark)
// }
// const bookMark = async (req, res) => {
// const {title, url} = req.body
// console.log(title, url)
// try {
// let bookmark = []
// const newBookmark = await new User ({
// bookmark,
// }).save()
// } catch (error) {
// console.log(error)
// res.status(500).send('사용자 아이디 검색 실패')
// }
// }
// }
export
default
{
signup
,
userById
,
getBookmark
}
export
default
{
signup
,
userById
,
getBookmark
}
\ No newline at end of file
server/models/User.js
View file @
90d3d8ee
import
mongoose
from
"
mongoose
"
;
import
mongoose
from
"
mongoose
"
;
const
{
String
}
=
mongoose
.
Schema
.
Types
const
{
String
,
Array
,
ObjectId
}
=
mongoose
.
Schema
.
Types
const
{
Array
}
=
mongoose
.
Schema
.
Types
const
{
Schema
}
=
mongoose
;
const
{
Types
:
{
ObjectId
}
}
=
Schema
;
const
ReserveSchema
=
new
Schema
({
user
:
{
type
:
ObjectId
,
required
:
true
,
ref
:
'
User
'
,
},
})
const
UserSchema
=
new
mongoose
.
Schema
({
const
UserSchema
=
new
mongoose
.
Schema
({
name
:
{
name
:
{
...
@@ -34,10 +23,10 @@ const UserSchema = new mongoose.Schema({
...
@@ -34,10 +23,10 @@ const UserSchema = new mongoose.Schema({
default
:
'
user
'
,
default
:
'
user
'
,
enum
:
[
'
user
'
,
'
admin
'
,
'
root
'
]
enum
:
[
'
user
'
,
'
admin
'
,
'
root
'
]
},
},
bookmark
:
{
bookmark
:
[
{
type
:
Array
,
type
:
ObjectId
,
re
quired
:
true
,
re
f
:
'
Place
'
}
}
]
},
{
},
{
timestamps
:
true
timestamps
:
true
})
})
...
...
server/routes/auth.routes.js
View file @
90d3d8ee
...
@@ -2,7 +2,7 @@ import express from "express"
...
@@ -2,7 +2,7 @@ import express from "express"
import
authCtrl
from
"
../controllers/auth.controller.js
"
import
authCtrl
from
"
../controllers/auth.controller.js
"
const
router
=
express
.
Router
()
const
router
=
express
.
Router
()
//경로 설정?
router
.
route
(
'
/api/auth/login
'
)
router
.
route
(
'
/api/auth/login
'
)
.
post
(
authCtrl
.
login
)
.
post
(
authCtrl
.
login
)
...
...
server/routes/user.routes.js
View file @
90d3d8ee
...
@@ -8,10 +8,7 @@ router.route('/api/users/signup')
...
@@ -8,10 +8,7 @@ router.route('/api/users/signup')
router
.
route
(
'
/api/users/bookmark
'
)
router
.
route
(
'
/api/users/bookmark
'
)
.
put
(
userCtrl
.
getBookmark
)
.
put
(
userCtrl
.
getBookmark
)
// .get(userCtrl.putBookmark)
router
.
param
(
'
userId
'
,
userCtrl
.
userById
)
router
.
param
(
'
userId
'
,
userCtrl
.
userById
)
// router.route('/api/users/bookmark')
export
default
router
export
default
router
\ No newline at end of file
server/server.js
View file @
90d3d8ee
...
@@ -9,8 +9,6 @@ connectDb()
...
@@ -9,8 +9,6 @@ connectDb()
const
app
=
express
()
const
app
=
express
()
app
.
use
(
'
/images
'
,
express
.
static
(
'
uploads/
'
))
app
.
use
(
express
.
json
())
app
.
use
(
express
.
json
())
app
.
use
(
placeRouter
)
app
.
use
(
placeRouter
)
...
@@ -18,11 +16,6 @@ app.use(reviewRouter)
...
@@ -18,11 +16,6 @@ app.use(reviewRouter)
app
.
use
(
userRouter
)
app
.
use
(
userRouter
)
app
.
use
(
authRouter
)
app
.
use
(
authRouter
)
app
.
get
(
'
/
'
,
(
req
,
res
)
=>
{
console
.
log
(
"
/ req.body
"
,
req
.
body
)
res
.
json
({
message
:
"
http://localhost3001/ 에 연결됨
"
})
})
app
.
listen
(
3001
,
()
=>
{
app
.
listen
(
3001
,
()
=>
{
console
.
log
(
'
Listening on port 3001
'
)
console
.
log
(
'
Listening on port 3001
'
)
})
})
\ No newline at end of file
server/utils/connectDb.js
View file @
90d3d8ee
...
@@ -7,7 +7,7 @@ async function connectDb() {
...
@@ -7,7 +7,7 @@ async function connectDb() {
if
(
connection
.
isConnected
)
{
if
(
connection
.
isConnected
)
{
return
return
}
}
//디비연결
const
db
=
await
mongoose
.
connect
(
config
.
mongoDbUri
,
{
const
db
=
await
mongoose
.
connect
(
config
.
mongoDbUri
,
{
useNewUrlParser
:
true
,
useNewUrlParser
:
true
,
useUnifiedTopology
:
true
,
useUnifiedTopology
:
true
,
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment