Mabataki Developer

어찌저찌 우리의 졸업작품 프로젝트가 끝났다... 

2022.07 ~ 2023.05까지 약 1년간 진행했다...

여름 방학때부터 매주 모여 아이디어를 회의하고 사실 지금의 아이디어는 찐찐찐찐막 의 아이디어를 선정 하였다 ㅋㅌㅋ

그렇게 아이디어중 하나를 선택하고 서로의 공부 방향을 정했다.

처음에 라즈베리파이로 서버를 열려 하였지만... ip가 유동ip여서 정말 불편했다는... 그리고 모델 연산을 하게되면 엄청난 부하로 인해 라즈베리파이 cpu로 고기도 구워먹을 수 있었다.

따라서 우리는 AWS를 사용하게 되고 뭐 이런저런 과정을 겪게 됐다 ㅋㅋ

아마 전공 4년동안 가장 인상적인 팀 프로젝트가 아닌가 싶다. 사실 이전의 것들은 하난도 인상적이지 않아 기억이 없다 ㅋㅌ

내가 앱 제작을 맡아 앱 개발 과정을 이 블로그에 올리려 하였지만 여러가지 문제로 인해 올리지 못했다. (주로 귀차니즘) 돌아보니 간단히 우리의 기능을 보여주려 하여다보니 앱 이라고 말하기 조금 꼬름해졌다 ㅋㅋ 

계획은 거창하였으나 구현을 못한것에 대해 아쉽다.. 로그인 뭐 회원관 등등의 기본적인 기능들도 넣었어야 하는 아쉬움.... 이 있다!!

그래도 이 이후에 계속 고쳐나갈 예정이니까 git주소 올릴태니 모두들 많관부 ㅎ 이쁘게 봐주세요 여루분  혹여나 간단한 프로젝트를 우리와 비슷하게 하려는 분들 참고하시구 인사팀 또는 관련 사장님들 우리 써주세요 ㅎㅎ 일 열심히해요 ㅎㅎ ㅋㅌㅋ 

(고생많았구 다들 음 팀장직은 이만 내려놓겠다. ㅋㅌㅋ )

https://github.com/NewP1/Golden_Time

CUDA와 CUDNN설치후 openCV를 수동으로 설치후 weights파일이 적용된 아니면 적용이 안된 python파일을 실행시켜도

nvidia-smi의 running processes에 추가가 되지 않는 모습이었다... CUDA/CUDNN/openCV의 버전 호환도 맞췄고, gpu에 따른 

CUDA_ARCH_BIN도 맞췄는데 왜안될까... 라고해서 CUDA/CUDNN/openCV 설치만 주구장창 10일 가량 했던거 같다..

물론 나의 잘못이지만 python에서 import cv2를 한 후 버전확인 한 버전과 pkg-config --modversion opencv4의 버전이 다르다는것은 내가 CUDA를 적용한 openCV를 파이썬이 적용을 하지 못한것... 따라서 openCV설치 전의 AMI이미지를 저장해뒀기에 처음부터 다시 시작하기로 하였다..(사실 심볼릭 링크가 깨져서 이것저것 지우고 다시깔다가 apt가 안돼서 다시함 ㅎㅎ 비밀~~)

(재설치 10회 이상하여 멘탈이 안좋아 사진은 없습니다....)

CUDA11.4,NDIVIA-DRIVER-470 설치

계속 nvidia-driver를 

sudo apt-get install nvidia-driver-470

이렇게 설치한 후 CUDA버전을 맞춰서 설치를 진행 하였지만.

nvidia-driver를 설치한후 CUDA를 설치하지않았는데 nvidia-smi로 확인을 해 보면 CUDA의 버전이 지멋대로 적용이 돼있었다..

CUDA를 설치할때 같이 설치되는 ndivia-driver로 설치 하였다.

