分享

教你网站中如何嵌入百度网盘:百度网盘Widget

pig2 发表于 2014-5-17 14:58:29 [显示全部楼层] 只看大图 回帖奖励 阅读模式 关闭右栏 0 33529
本帖最后由 pig2 于 2014-9-29 01:34 编辑
问题导读:
1.Widget是什么?
2.如何申请百度网盘开发?
3.如何把百度网盘嵌入网站,给用户使用?






百度网盘Widget介绍
百度网盘Widget是百度网盘基于PCS为站长推出的一款工具,站长在网站里植入Widget后,用户就可以在网站打开网盘里的资源、并进行预览、编辑和分享等操作。同时用户也可以把网站的资源,一键保存到自己的网盘里。

使用示例
总体介绍
本文主要介绍如何在第三方网站加入网盘Widget,使用户实现“从第三方网站打开百度网盘”及“将第三方网站内容转存到百度网盘”功能。
操作步骤
1. 创建应用,登录百度开发者中心,单击“创建应用”,创建一个新应用,记录API KEY,本例中API KEY为“1xZDB2x8hoQW0NbKjGvyHBZG”,创建应用详细操作步骤请参考创建应用。

注意:
在正式开发网站Widget前需要将应用与域名绑定,绑定方式:

请在创建应用时按网站提示绑定域名;
创建应用后,在“管理中心”单击已创建的应用名称>“开放API管理”,绑定域名。

2. 申请使用PCS REST API,申请方式及邮件内容请参考申请使用REST API
注意:
使用百度网盘Widget必须先申请PCS REST API使用权限。

3. 获取Access_Token,详细操作步骤请参考获取Access_Token
4. 引入JS文件,请在页面头中引用:
  1. <script type="text/javascript" src="https://baoheapi.baidu.com/res/static/js/buss/widget_loader.js"></script>
复制代码
5. 为了在一个节点里,生成一个“打开百度网盘”按钮,在html里添加:
  1. <span id="open"></span>
复制代码
6. 开发网站Widget。
  1. BDWidget.init('1xZDB2x8hoQW0NbKjGvyHBZG',function(){
  2.                         this.open({
  3.                                 ele : document.getElementById('open'),
  4.                                 size:'small',//button大小
  5.                                 onSuccess:function(data){
  6.                                         console.log(data);//文件的信息 (文件名、下载地址、文件大小等)
  7.                                 },
  8.                                 onCancel:function(){
  9.                                         console.log('cancel');
  10.                                 }
  11.                         })
  12.                         .transfer({
  13.                                 ele : document.getElementById('transfer'),
  14.                                 size:'large',
  15.                                 url : 'http://中国人/',
  16.                                 onSuccess:function(){
  17.                                         console.log('success');
  18.                                 },
  19.                                 onFailed:function(data){
  20.                                         console.log(data);// case -1 url为空;case 1 url不符合规范;case 2 url无法连通
  21.                                 },
  22.                                 onCancel:function(){
  23.                                         console.log('cancel');
  24.                                 }
  25.                         });
  26.                 });
复制代码

操作结果
  • 运行程序,结果为:
widgetresult.jpg
  • 单击“打开百度网盘”,用户授权后(授权页面参考下图,输入百度账号密码后进行授权),即可在第三方网站直接打开用户百度网盘,读取文件。
  • 单击“转存到百度网盘”,用户授权后(授权页面参考下图,输入百度账号密码后进行授权),即可将第三方网站资源转存到用户的百度网盘。
widgetresult1.jpg


运行示例:
http://netdiskwidget.duapp.com/thirdparty.html

没找到任何评论,期待你打破沉寂

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

推荐上一条 /2 下一条