티스토리 뷰

준비

Developer Key 발급

https://code.google.com/apis/youtube/dashboard/


API Access 등록, Client ID 발급

https://code.google.com/apis/console/

  • 테스트 서버, http, https 에 따라 각각 새로 생성.
  • Redirect URIs는 미리 경로를 기획하여 둘것.
    아무 입력 하지 않고 만들 경우
    "자신의 도메인/oauth2callback" 로 잡히는데
    웹서버 루트에 /oauth2callbar/default.asp 만들면 됨.


순서

  1. 인증.
  2. API 명세 통한 사용.

인증

https://accounts.google.com/o/oauth2/auth?
  client_id=1084945748469-eg34imk572gdhu83gj5p0an9fut6urp5.apps.googleusercontent.com&
  redirect_uri=http://localhost/oauth2callback&
  scope=https://gdata.youtube.com&
  response_type=code&
  access_type=online
위 주소를 만들기위해 아래와 같이 코딩했습니다.

<% '// https://developers.google.com/youtube/2.0/developers_guide_protocol_oauth2#OAuth2_Authentication Set xmlHttp = CreateObject("MSXML2.ServerXMLHTTP") Set params = CreateObject("Scripting.Dictionary") params("client_id") = "사용자입력" params("redirect_uri") = "http://도메인/oauth2callback" params("response_type") = "code" params("scope") = "https://gdata.youtube.com" '// 범위: Youtube 계정 관리 params("access_type") = "online" '// online=한번인증으로 계속 이용 | offline=항상 갱신 받음 param = "" For Each f in params v = params(f) param = param & f &"="& v &"&" Next If param <> "" Then param = Left(param, Len(param)-1) End If action_url = "https://accounts.google.com/o/oauth2/auth" url = action_url &"?"& param Response.Redirect url %>

이상없이 실행되면 소스 마지막의 Redirect 경로로 이동하는데

구글의 인증 페이지로 이동하게 되며
인증을 승인하게 되면

https://code.google.com/apis/console/의 생성한 Clinet ID 중 해당 Redirect URIs 에서 지정한 경로로 이동되게 되는데 쿼리스트링으로 code 값이 전달되며

code 값을 엿바꿔 먹는...것은 아니고 ACCESS TOKEN 으로 바꿔먹어야 하며 ACCESS TOKEN을 서버에 저장해 두고 두고 써먹으면 됩니다.

구글에선 아래와 같이 하라고 설명 되어 있습니다.

POST /o/oauth2/token HTTP/1.1 
Host: accounts.google.com 
Content-Type: application/x-www-form-urlencoded 

code=4/ux5gNj-_mIu4DOD_gNZdjX9EtOFf& client_id=1084945748469-eg34imk572gdhu83gj5p0an9fut6urp5.apps.googleusercontent.com& client_secret=hDBmMRhz7eJRsM9Z2q1oFBSe& redirect_uri=http://localhost/oauth2callback& grant_type=authorization_code

위와 같이 구현하기 위해 아래와 같이 코딩했습니다.

<% '// OAuth Callback (https://developers.google.com/youtube/2.0/developers_guide_protocol_oauth2#OAuth2_Authentication)
code = Request.Querystring("code")
If code = "" Then
	Response.Write("<p>Error occured: No code responsed.</p>")

	err = Request.Querystring("error")
	If err <> "" Then
		Response.Write("<p>Error description: "& err &"</p>")
	End If

	Response.End
End If

Set params = CreateObject("Scripting.Dictionary")
params("code") = code
params("client_id") = "사용자입력"
params("client_secret") = "사용자입력"
params("redirect_uri") = "http://도메인/oauth2callback"
params("grant_type") = "authorization_code"

Set xmlHttp = CreateObject("MSXML2.ServerXMLHTTP")

action_url = "https://accounts.google.com/o/oauth2/token"

param = ""
For Each f in params
	v = params(f)
	param = param & f &"="& v &"&"
Next
If param <> "" Then
	param = Left(param, Len(param)-1)
End If

Call xmlHttp.open("POST", action_url, False)
Call xmlHttp.setRequestHeader("POST", "/o/oauth2/token HTTP/1.1")
Call xmlHttp.setRequestHeader("Host", "accounts.google.com")
Call xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")
Call xmlHttp.Send(param)

If xmlHttp.Status >= 400 And xmlHttp.Status <= 599 Then
	Response.Write "<br>Error Occured: " & xmlHttp.statusText
Else
	'Google will respond to your POST request by returning a JSON object
	'that contains a short-lived access token and a refresh token.
	'{
	'  "access_token" : "액세스 토큰",
	'  "token_type" : "Bearer",
	'  "expires_in" : 3600,
	'  "refresh_token" : "재생성 토큰"
	'}

	'ReturnData = Replace(xmlHttp.responseText, "&", ",")
	Response.ContentType = "application/json"
	Response.Charset = "utf-8"
	Response.Write xmlHttp.responseText

	'// TODO: Process response and store tokens

End If
%>


브라우저 기반 업로드

