如何将访问令牌从.NET(代码隐藏)传递到Javascript

如何将访问令牌从.NET(代码隐藏)传递到Javascript,javascript,c#,.net,youtube-api,google-api-dotnet-client,Javascript,C#,.net,Youtube Api,Google Api Dotnet Client,我想通过.NET framework使用我自己的API密钥、密钥和刷新令牌进行授权,然后将访问令牌传递给JavaScript,这样我就可以直接将视频上传到YouTube,并带有进度指示器 我有一个可以完成直接上传到我的频道[未经授权],但你没有得到进度指示,这可能需要相当长的时间,文件必须先上传到我的服务器,然后上传到YouTube服务器 服务器端访问代码与客户端访问代码不同吗?如果没有: 如何在服务器端获取访问代码?获取字符串 ***如何通过JavaScript将其传递给Google API?

我想通过.NET framework使用我自己的API密钥、密钥和刷新令牌进行授权,然后将访问令牌传递给JavaScript,这样我就可以直接将视频上传到YouTube,并带有进度指示器

我有一个可以完成直接上传到我的频道[未经授权],但你没有得到进度指示,这可能需要相当长的时间,文件必须先上传到我的服务器,然后上传到YouTube服务器

服务器端访问代码与客户端访问代码不同吗?如果没有:

如何在服务器端获取访问代码?获取字符串 ***如何通过JavaScript将其传递给Google API?不是怎么写,而是在哪里传递? 我很清楚公开访问令牌的安全风险,但这些令牌确实会过期,对吗?作为奖励,我如何缩短过期时间。这也是在一个受密码保护的网页内完成的,并且您不会获得“客户端密码”或“刷新令牌”

***更新-我想我在MediaUploader对象中找到了传递令牌的位置


好的,经过几周对API、.NET和JavaScript文档的深入研究,我构建了以下解决方案

按照计划,把钥匙都准备好。选择OAuth、Web应用程序,并为Javascript和重定向代码输入URI

接下来使用获取刷新代码

一旦你有了你的客户id、客户秘密和刷新令牌,你就可以开始摇滚了

此代码通过代码隐藏进行一个简单的HTTP/REST调用,以获得一个有效时间为3600秒(默认值)的access_令牌。然后将此字符串传递给JavaScript代码以供使用****警告****

除了cors_upload.js文件之外,它不使用任何.NET或JavaScript库

阿拉斯,密码 Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="ApisCallTest.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta charset="utf-8" />
    <title>YouTube API Uploads via CORS</title>
    <style>
      #disclaimer {
        font-size: 0.75em;
        color: #aeaeae;
        max-width: 350px;
      }
      .during-upload { display: none; }
      label { display: block; }
      input[type="text"],
      textarea,
      progress {
        font-size: 16px;
        width: 15em;
        margin-bottom: 1em;
        padding: 0.5em;
        font-family: "Open Sans", sans-serif;
      }
    </style>
