분류 전체보기 (77) 썸네일형 리스트형 2-2. iOS에서 Web Scraping해서 정보 가져오기 나의 목표는 iOS Application에서 HTML 문서를 읽어와 버튼의 상태를 읽고 그 상태를 iOS Application의 버튼에 띄워주는 것이다. 구체적으로 정리를 해보면, 다음과 같다. 1. Application이 시작할 때, HTML 문서 읽기 2. HTML 문서의 버튼 상태 저장하기 3. iOS Application의 컨트롤에 상태 나타내기 먼저 Application이 시작할 때, HTML 문서를 읽어주기 위하여 AppDelegate.swift파일에 클래스 변수로 url과 buttonState를 추가하고, application 함수를 수정해 주었다. url은 반복적으로 사용되므로 ConentView 클래스에 있던 것은 제거를 하고 AppDelegate 클래스에서 한 번만 선언하기로 했다.(t.. 2-1. iOS 앱에서 JavaScript 함수 실행하기 먼저 구현에 앞서 URL을 통해 웹페이지를 연결해야 하므로 Info.plist를 설정해준다. (taeminator1.tistory.com/11 참고) ContentView에서 앱과 웹페이지를 연결하기 위해, WKWebView와 URLRequest의 객체를 생성한다. 그리고 init() 함수를 추가해, 앱과 웹페이지를 연결한다. ContentView.swift import SwiftUI import WebKit import Foundation struct ContentView: View { static let url: String = "http://taeminator1.iptime.org" static let wkWebView = WKWebView() static let request: URLRequest.. 2-0. 아이폰 앱과 웹 페이지 간의 통신 두 영역 간의 통신을 위해서는 두 가지가 구현되어야 한다. 1. 아이폰 앱에서 웹페이지의 정보 가져오기 2. 아이폰 앱에서 웹페이지의 컨트롤 조작하기 첫 번째, 아이폰 앱에서 웹페이지의 정보를 가져와야 한다. 처음 앱을 실행하면 이전에 내가 저장했던 상태들을 알아야 그것에 맞춰 앱을 띄울 수 있기 때문이다. 이에 관해서는 3-1(taeminator1.tistory.com/4)에서도 말했듯이, HTML문을 Scrap 해서 정보를 읽을 것이다. 두 번째로는 JavaScript파일을 아이폰 앱에서 실행시켜 웹페이지의 컨트롤을 조작할 것이다. 예를 들어 앱에 있는 버튼을 누를 시 웹페이지의 버튼을 누르게 할 것이다. WebKit Framework에서 제공하는 evaluateJavaScript함수를 이용할 것이다.. [iOS] SwiftUI를 이용하여 Web page 띄우기 SwiftUI를 통해 웹페이지를 띄우는 것은 상당히 간단하다. 어떠한 framework도 import 할 필요 없이 URL과 간단한 설정만 하면 끝난다. ContentView.swift import SwiftUI struct ContentView: View { var body: some View { WebView(url: "https://taeminator1.tistory.com") .frame(maxWidth: .infinity) } } 다음은 Info.plist에 내용을 수정하면 된다. Information property list file의 약자로, 앱 실행에 필요한 여러 가지 설정을 text 형식으로 만들어 놓은 파일이다. 여러 속성 중, App Transport Security Settings의.. 1-1. SwiftUI로 iOS Application UI 구성 기존에 Objective-C를 사용하던 애플은 2014년 WWDC(Worldwide Developers Conference)를 통해 Swift라는 언어를 세상에 처음 공개했고, 지난 2019 SwiftUI라는 새로운 User Interface를 공개했다. 기존 방식으로 애플리케이션을 제작하게 되면, 검증된 소스코드도 많고, 관련 자료도 많아 쉽게 애플리케이션을 만들 수 있을 것이다. 하지만 기술은 변화하고 있는데, 그 변화에 맞서기 싫어 기존 것을 고수한다면, 그리고 그것이 반복된다면, 가까운 미래에 크게 도태될 것이다. 그리고 이러한 태도가 개발자로서는 가장 기피해야 할 태도가 아닐까 싶다. 이런저런 의미에서 이번 개발은 SwiftUI를 통해 구현하기로 마음 먹었다. 사실 애플리케이션 제작 경험조차 별.. 3-4. Node.js를 이용한 웹 페이지 작성(파일 read/write 구현) 2 이전 포스팅에서 개별적으로 살펴본 코드를 합친 전체 코드이다. 전역 변수로 fs모듈을 불러왔고, 공유기에서 설정한 내부 포트 번호도 선언했다. 그리고 HTML 코드가 너무 복잡해서 templageHTML함수를 통해 조금이나마 코드를 보기 쉽게 만들었다. app.js var http = require('http'); var fs = require('fs'); var url = require('url'); var qs = require('querystring'); const inPort = 80; // 내부 포트 번호 function templateHTML(title, gui, script) { return ` ${gui} `; } var app = http.createServer(function(reque.. 3-4. Node.js를 이용한 웹 페이지 작성(파일 read/write 구현) 1 앞 시간에 node.js파일을 실행시켜 외부에서도 해당 페이지를 접속하는 방법을 알아보았다. 이번 시간에는 javascript를 이용해 파일을 입출력하는 방법을 구현해 볼 것이다. 해당 포스팅은 이고잉님의 생활코딩(Node.js)이 굉장히 도움이 되었다. https://opentutorials.org/module/3549/21135 이고잉님께는 이 자리를 빌려 감사함을 전하고 싶다. 이번 개발의 주요 사항은 다음과 같다. 페이지를 열었을 경우(open, reload, ...) 이전 상태가 유지하기(read) 변경된 상태 반영하기(write) 다 작성하고 보니 코드가 너무 길어졌다. js파일에 html문과 script문을 다 넣었기 때문인데, 각각의 파일로 따로 관리하면 좋겠지만, 파라미터를 공유하고 있어.. [Node.js]공유기를 이용해 웹페이지 공개하기 콘솔 창을 띄어 node.js파일을 실행시키는 것은 어렵지 않다. 하지만 이렇게만 진행하면 자신의 컴퓨터(host computer)에서만 웹페이지를 볼 수 있는 한계가 있다. 이 페이지를 다른 사람들과 공유하는 방법을 알아보자. 자신의 서버를 외부와 공유하기 위해서는 공유기에 있는 두 가지 설정을 해줘야 한다. 첫 번째는 포트 포워딩(Port Forwarding)이고, 두 번째는 DDNS(Dynamic Domain Name System)이다. 1. 포트 포워딩(Port Forwarding) 설정 이름에서 알 수 있듯이, 서버와 공유기, 클라이언트 간을 특정 포트로 연결시키는 방법이다. 그 방법은 다음과 같다. (현재 보유하고 있는 공유기인 iptime 기준이다. 먼저 웹브라우저에서 192.168.0.1을.. 이전 1 ··· 6 7 8 9 10 다음
