Asp.Net MVC實現優酷（youku）Web的上傳

時間 2019-11-19

標籤 asp.net asp mvc 實現優酷 youku web 上傳欄目 ASP 简体版

原文原文鏈接

優酷第三方上傳API沒有.NET版本的SDK，讓從事.NET開發人員要實現開放平臺上傳文件無從下手。本文通過一天的預讀優酷文檔，以NET方式實現了視頻上傳。php

參考：css

優酷開放文檔 http://open.youku.com/html

強烈鄙視優酷團隊既然沒有NET版本SDKnode

原本覺得能夠經過合做級別受權，文檔裏面說經過合做級別受權自須要用戶名和密碼，而後去申請合做者身份，優酷客服告知不容許申請。jquery

哎，只能硬着頭皮去用NET採用通用受權方式去實現。數據庫

通用受權思路：bootstrap

一、請求用戶受權，跳出頁面優酷登入受權頁面。運行受權後獲取受權Codeapi

二、經過受權Code換取AccessToken，完成受權。session

三、而後利用AccessToken進行js上傳視頻。ide

下面是上傳demo的實現代碼

 public class HomeController : Controller
 {
        private string ClidentID = "您的clientid";
        private string ClientSecret = "28938bb551381999eb5e365d429e19a7";
      
        private string AccessTokenUrl = "https://openapi.youku.com/v2/oauth2/token";
        private string Code = "";
}

一、跳轉到受權頁面
public ActionResult Oauth()
{
　　var url = "https://openapi.youku.com/v2/oauth2/authorize?client_id=你的ClientID&response_type=code&redirect_uri=http://您的域名/youku/home/Callback";
　　return Redirect(url);
}

　二、Callback獲取Code

public ActionResult Callback(string code, string state)
{
   Session.Add("Code", code); // 這裏爲了演示暫時採用session進行存儲。實際狀況能夠存在文件或者數據庫中。
   FileLogHelper.WriteLog(code);
   return Content(code + "...........State=" + state);
}

　三、經過Code獲取AccessToken

public ActionResult Index()
{
    ViewBag.ClientId = ClidentID;
     if (Session["Code"] != null)
     {
           Code = (string) Session["Code"];
           FileLogHelper.WriteLog("session=" + Code);
           ViewBag.AccessToken = GetAccessToken();
      }
      else
      {
            ViewBag.AccessToken = GetAccessToken();
       }

       return View();            
}

　GetAccessToken（）方法

　　　　private string GetAccessToken()
        {
            if (Session["AccessToken"] == null)
            {
                var stringADict = new Dictionary<string, string>();
                stringADict.Add("client_id", ClidentID);
                stringADict.Add("client_secret", ClientSecret);
                stringADict.Add("grant_type", "authorization_code");
                stringADict.Add("code", Code);
                stringADict.Add("redirect_uri", "http://www.forfutures.com:33366/youku/home/Callback");
                var result = Post.PostGetJson<AccessToken>(AccessTokenUrl, null, stringADict);
                Session["AccessToken"] = result.access_token;
                return result.access_token;

            }

            return Session["AccessToken"] as string;
        }

　　Index.chtml

@{
    Layout = null;
}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META name="Generator" content="EditPlus">
  <META name="Author" content="">
  <META name="Keywords" content="">
  <META name="Description" content="">
  <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
 </HEAD>