</head>
  <body>
    <div>
    <input input type="file" id="file" class="button" accept="video/*" />
    <button id="button">Upload Video</button>
    </div>
    <div class="during-upload">
    <p><span id="percent-transferred"></span>% done (<span id="bytes-transferred"></span>/<span id="total-bytes"></span> bytes)</p>
    <progress id="upload-progress" max="1" value="0"></progress>
    </div>
    <p id="disclaimer">By uploading a video, you certify that you own all rights to the content or that you are authorized by the owner to make the content publicly available on YouTube, and that it otherwise complies with the YouTube Terms of Service located at <a href="http://www.youtube.com/t/terms" target="_blank">http://www.youtube.com/t/terms</a></p>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="cors_upload.js"></script>
    <script>
      $('#button').on("click", goForUpload);
      function goForUpload() {
        if ($('#file').get(0).files[0]) {
          $('#button').attr('disabled', true);
          var uploadStartTime = 0;
          var metadata = {
            snippet: {
              title: 'PUT YOU TITLE HERE',
              description: 'THIS IS YOUR VIDEO DESCRIPTION',
              categoryId: '22'
            },
            status: {
              privacyStatus: 'unlisted'
            }
          };

          var uploader = new MediaUploader({
            baseUrl: 'https://www.googleapis.com/upload/youtube/v3/videos',
            file: $('#file').get(0).files[0],
            token: '<%= access_token %>',
            metadata: metadata,
            params: {
              part: Object.keys(metadata).join(',')
            },
            onError: function (data) {
              var message = data;
              // Assuming the error is raised by the YouTube API, data will be
              // a JSON string with error.message set. That may not be the
              // only time onError will be raised, though.
              try {
                var errorResponse = JSON.parse(data);
                message = errorResponse.error.message;
              } finally {
                alert(message);
              }
            },
            onProgress: function (data) {
              var currentTime = Date.now();
              var bytesUploaded = data.loaded;
              var totalBytes = data.total;
              // The times are in millis, so we need to divide by 1000 to get seconds.
              var bytesPerSecond = bytesUploaded / ((currentTime - this.uploadStartTime) / 1000);
              var estimatedSecondsRemaining = (totalBytes - bytesUploaded) / bytesPerSecond;
              var percentageComplete = (bytesUploaded * 100) / totalBytes;

              $('#upload-progress').attr({
                value: bytesUploaded,
                max: totalBytes
              });

              $('#percent-transferred').text(percentageComplete);
              $('#bytes-transferred').text(bytesUploaded);
              $('#total-bytes').text(totalBytes);

              $('.during-upload').show();
            },
            onComplete: function (data) {
              var uploadResponse = JSON.parse(data);
              alert('all done, you can store this id: ' + uploadResponse.id)
            }
          });
          uploadStartTime = Date.now();
          uploader.upload();
        }
      }
    </script>
  </body>
</html>
和Default.aspx.cs

using System;
using System.Collections.Generic;
using System.Net.Http;
using System.Threading.Tasks;
using Newtonsoft.Json.Linq;

namespace ApisCallTest
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        private static readonly HttpClient client = new HttpClient();
        public string access_token;
        protected void Page_Load(object sender, EventArgs e)
        {
            var values = new Dictionary<string, string>
            {
               { "client_id", "REPLACE_ME" },
               { "client_secret", "REPLACE_ME" },
               { "refresh_token", "REPLACE_ME" },
               { "grant_type", "refresh_token" }
            };

            var content = new FormUrlEncodedContent(values);
            var response = client.PostAsync("https://www.googleapis.com/oauth2/v4/token", content);
            string json = response.Result.Content.ReadAsStringAsync().Result;
            dynamic obj = JObject.Parse(json);
            access_token = obj.access_token;
        }
    }
}
结果。。。从一个受密码保护的网页上,我可以让用户将未列出的视频上传到我的频道,并存储视频ID,以便以后将该视频嵌入到我的网站上


至于****警告****,这是一个安全问题,因为您将非常直接地向公众公开您的个人访问密钥。它只持续1个小时,但无论您使用何种访问权限,都可以让任何人使用它。尝试稍微观察一下密钥是个好主意,至少,不要在一个公开的页面上做这件事。

我想我找到了我需要的东西。我将在星期一回到它:快乐周末的人们:也许你应该考虑从你的后端上传,而不是客户端。这是一个额外的工作负载,但保留您的密钥保存,保存在它所属的位置。@Nikolaus向我展示一些代码来执行此操作,并显示进度指示,我完全同意!谢谢,这对我有帮助。谷歌自己的文档在所有帮助程序库的帮助下都无可救药地完成了。上传视频只需三个简单的http请求。OAuth游乐场的诀窍是转到齿轮图标的设置,然后选中使用您自己的OAuth凭据。
using System;
using System.Collections.Generic;
using System.Net.Http;
using System.Threading.Tasks;
using Newtonsoft.Json.Linq;

namespace ApisCallTest
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        private static readonly HttpClient client = new HttpClient();
        public string access_token;
        protected void Page_Load(object sender, EventArgs e)
        {
            var values = new Dictionary<string, string>
            {
               { "client_id", "REPLACE_ME" },
               { "client_secret", "REPLACE_ME" },
               { "refresh_token", "REPLACE_ME" },
               { "grant_type", "refresh_token" }
            };

            var content = new FormUrlEncodedContent(values);
            var response = client.PostAsync("https://www.googleapis.com/oauth2/v4/token", content);
            string json = response.Result.Content.ReadAsStringAsync().Result;
            dynamic obj = JObject.Parse(json);
            access_token = obj.access_token;
        }
    }
}