인스타그램 data 뿌리기

 

<%@page import="java.net.HttpURLConnection"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="java.net.URL, org.jdom.Document, org.jdom.Element, org.jdom.input.SAXBuilder, org.xml.sax.InputSource, java.util.List, java.text.SimpleDateFormat, java.util.Date, java.util.Locale, java.text.ParseException  "%>
<%@ page import="java.net.URLConnection, java.io.InputStream, java.io.InputStreamReader, java.io.BufferedReader, java.io.File" %>

<%
List instaList = null;

SimpleDateFormat oldFormat = new SimpleDateFormat("EEE, dd MMM yy", Locale.ENGLISH);
SimpleDateFormat oldFormat2 = new SimpleDateFormat("dd MMM yy", Locale.ENGLISH);
SimpleDateFormat newFormat = new SimpleDateFormat("yyyy-MM-dd");
Date parsedDate = null;
URL url = null;


%>

<!--insta-->
<script type="text/javascript">
	$(document).ready(function(){
		var tocken = "액세스 토큰값을 넣어주세요";
		var count = "8";
		$.ajax({
			type: "GET",
			dataType: "jsonp",
			cache: false,
			url : "https://api.instagram.com/v1/users/self/media/recent/?access_token=" + tocken + "&count=" + count,
			success: function(response) {
				if(response.data.length > 0){
					for(var i = 0; i < response.data.length; i++){
						var insta = '<li>';
						insta += "<a target='_blank' href='" + response.data[i].link + "' title='새창 열기'>";
						insta += "<div'>";
						if ( response.data[i].caption !== null ) {
							if ( response.data[i].caption.text.length > 0 ) {
								insta += '<p class="sns_content">'+response.data[i].caption.text+'<span>';
							}
						}
						insta +='<p class="sns_like">좋아요 <span>'+response.data[i].likes.count+'</span>개</p>';
						var date = new Date(parseInt(response.data[i].created_time) * 1000);
						var month = (date.getMonth()+1);
						var monthTxt = "";
						if(month < 10 ){
							monthTxt = "0" + month;
						}else{
							monthTxt = month;
						}
						var day = date.getDate();
						var dayTxt = "";
						if(day < 10 ){
							dayTxt = "0" + day;
						}else{
							dayTxt = day;
						}
						var year = date.getFullYear();
						insta += "<p class='sns_date'>";
						insta += year + "-" + monthTxt + "-" + dayTxt;
						insta += "</p>";
						insta += "</div>";
						insta += '<img src="' + response.data[i].images.standard_resolution.url + '"  alt="인스타_'+i+'">';
						insta += "</a>";
						insta += "</li>";
						$("#instaUl").append(insta); //해당 id 또는 class에 html append
					}
				}
			}
		});
	});
    
<!--instagram-->
<li>
	<ul id="instaUl">
		//여기에 <li>태그로 data가 그려지게 됩니다.
	</ul>
</li>