<link href="http://open.youku.com/assets/lib/bootstrap2.1.0/css/bootstrap.css" rel="stylesheet">
    <link href="http://open.youku.com/assets/lib/bootstrap2.1.0/css/bootstrap-responsive.css" rel="stylesheet">
    <script src="http://open.youku.com/assets/lib/jquery-1.8.1.min.js"></script>
    <script src="http://open.youku.com/assets/lib/uploadjs.php"></script>
 <BODY>
    <div id="youku-upload">
        <div class="container">
            <form class="well form-horizontal" name="video-upload">
                <fieldset>
                            <div class="control-group">
                        <label class="control-label" for="spanSWFUploadButton">選擇文件：</label>
                        <div id="uploadControl" class="controls"></div>
                    </div>
                    <div class="control-group">
                       <label class="control-label" for="input01">標題：</label>
                      <div class="controls">
                          <input type="text" class="input-xlarge" id="input01" name="title">
                      </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="textarea">簡介：</label>
                    <div class="controls">
                        <textarea class="input-xlarge" id="textarea" rows="3" name="description"></textarea>
                    </div>
                </div>
                   <div class="control-group">
                       <label class="control-label" for="input02">標籤：</label>
                       <div class="controls">
                          <input type="text" class="input-xlarge" id="input02" name="tags">
                          <span class="help-inline"></span>
                      </div>
                   </div>
               <div class="control-group">
                    <label class="control-label" for="category-node">類別：</label>
                    <div class="controls">
                        <select id="category-node" name="category" ></select>
                     </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">版權全部</label>
                   <div class="controls">
                   <label class="radio inline">
                        <input type="radio" name="copyright_type" id="copyright_type2" value="original" checked="">原創
                    </label>
                    <label class="radio inline">
                   <input type="radio" name="copyright_type" id="copyright_type1" value="reproduced">轉載
               </label>
     </div>
    </div>
    <div class="control-group">
       <label class="control-label">視頻權限</label>
          <div class="controls">
                 <label class="radio inline">
                   <input type="radio" name="public_type" id="public_type1" value="all" checked="">公開
                 </label>
                 <label class="radio inline">
                   <input type="radio" name="public_type" id="public_type2" value="friend">僅好友
                 </label>
                 <label class="radio inline">
                    <input type="radio" name="public_type" id="public_type3" value="password">輸入密碼觀看
                 </label>
                 <label class="radio inline" style="display:none" id="passwrod">
                    <input type="text" class="input "name="watch_password">
                 </label>
         </div>
    </div>
    <div class="form-actions">
            <button type="submit" class="btn btn-primary start" id="btn-upload-start">
             <i class="icon-upload icon-white"></i>
        <span>開始上傳</span>
        </button>
    </div>
    </fieldset>
    </form>
    <div class="row" >
        <div class="span5" id="upload-status-wraper" ></div>
    </div>
    <br>
    <div class="well"><h3>說明</h3><ul><li>最大支持上傳<strong>1 GB</strong> 視頻文件</li><li>容許上傳的視頻格式爲：wmv,avi,dat,asf,rm,rmvb,ram,mpg,mpeg,3gp,mov,mp4,m4v,dvix,dv,dat,</br>mkv,flv,vob,ram,qt,divx,cpk,fli,flc,mod。不符合格式的視頻將會被丟棄，請確保視頻格式的正確性，避免上傳失敗</li><li></li></ul>
    </div>
    </div>
    <!--完成上傳的DOM和登陸DOM 開始-->
    <div id="complete"></div>
    <div id="login" style="width:100%;height:100%;position:fixed;z-index:999;left:0px;top:0px;overflow:hidden;display:none;">
    </div>
    <!--完成上傳的DOM和登陸DOM 結束-->
 </BODY>
 <script>
     var USE_STREAM_UPLOAD = true;
     jQuery(document).ready(function () {
         var param = { client_id: " 8fb430c56b72c78c", access_token: "@ViewBag.AccessToken", oauth_opentype: "iframe", oauth_redirect_uri: "http://www.forfutures.com:33366/youku/home/Oauth", oauth_state: "", completeCallback: "uploadComplete", categoryCallback: "categoryLoaded" };
         youkuUploadInit(param);

     });

     //上傳完成時回調方法
     function uploadComplete(data) {
         alert("videoid=" + data.videoid + ";title=" + data.title);
     }

     //分類加載後回調方法
     function categoryLoaded(data) {
         if (data.categories) {
             var tpl = '';
             for (var i = 0; i < data.categories.length; i++) {
                 if (data.categories[i].term == 'Ads') {
                     tpl += '<option value="' + data.categories[i].term + '" selected>' + data.categories[i].label + '</option>';
                 } else {
                     tpl += '<option value="' + data.categories[i].term + '" >' + data.categories[i].label + '</option>';
                 }
             }
             $("#category-node").html(tpl);
         }
     }
    </script>
</HTML>