# 북쪽행성 실행하기
## 1. 프로젝트 다운받기
* 깃랩의 레포지토리를 클론합니다.
```
$ git clone https://lab.ssafy.com/s05-final/S05P31A204.git
```
* frontend 폴더 내부에서 node_modules 를 설치합니다.
```
$ cd frontend
$ npm install
```
## 2. 8443포트에서 프로젝트 빌드하기
* frontend>vue.config.js 파일이 다음과 같은지 확인합니다.
```
const path = require('path');
module.exports = {
publicPath: process.env.NODE_ENV === 'production' ? '/' : './', //deveopment.productions,test모드 중 배포시 루트로, 개발시 상대경로로 설정함.
outputDir: path.resolve(
__dirname,
//'../backend/northernplanet/src/main/resources/static',
'../backend/webrtc/src/main/resources/static',
//배포 설정
//'./build',
), //빌드파일을 올릴 곳(디폴트(dist)에서 스프링 부트 static폴더로 )
devServer: {
historyApiFallback: true, // history mode 새로고침시 정상 작동
port: 3000, //개발하는 동안 프런트엔드 페이지를 띄우는 포트
https: true,
proxy: {
'/api/*': {
target: 'https://localhost:8446', // /api 요청을 할때 백엔드 호출
},
},
},
css: {
loaderOptions: {
sass: {
prependData: `
@import "./src/assets/scss/global.scss";
`,
},
},
},
};
```
* frontend>src>constant>index.js 가 다음과 같은지 확인합니다.
```
const BASE_URL = 'https://localhost:8446/api';
// 배포 설정
//const BASE_URL = 'https://k5a204.p.ssafy.io/api';
const FILE_PATH = BASE_URL + '/presentation';
//프론트 3000 - 백엔드 8446포트에서 테스트 할 때 사용하세요.
// const GOOGLE_OAUTH_URL =
// 'https://localhost:8446/oauth2/authorize/google?redirect_uri=https://localhost:3000/front/oauth2/redirect';
//8443포트
const GOOGLE_OAUTH_URL =
'https://localhost:8446/oauth2/authorize/google?redirect_uri=https://localhost:8443/front/oauth2/redirect';
//배포
//const GOOGLE_OAUTH_URL =
// 'https://k5a204.p.ssafy.io/oauth2/authorize/google?redirect_uri=https://k5a204.p.ssafy.io/front/oauth2/redirect';
export { BASE_URL, GOOGLE_OAUTH_URL, FILE_PATH };
```
* frontend>src>router>index.js 에서 history mode 를 주석해주세요.
```
// mode: 'history',
```
* backend>northernplanet>src>main>resources>application-auth.properties 가 다음과 같은지 확인합니다.
```
#google
spring.security.oauth2.client.registration.google.client-id=728431963124-aa22v5qq2de7vik5lhj75rkekgge2sh2.apps.googleusercontent.com
spring.security.oauth2.client.registration.google.client-secret=_o70Bb9pPLVOZFanRBU-lfFV
spring.security.oauth2.client.registration.google.scope=email,profile
spring.security.oauth2.client.registration.google.redirectUri=https://localhost:8446/oauth2/callback/google
#배포시
#spring.security.oauth2.client.registration.google.redirectUri=https://k5a204.p.ssafy.io/oauth2/callback/google
#auth
app.auth.tokenSecret=7A27EDDAEC22DD462965E38BAEC34
app.auth.tokenExpirationMesc=864000000
#프론트 3000번으로 테스트할 때
# app.oauth2.authorizedRedirectUris=https://localhost:3000/front/oauth2/redirect
#프론트 8443번으로 테스트할 때
app.oauth2.authorizedRedirectUris=https://localhost:8443/front/oauth2/redirect
#배포
#app.oauth2.authorizedRedirectUris=https://k5a204.p.ssafy.io/front/oauth2/redirect
```
* backend>northernplanet>src>main>resources>application.properties 가 다음과 같은지 확인합니다.
```
# ===================================================================
# Spring Boot application properties
#
# For a list of common properties, check the Spring Boot docs:
# https://docs.spring.io/spring-boot/docs/current/reference/html/appendix-application-properties.html
# ===================================================================
# ----------------------------------------
# CORE PROPERTIES
# ----------------------------------------
# LOGGING
logging.level.root=INFO
logging.level.org.apache=WARN
logging.level.org.springframework=WARN
logging.level.org.kurento=INFO
logging.level.org.kurento.tutorial=INFO
# OUTPUT
# Terminal color output; one of [ALWAYS, DETECT, NEVER]
spring.output.ansi.enabled=DETECT
# Swagger
springfox.documentation.swagger.use-model-v3=false
#DB JPA
spring.jpa.hibernate.naming.implicit-strategy=org.springframework.boot.orm.jpa.hibernate.SpringImplicitNamingStrategy
spring.jpa.hibernate.naming.physical-strategy=org.springframework.boot.orm.jpa.hibernate.SpringPhysicalNamingStrategy
spring.jpa.hibernate.ddl-auto=update
spring.jpa.properties.hibernate.dialect=org.hibernate.dialect.MySQL57Dialect
spring.jpa.properties.hibernate.show_sql=true
spring.mvb.hiddenmethod.filter.enabled=true
spring.data.web.pageable.one-indexed-parameters=true
spring.datasource.url=jdbc:mysql://3.36.57.26:3306/northernplanet?useUnicode=true&characterEncoding=utf8&serverTimezone=Asia/Seoul&zeroDateTimeBehavior=convertToNull&rewriteBatchedStatements=true
spring.datasource.hikari.username=qnrWhrgodtjd
spring.datasource.hikari.password=qnrWhrgodtjd2021!
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.security.user.name=ssafy
spring.security.user.password=ssafy
## Multipart properties
# Enable multipart uploads
spring.servlet.multipart.enabled=true
# Max file size.
spring.servlet.multipart.max-file-size=200MB
# Max Request Size
spring.servlet.multipart.max-request-size=215MB
## File Storage Properties
# All files uploaded through the REST API will be stored in this directory
# ----------------------------------------
# WEB PROPERTIES
# ----------------------------------------
# Oauth2
spring.profiles.include=auth
# EMBEDDED SERVER CONFIGURATION
server.port=8446
#배포시 밑에있는거 싹다 주석처리
server.ssl.key-store=classpath:keystore.jks
server.ssl.key-store-password=kurento
server.ssl.key-store-type=JKS
```
* backend>webrtc>src>main>resources>application.properties 가 다음과 같은지 확인합니다.
```
# ===================================================================
# Spring Boot application properties
#
# For a list of common properties, check the Spring Boot docs:
# https://docs.spring.io/spring-boot/docs/current/reference/html/appendix-application-properties.html
# ===================================================================
# ----------------------------------------
# CORE PROPERTIES
# ----------------------------------------
# LOGGING
logging.level.root=INFO
logging.level.org.apache=WARN
logging.level.org.springframework=WARN
logging.level.org.kurento=INFO
logging.level.com.ssafy=INFO
# OUTPUT
# Terminal color output; one of [ALWAYS, DETECT, NEVER]
spring.output.ansi.enabled=DETECT
# ----------------------------------------
# WEB PROPERTIES
# ----------------------------------------
# EMBEDDED SERVER CONFIGURATION
server.port=8443
#배포시 주석 처리
server.ssl.key-store=classpath:keystore.jks
server.ssl.key-store-password=kurento
server.ssl.key-store-type=JKS
#배포시 주석 풀기
#server.ssl.key-store=classpath:cert_kurento.p12
#server.ssl.key-store-password=kurento
#server.ssl.key-store-type=PKCS12
```
* frontend 폴더 내부에서 다음 명령어를 수행하세요.
```
$ npm run build
```
## 3. 백엔드 프로젝트를 실행하세요.
* webrtc 프로젝트 터미널에서 다음 명령어를 수행하세요.
```
$ mvn -U clean spring-boot:run -Dspring-boot.run.jvmArguments="-Dkms.url=ws://3.36.57.26:8888/kurento"
```
* northernplanet 프로젝트를 실행하세요.
## 4. 서비스 주소에 접속하세요.
* https://localhost:8443
* 프론트에서 히스토리 모드를 껏기 때문에 링크를 이동할때 포트번호 옆에 `/#/`를 붙여줘야 페이지가 정상적으로 이동합니다.
* https://localhost:8446/swagger-ui/index.html
Sign in with Wallet
Connect another wallet