https://developer.nvidia.com/cuda-11-4-0-download-archive?target_os=Linux&target_arch=x86_64&Distribution=Ubuntu&target_version=18.04&target_type=runfile_local 

이 링크에서 .run파일을 다운받고 설치를 진행해 준다.

중간에 체크박스 화면이 보이겠지만 example 등과같은건 설치하지말고 ndivia-driver와 그밑의 cuda tool만 설치를 진행하면 된다.

설치가 완료가 된다면

sudo vi ~/.bashrc

export PATH=$PATH:/usr/local/cuda-11.4/bin
export CUDADIR=/usr/local/cuda-11.4
export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:/usr/local/cuda-11.4/lib64

:wq!로 저장을 한뒤

source ~/.bashrc 로 저장을 하고 재부팅을 하면된다.

이후

nvcc -V

nvidia-smi

로 cuda버전이 일치함을 볼 수 있을것이다.

CUDNN8.2.4설치

https://developer.nvidia.com/rdp/cudnn-download#a-collapse714-92

여기서 간단한 회원 가입후 자신이 원하는 버전의 cudnn을 다운받아 ubuntu환경으로 옮겨주면 된다.

(저는 노트북에 설치후 scp를 이용하여 옮겼습니다)

scp -i "키페어 위치" "옮길 파일의 위치" "ec2접속주소":/home/ubuntu

이후 deb는 dpkf or tgz는 tar -xvf 등으로 파일을 풀게 된다면 cuda의 폴더가 생성될것이다.

cd cuda/ 파일의 위치로 옮긴 후

sudo cp include/cudnn* /usr/local/cuda-11.4/include
sudo cp -P lib64/libcudnn* /usr/local/cuda-11.4/lib64/
sudo chmod a+r /usr/local/cuda-11.4/lib64/libcudnn*

//-P를 같이 해줘야 심볼릭 링크가 깨지지 않고 복사해줌.

하면 cudnn설치 완료

CUDNN버전 확인

cat /usr/local/cuda/include/cudnn_version.h | grep CUDNN_MAJOR -A 2

nvidia-smi를 확인하면 GPU가 OFF로 되어 있을 수 있다.

https://docs.aws.amazon.com/ko_kr/AWSEC2/latest/UserGuide/optimize_gpu.html

이 가이드를 참고하여 자신이 사용하는 인스턴스에 맞게 GPU를 활성화 해주면 된다.

여기까지 하면 openCV 설치를 위한 CUDA CUDNN설치가 완료됐다.~~ 칭찬해~~

openCV설치

혹시 설치된 openCV가 있는지 확인,삭제

pkg-config --modversion opencv4 //확인

//만약 openCV가 설치되어있다면


sudo apt-get purge libopencv* python-opencv4

//확인하기
sudo find /usr/local/ -name "*opencv*" -exec rm {} \;

//만약 남아 있다면 아래로 지우기
sudo rm -rf '경로'

//다시 확인하기
sudo find /usr/local/ -name "*opencv*" -exec rm {} \;

//다시 opencv 확인
pkg-config --modversion opencv4

git clone하여 opencv, opencv_contrib다운받기

git clone https://github.com/opencv/opencv.git
git clone https://github.com/opencv/opencv_contrib.git

CUDA_ARCH_BIN을 위해 자신의 gpu capability확인해서 넣어주세용

https://en.wikipedia.org/wiki/CUDA

cd ./opencv
mkdir build && cd build

