IT_Programming/JavaScript

[펌] 모바일 웹페이지 확인하는 방법

JJun ™ 2013. 2. 15. 03:25


[아이폰]



 [출처] http://gotoweb.wordpress.com/2010/01/11/%EC%95%84%EC%9D%B4%ED%8F%B0%EC%97%90%EC%84%9C-%EC%9B%B9%ED%8E%98%EC%9D%B4%EC%A7%80-%EC%86%8C%EC%8A%A4%EB%B3%B4%EA%B8%B0/


javascript:var sourceWindow = window.open('about:blank');

var newDoc = sourceWindow.document;newDoc.open();

newDoc.write('' + 'Source of ' +document.location.href + '' +'');

newDoc.close();

var pre =newDoc.body.appendChild(newDoc.createElement("pre"));

pre.appendChild(newDoc.createTextNode(document.documentElement.innerHTML));



 






[안드로이드]



[출처]
http://ygchorom.tistory.com/entry/Android-Webview-%EC%9D%98-html-source-%EC%BD%94%EB%93%9C-%EC%B6%9C%EB%A0%A5%ED%95%98%EA%B8%B0

Android 에서 Webview 를 이용한 app을 만들다 보면  Webview의 html source를 봐야 하는 경우가 생긴다.

예를 들어 webview에 특정 페이지가 출려되어야 하나 오류도 발생하지 않고 white page가 뜬다.. 모바일 웹페이지이나 다른 브라우져에서는 전혀 문제가 없다.  보통 브라우져 종속적인 쿠키나 javascript 오류로 페이지가 출력되지 않는 경우가 대부분이나 이런경우 해당 페이지의 html source 를 보기전에 확인하기가 힘들다. 물론 이보다 더 스마트한 방법이 있을수 있겠지만..... 이보다  더좋은 스마트 한 방법을 알고 있지 않다면 아래 방법이라도....

 

먼저 WebViewClient 상속 클래스에 아래  메소드를  오버라이딩 한다.

페이지 로드가 완료 됬을 시에  print 라는 javascript를 호출한다 그 인자에 html 소스를 넘긴다. ..

 

  1: @Override
  2: 
  3: public void onPageFinished(WebView view, String url) {
  4: 
  5: 	// TODO Auto-generated method stub
  6: 
  7: 	super.onPageFinished(view, url);
  8: 
  9: 			
 10: 
 11: 	Log.i("INFO",onPageFinished url="+url);
 12: 
 13: 	String ht = "javascript:window.TMP.print(document.getElementsByTagName('html')[0].innerHTML);";
 14: 
 15: 	view.loadUrl(ht);
 16: 
 17: }
 18: 
 19: 

호출된 메소드를 오버라이딩 받기 위해 JavaScriptInterface 클래스에 아래  메소드를 추가 한다.

  1: /**
  2: * Webview Html 소스 보기 
  3: * */
  4: 
  5: @SuppressWarnings("unused")
  6: public void print(String data) {
  7:     File file = new File(TFileUtil.DIR_TMP+"/aa.html");
  8:     FileOutputStream fos;
  9: 
 10:     try{
 11: 	if(file.exists()){
 12: 		fos = new FileOutputStream(file, true);
 13: 	}else{
 14: 		fos = new FileOutputStream(file);
 15: 	}
 16: 	fos.write(data.getBytes());
 17: 	fos.close();
 18:      }catch (Exception e) {
 19: 	Log.e("INFO","print exception "+e.getMessage());
 20:      }
 21: }
 22: 
 23: 

이렇게 해서  html 소스를 파일로 저장 할수 있다 .