https://developers.google.com/youtube/2.0/developers_guide_protocol_browser_based_uploading요약하자면...
  1. 동영상의 제목, 설명, 카테고리, 태그 등을 입력 받는 폼.
  2. 1.의 값들과 구글 인증과정을 통해 얻은 Access Token을 가지고 동영상 파일 업로드 연동 폼.
  3. 업로드된 동영상의 id 응답 받음. (http://www.youtube.com/watch?v=id)
1. 은 일반적인 폼이므로 알아서 그냥 구현.

2. 유튜브에 동영상 파일 업로드 폼은 아래와 같이 구현해보았습니다.
<% '// https://developers.google.com/youtube/2.0/developers_guide_protocol_browser_based_uploading

'// https://developers.google.com/youtube/2.0/reference#youtube_data_api_tag_media:group
'// 동영상 제목
title = "Bad Wedding Toast"
'// 동영상 설명
description = "I gave a bad toast at my friend's wedding."
'// 동영상 카테고리
category = "People"
'// 동영상 태그
keywords = "toast,wedding"

Set xmlHttp = CreateObject("MSXML2.ServerXMLHTTP")
ACCESS_TOKEN = "액세스 토큰"
YOUTUBE_DEV_KEY = "개발자 키"
URLString = "http://gdata.youtube.com/action/GetUploadToken"
SendString = "<?xml version=""1.0""?>"&_
"<entry xmlns=""http://www.w3.org/2005/Atom"" "&_
"	xmlns:media=""http://search.yahoo.com/mrss/"" "&_
"	xmlns:yt=""http://gdata.youtube.com/schemas/2007"">"&_
"	<media:group>"&_
"		<media:title type=""plain"">"& title &"</media:title>"&_
"		<media:description type=""plain"">"& description &"</media:description>"&_
"		<media:category scheme=""http://gdata.youtube.com/schemas/2007/categories.cat"">"& category &"</media:category>"&_
"		<media:keywords>"& keywords &"</media:keywords>"&_
"	</media:group>"&_
"</entry>"
' SendString = "Authorization: AuthSub token=" & ACCESS_TOKEN
Call xmlHttp.open("POST", URLString, False)
Call xmlHttp.setRequestHeader("POST", "/action/GetUploadToken HTTP/1.1")
Call xmlHttp.setRequestHeader("Host", "gdata.youtube.com")
Call xmlHttp.setRequestHeader("Authorization", "Bearer "& ACCESS_TOKEN)
'Call xmlHttp.setRequestHeader("Authorization", "AuthSub token="& accessToken)
Call xmlHttp.setRequestHeader("GData-Version", "2")
Call xmlHttp.setRequestHeader("X-GData-Key", "key=" & YOUTUBE_DEV_KEY)
'Call xmlHttp.setRequestHeader("Content-Length", "<content_length>")
Call xmlHttp.setRequestHeader("Content-Type", "application/atom+xml; charset=UTF-8")
Call xmlHttp.Send(SendString)

If xmlHttp.Status >= 400 And xmlHttp.Status <= 599 Then
	Response.Write "<br>Error Occured: " & xmlHttp.statusText
	Response.End
End If

'ReturnData = Replace(xmlHttp.responseText, "&", ",")
'Response.ContentType = "text/xml"
'Response.Charset = "utf-8"
If xmlHttp.responseText = "" Then
	Response.Write "<br>Error Occured: No response."
	Response.End
End If

'// XML 컨트롤러 생성
Set oXml = Server.CreateObject("MSXML2.DomDocument.6.0")
oXml.async = false
oXml.LoadXML(xmlHttp.responseText)
'// XML로부터 url 추출
xPath = "/response/url"
If NOT oXml.SelectSingleNode(xPath) Is Nothing Then
	Set itemNode = oXml.SelectSingleNode(xPath)
	URL = itemNode.Text
End If
Set itemNode = Nothing
'// XML로부터 token 추출
xPath = "/response/token"
If NOT oXml.SelectSingleNode(xPath) Is Nothing Then
	Set itemNode = oXml.SelectSingleNode(xPath)
	TOKEN = itemNode.Text
End If
Set itemNode = Nothing
Set oXml = Nothing

If URL = "" Or TOKEN = "" Then
	Response.Write "<br>Error Occured: The response could not parsing."
	Response.End
End If
%>
<!DOCTYPE HTML>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title>Upload to YouTube</title>
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
</head>
<body>
	<form id="frm" name="frm" action="<%=URL%>?nexturl=<%=Server.UrlEncode("http://"& Request.ServerVariables("HTTP_HOST") &"/dev/youtube/upload_result.asp")%>" method="post"
	  enctype="multipart/form-data" onsubmit="return checkForFile();">
	  <input id="file" type="file" name="file" />
	  <input type="hidden" name="token" value="<%=TOKEN%>" />
	  <input type="submit" value="UPLOAD" />
	  <div id="errMsg" style="display:none;color:red">You need to specify a file.</div>
	</form>

	<script type="text/javascript">
	function checkForFile() {
		if ($('#file').val()) {
			return true;
		}

		$('#errMsg').show();
		return false;
	}
	</script>
</body>
</html>

3. 업로드된 동영상의 id 응답 받기를 아래와 같이 구현해보았습니다.
<% '// 동영상 업로드 폼 upload.asp에서 업로드 처리 후 form action 에서 지정한 nexturl 경로가 바로 이것.
'응답값 예시: status=200&id=1234abcd
stat = Request.Querystring("status")
If stat <> 200 Then
	Response.Write "<br>Error Occured: Uploading."
	Response.End
End If

id = Request.Querystring("id")
%>
<!DOCTYPE HTML>
<html lang="ko">
<head>
	<meta charset="UTF-8">
	<title></title>
</head>
<body>
	<a href="http://www.youtube.com/watch?v=<%=id%>" target="_blank">업로드한 동영상 보기</a>
</body>
</html>

참고


댓글