ios | ios도 모르고 하이브리드 앱 개발하기 [ 8 Web View 만들기 / webProject 연결 ]

2016. 9. 19. 11:37mobile/ios



ios도 모르고 하이브리드 앱 개발하기 [ 8 Web View 만들기 / webProject 연결 ]



이번에는 웹페이지를 나타낼 웹뷰를 만들어 보고 이전에 작업한 WebProject 를 연결해 보자.

WebProject 는 ios도 모르고 하이브리드 앱 개발하기 [ 4.2 eclipse에서 webproject 생성 / dynamic web project / jsp ] 포스팅에서 진행하였다.



코딩은 아주 기본적인 것만 진행한다.





가장 먼저 아이폰 사이즈를 변경하자.

프로젝트 창 > Main.storyboard 클릭 > View Controller 클릭
화면 우측 상단에 Attributes inspector 아이콘 클릭, size 를 iPhone 4.7-inch 로 변경





그다음에는 Xcode 좌측 상단의 Run 버튼 우측에 보면 시뮬레이터 선택을 할 수 있는 곳이 있다.

여기서 iPhone 6s 를 선택한다.





이제 웹뷰를 추가해 보자.

프로젝트 창 > Main.storyboard 클릭





우측 하단의 라이브러리 창에서 Objects Library 아이콘을 선택

스크롤을 내려서 Web View 를 찾고 화면처럼 드래그한다.





아이폰 사이즈에 맞게 Web View 사이즈를 조절한다.




이제 레퍼런싱 아웃렛을 설정해야 한다.

레퍼런싱 아울렛(Referencing Outlest) 은 뷰를 사용하기 위해 컨트롤에 접근할 수 있도록 하는 설정이다.

먼저 ViweController.h 파일을 더블클릭한다.





그럼 다음과 같이 팝업창이 뜬다.





다시 스토리보드의 웹뷰로 와서 오른족 클릭

New Referencing Outlets를 선택하고 ViweController.h 파일 팝업을 열어둔 곳으로 드래그한다.





Name 은 webView 로 설정하고 Connect 버튼 클릭





다음과 같이 프로퍼티가 정의되면 된다.

이제 팝업창을 닫아도 된다.





이제 생성한 webView 에 Url 주소를 연결해주자.

프로젝트 창 > ViewController.m 파일 클릭

다음과 같이 소스를 입력한다.

1
2
3
4
5
6
- (void)viewDidAppear:(BOOL)animated
{
    NSString *url = @"http://www.naver.com";
    NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL URLWithString:url]];
    [_webView loadRequest:request];
}
cs





이제 Run 아이콘을 클릭한다.





웹브라우저가 잘 실행된다면 끝이다.

맨 아래 webProject 연결 부분을 보면 된다.


하지만 IOS9 이상은 다음과 같이 오류가 나고 웹페이지가 정상적으로 작동하지 않는다.

아래는 이 부분에 대한 해결방법이다.


2016-09-18 10:40:30.588 iosTest[4019:63126] App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. Temporary exceptions can be configured via your app's Info.plist file.


IOS9 부터 보안강화로 인한 http 접속을 시도하면 경고메시지를 표시하고 사이트 접속을 차단한다.

하지만 다음과 같은 설정들로 이를 우회할 수 있다.





프로젝트 창 > Info.plist 오른쪽 클릭 > Open As > Souce Code 클릭





아래와 같은 코드를 추가한다.

1
2
3
4
5
    <key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
    </dict>
cs






그리고 다시 실행하면 다음과 같이 브라우저가 실행된다.




이로써 webView 를 이용하여 브라우저를 만들었다.





이번에는 webProject를 webView에서 실행시켜 보자.

Eclipse에서 이전에 만들어 놓은 webProject 를 실행하자.

WebProject 는 ios도 모르고 하이브리드 앱 개발하기 [ 4.2 eclipse에서 webproject 생성 / dynamic web project / jsp ] 포스팅에서 진행하였다.





Xcode 에서 프로젝트 창 > ViewController.m 클릭 > 이전에 설정한 url 주소를 webProject 주소로 변경하자.





그리고 Run 버튼을 클릭해서 webProject 가 시뮬레이터의 webView 에 나오면 완료 !!



크게 어려운 작업이 없는 webView 추가와 webProject 의 연결에 대한 기록이다.





 * 경고


IOS에 무지한 상태에서 구글링만으로 앱 개발 및 포스팅이 진행됨


누구나 따라할 수 있겠지만 결코 완벽한 정답이 아닐 수 있음


아주 주관적인 입장에서의 포스팅임