//cmake해주기
cmake -D CMAKE_BUILD_TYPE=RELEASE \
-D CMAKE_INSTALL_PREFIX=/usr/local \
-D WITH_TBB=OFF \
-D WITH_IPP=OFF \
-D WITH_1394=OFF \
-D BUILD_WITH_DEBUG_INFO=OFF \
-D BUILD_DOCS=OFF \
-D BUILD_EXAMPLES=OFF \
-D BUILD_TESTS=OFF \
-D BUILD_PERF_TESTS=OFF \
-D WITH_CUDA=ON \
-D WITH_CUDNN=ON \
-D OPENCV_CUDA_ENABLED=ON \
-D CUDA_FAST_MATH=ON \
-D CUDA_ARCH_BIN=7.5\  #자신의 gpu에 맞는 capability확인하기
-D CUDA_ARCH_PTX=7.5 \
-D WITH_CUBLAS=ON \
-D WITH_CUFFT=ON \
-D WITH_QT=ON \
-D WITH_GTK=OFF \
-D WITH_OPENGL=ON \
-D WITH_V4L=ON \
-D WITH_FFMPEG=ON \
-D WITH_XINE=ON \
-D BUILD_NEW_PYTHON_SUPPORT=ON \
-D INSTALL_C_EXAMPLES=OFF \
-D INSTALL_PYTHON_EXAMPLES=ON \
-D OPENCV_GENERATE_PKGCONFIG=ON \
-D OPENCV_EXTRA_MODULES_PATH=/home/ubuntu/opencv_contrib/modules \
-D OPENCV_ENABLE_NONFREE=ON \
-D OPENCV_GENERATE_PKGCONFIG=ON \
-D OPENCV_PYTHON3_INSTALL_PATH=/usr/local/lib/python3.6/dist-packages \
-D PYTHON3_EXCUTABLE=/usr/bin/python3 \
-D PYTHON3_INCLUDE_DIR=/usr/include/python3.6 \
-D PYTHON3_NUMPY_INCLUDE_DIRS=**/usr/lib/python3/dist-packages/numpy/core/include** \
-D PYTHON3_PACKAGES_PATH=/usr/lib/python3/dist-packages \
-D PYTHON3_LIBRARY=/usr/lib/x86_64-linux-gnu/libpython3.6.so \

// 자신 시스템의 코어 수 확인
nproc 

// 빌드 (modify the core number '12' after option -j accordingly)
make -j12 # 자신 시스템 코어 수에 맞게 -j 다음의 숫자를 변경

// install
sudo make install

// 설치된 opencv확인 저 같은경우는 4.7.0
pkg-config --modversion opencv4

-D PYTHON3_EXCUTABLE=/usr/bin/python3 \
-D PYTHON3_INCLUDE_DIR=/usr/include/python3.6 \
-D PYTHON3_NUMPY_INCLUDE_DIRS=**/usr/lib/python3/dist-packages/numpy/core/include** \
-D PYTHON3_PACKAGES_PATH=/usr/lib/python3/dist-packages \
-D PYTHON3_LIBRARY=/usr/lib/x86_64-linux-gnu/libpython3.6.so \

이 경로를 잘 파악해서 넣어주는것이 중요합니다!!!

이후 python3 ~~.py를 실행하고 nvidia-smi를 확인하니 프로세스에 잘 넣어지고 gpu사용량도 쭉쭉 올라가는것이 보입니다..

여러분들도 혹시 저랑 같은 문제를 직면한다면 다지우고 처음부...ㅌ..읍읍.. ㅋㅋ 조금이나마 도움이 됐으면 좋겠습니다!!

많은도움주신 분

https://darkpgmr.tistory.com/184

라즈베리파이에서 Firebase Storage에 동영상을 올렸다는 가정하에 그 영상을 앱으로 가져와서

탭뷰로 나열한뒤, 실행까지 시키는 연습을 해볼것이다!!.

테이블뷰로 뷰를 꽉채운후 테이블뷰 cell과 cell안의 라벨을 추가해 준다.

셀의 Identifre를 cell로 설정을 한다.

그 다음은 파이어 베이스를 설정해보자~

파이어베이스 콘솔에서 프로젝트를 만들어주고

iOS로 시작한다~

번들ID를 입력을 해야하는데

이건 Xcode로 돌아가서

프로젝트 설정에서 빨간 박스를 복붙 하면 된다~

이 파일을  xcode에 옮길것인데

이렇게 끌어 오면 된다.

