오늘 할 것은 유저가 URL을 입력했을때 사이트 메타데이터를 얻어와서 표시하는 작업이다.
아래처럼 유튜브 URL을 입력하면 저렇게 간단한 사진과, 내용이 보인다.
시작하기 전에...
Jsoup 라이브러리를 이용할것이니 build.gradle에implementation 'org.jsoup:jsoup:1.11.1' 한 줄을 추가!
1. Validator.java : URL 검사 클래스 만들기
URL 파싱에 앞서서 URL이 진짜 맞는 URL인지 검사하는 클래스인 Validator를 만든다.
Validator.isUrl()를 하면 URL이 맞는지 간단히 검사할 수 있다.
public class Validator { public static boolean isUrl(String text) { Pattern p = Pattern.compile("^(?:https?:\\/\\/)?(?:www\\.)?[a-zA-Z0-9./]+$"); Matcher m = p.matcher(text); if (m.matches()) return true; URL u = null; try { u = new URL(text); } catch (MalformedURLException e) { return false; } try { u.toURI(); } catch (URISyntaxException e) { return false; } return true; } }
2. Util.java : 텍스트에서 대표 URL을 추출하는 메소드와, URL에서 메타데이터를 추출하는 메소드를 가진 클래스
- 첫번째 extractUrlFromText에서는 일반 텍스트에서 대표 URL 하나 추출해낸다."안녕하세요 여기는https://naver.com에서 긁어왔어요 [https://google.com](https://google.com)ㅋㅋ"라는 문자가 있다면 첫번째로 등장하는 유효한 URL인 https://naver.com만을 반환한다.
- 두번째 getMetadataFromUrl에서는 웹에서 meta-data를 가져올 수 있도록 한다.
자세히보면 meta[property=og:title]이라는 부분이있는데, 자신이가져올 항목을 정확히 알려면, 웹브라우저의 개발자도구로 가서 <head> 태그를 자세히 살펴보면 된다. 네이버의 경우 아래와 같다. Metadata는 내가 임의로 생성한 간단한 객체다.
public class Util { // URL에서 메타데이터를 추출하는 메소드 public static Metadata getMetadataFromUrl(String url) { try { Metadata metadata = new Metadata(); metadata.url = url; Document doc = Jsoup.connect(url).get(); metadata.title = doc.select("meta[property=og:title]").first().attr("content"); metadata.description = doc.select("meta[property=og:description]").get(0).attr("content"); metadata.imageUrl = doc.select("meta[property=og:image]").get(0).attr("content"); return metadata; } catch (Exception e) { e.printStackTrace(); return null; } } // 텍스트에서 대표 URL을 추출하는 메소드 public static String extractUrlFromText(String text) { String urlRegex = "((https?|ftp|gopher|telnet|file):((//)|(\\\\))+[\\w\\d:#@%/;$()~_?\\+-=\\\\\\.&]*)"; Pattern pattern = Pattern.compile(urlRegex, Pattern.CASE_INSENSITIVE); Matcher urlMatcher = pattern.matcher(text); ArrayList<String> urls = new ArrayList<>(); while (urlMatcher.find()) { urls.add(text.substring(urlMatcher.start(0), urlMatcher.end(0))); } String resultUrl = null; for (String url : urls) { if (Validator.isUrl(url)) { resultUrl = url; break; } } return resultUrl; } }
3. EditText 글자가 바뀔때마다 체크하고 URL이 있다면 저장 해두고, 메타데이터 정보를 가져와서 보여준다!
public class WritePungActivity extends AppCompatActivity { private String url; // metadata를 가져올 url private EditText etComment; protected void onCreate(...) { TextWatcher textWatcher = new TextWatcher() { @Override public void beforeTextChanged(CharSequence s, int start, int count, int after) { } @Override public void onTextChanged(CharSequence s, int start, int before, int count) { // 텍스트 변경시 URL이 있는지 체크 checkUrl(); } @Override public void afterTextChanged(Editable s) { } }; etComment.addTextChangedListener(textWatcher); } private void checkUrl() { String content = etComment.getText().toString(); url = Util.extractUrlFromText(content); if (url != null) { Metadata metadata = Util.getMetadataFromUrl(url); // TODO: 메타데이터를 가져왔으니 여기에 메타데이터를 보여주는 뷰 보이게! } } }
-
NetworkOnMainThreadException 에러를 피하기 위해서는?
public class MetadataTask extends AsyncTask<String, Metadata, Metadata> { private final PostAdapter.ViewHolder holder; public MetadataTask(PostAdapter.ViewHolder holder) { this.holder = holder; } @Override protected Metadata doInBackground(String... params) { return Util.getMetadataFromUrl(params[0]); } @Override protected void onPostExecute(Metadata metadata) { super.onPostExecute(metadata); // TODO ... 가져온 메타데이터로 뭘 할지 적어주면됨 Glide.with(context).load(metadata.imageUrl).into(holder.ivMetadataImage); holder.tvMetadataTitle.setText(metadata.shorten(metadata.title)); holder.tvMetadataUrl.setText(metadata.shorten(metadata.url)); holder.rlMetadata.setVisibility(View.VISIBLE); } }
'프로그래밍 > Android' 카테고리의 다른 글
| 안드로이드 Admob 종료 및 뒤로가기시 전면광고 추가하기 (6) | 2019.04.24 |
|---|---|
| 안드로이드 인트로(스플래시) 화면을 만들어보자 (0) | 2019.04.24 |
| [안드로이드] 이메일 인텐트 보내기 (Intent ACTION_SEND Email) (2) | 2019.03.25 |
| [안드로이드] Admob 광고 게재가 중단: GOOGLE PLAY 삭제 해결방법 (1) | 2019.03.25 |
| Fresco 이미지 wrap_content로 로딩하는 법 (0) | 2019.03.10 |