Firebase SDK를 설치합니다.

Xcode로 돌아와 프로젝트 설정에서 Package Dependencies에 들어가 +버튼을 눌러줍니다.

오른쪽 위의 검색창에 아까 복사한 Firebase SDK 저장소 URL을 붙여넣어 주시고.

Add Fackage를 한 후

조금 기다리면?

이 화면이 뜨게됩니다~

여기서

FirebaseDatabase

FirebaseDatabaseSwift

FirebaseFirestore

FirebaseFirestoreSwift

FirebaseMessaging

FirebaseStorage를 체크하고 AddPackage

import UIKit
import FirebaseCore

@main
class AppDelegate: UIResponder, UIApplicationDelegate {



    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        // Override point for customization after application launch.
        FirebaseApp.configure()
        return true
    }

이렇게 AppDelegate.swift 파일은 변경해 준다. 

(혹시 오류가 생기면 Firebase SDK 설치가 끝나면 오류가 사라질거에요~)

그후 파이어베이스의 RealTImeDatabase를 들어간다.

데이터 베이스를 만들고

경로를 이렇게 설정해 준다,

이후  FirebaseStorage에 짧은 영상을 2개 업로드 해 준다.(여러개도 상관없음)

이렇게 영상 2개를 업로드 한후

영상을 클릭하면

오른쪽에 이 화면이 나올것이다.

그리고 파일위치의 엑세스 토큰을 복사해 준다.

복사한 url을 Firebase RealTimeDatabase 경로에 추가해 준다.

나머지 1개도 해준다.

그럼 이렇게 경로 설정이 완료가 된다~

다시 Xcode로 돌아와서

command + N을 눌러 Swift파일을 추가해 준다. 이름은 Videos로

Videos.Swift

import Foundation

class Videos {
    
    var Title: String?
    var link: String?
    
    init(Title: String?, link: String?) {
        self.Title = Title;
        self.link = link;
    }
}

다음은 뷰컨트롤러의 아울렛 설정을 할 것이다.

command + N 을 눌러 CocoaTouch Class를 만들어 준다.

이후 메인의 테이블뷰 안에 있는 cell을 클릭 한 후 

만든 코코아터치 클래스로 설정을 해 준다

TableViewCell.swift

import UIKit

class TableViewCell: UITableViewCell {

    @IBOutlet weak var titleLabel : UILabel!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        // Initialization code
    }

    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    }

}

라벨의 아웃렛을 설정해준다.

그리고 뷰컨트롤러로 돌아와서

테이블뷰의 아웃렛을 설정한후~

ViewController.swift

import UIKit
import Foundation
import Firebase
import FirebaseDatabase
import AVKit


class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource{
   
    
    
    var table = [Videos]()
    var ref: DatabaseReference!

    @IBOutlet weak var TableView: UITableView!
    override func viewDidLoad() {
        super.viewDidLoad()
        
        ref = Database.database().reference().child("videos")
        
        ref.observe(DataEventType.value, with: { [self](snapshot) in
            if snapshot.childrenCount > 0 {
                self.table.removeAll()
                
                for video in snapshot.children.allObjects as! [DataSnapshot] {
                    
                    let Object = video.value as? [String : String]
                    let Title = Object?["Title"]
                    let videolink = Object?["link"]
                    
                    print(Title)
                    print(videolink)
                    
                    
                    let video = Videos(Title: Title as? String, link: videolink as? String)
                    self.table.append(video)
                    
                    TableView.delegate = self
                    TableView.dataSource = self
                    self.TableView.reloadData()
                    
                }
            }
            
        })
        
        
    }
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return table.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = TableView.dequeueReusableCell(withIdentifier: "cell") as! TableViewCell
        
        let video: Videos
        
        video = table[indexPath.row]
        cell.titleLabel.text = video.Title
        
        return cell
        
        
    }
    
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        
        guard let videoURL = URL(string: table[indexPath.row].link!) else {
            return
        }
        
        let player = AVPlayer(url: videoURL)
        
        let controller = AVPlayerViewController()
        controller.player = player
        
        present(controller, animated: true) {
            player.play()
        }
        print("tabVIew clicked")
    }
    
    
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

시뮬레이터를 실행시키면

이렇게 셀들이 올라오고 터치하면 동영상이 플레이어로 나오게 됩니다!.

코드

https://github.com/jjwon2149/iOS---SwiftPractice/tree/main/AVkitWithTableViewTest

지난번에 만들어놓은 코드에 url을 라즈베리파이에서 서버로 띄운 웹의 주소를 넣었더니...

이게웬걸 ?박스가 뜨면서 카메라의 실시간 스트리밍 화면이 보이지 않았다..

지금 현제 뷰는 3개가 있는데

1. RecentVideoView

2.RealTimeVideoView

3.SettingView

2번의 뷰에서 하면 ?박스가 뜨고 1번의 뷰에 똑같이 넣으면 보이는? 현상이 발생했다,,,

이유는 모르겠다만 구글링을 해서 wkwebView 이전의 webView의 코드들을 가져다 써 보았고.

그 코드는 정상 작동하여 웹페이지에서 띄운 실시간 스트리밍 화면이 잘 보이게 됐다.

정상적으로 화면이 보이는 모습이다.

아직 포트포워딩을 하지 않아 같은 네트워크가 아니면 외부에서 스트리밍 사이트를 보지 못한다.

코드  (다시해보니 이 코드도 되고 전 글의 주소만 바꿔도 되네...)

import UIKit
import WebKit

class RealTImeVideoViewController: UIViewController, WKUIDelegate {

    @IBOutlet weak var webView: WKWebView!
    
    override func viewDidLoad() {
        super.viewDidLoad()

        //탭바 순서
        self.tabBarController?.selectedIndex = 1
        
        self.tabBarController?.tabBar.isHidden = false
        
//        loadWebPage("http://192.168.35.11:2204/")
        
        let stream_url = "http://192.168.35.11:2204/"
        webView.uiDelegate = self
        webView.load(NSURLRequest(url: NSURL(string: stream_url )! as URL) as URLRequest)
    }
}

다음은 웹뷰에 사용자 터치를 설정해 보겠다.

https://shylog.com/settings-for-a-more-complete-webview/

혹시..그냥 주소만 바꿔도 나오시는분 있을까요..?ㅎㅎ

참고했습니다.

https://github.com/matzpersson/swift-raspberry-video-streaming

https://github.com/jjwon2149/iOS---SwiftPractice/tree/main/GraduationApp

간단하게 탭바를 사용하여 3개의 뷰를 만들었다.

1. RecentVideoView

: 이전 영상을 확인 할 수 있는 뷰 라즈베리 파이에서 찍은 영상을 파이어 베이스에 올려 앱에서 받을 것 이다.

2.RealTimeVideo

: 웹뷰를 사용하여 라즈베리파이에서 실시간 영상을 볼 수 있는 웹을 열어 그 사이트를 웹뷰로 띄울것 이다.

3.Setting

: 미정 (아마 폭력이 감지됐으때 알림 on/off 정도..??)

임시로 웹뷰를 네이버로 띄워 놓았다.

RealTimeVideoViewController.swift

import UIKit
import WebKit

class RealTImeVideoViewController: UIViewController {

    @IBOutlet weak var webView: WKWebView!
    
    override func viewDidLoad() {
        super.viewDidLoad()

        //탭바 순서
        self.tabBarController?.selectedIndex = 1
        
        self.tabBarController?.tabBar.isHidden = false
        
        loadWebPage("http://www.naver.com")
    }
    

    func loadWebPage(_ url:String){
        let myUrl = URL(string: url)
        let myRequest = URLRequest(url:myUrl!)
        webView.load(myRequest)
    }

}