# 网站应用

更新时间：2024-11-14 20:51:54

# 一、介绍

该文档旨在说明网站应用接入快手授权的准备工作和接入流程，指导开发者快速完成授权接入工作。

# 二、准备工作

开发者需要在快手开放平台完成注册，新建一个网站应用，并获取应用标识appId 和 appSecret，详细参考申请注册流程。

注册时的注意事项

明确回调地址。在授权过程中会以此来检查回调地址的 schema 和 子域名（非根域名）
按需求申请对应的权限 scope，后续授权过程中会使用。

# 三、获取授权码

目前网页应用提供2种授权方式,分别为 网页登陆后授权模式 和 手机扫码授权模式

# 1. 网页登陆后授权模式

按照规则拼接获取授权码的URL，并作为授权入口放置到开发者自己的网页内。实例如下：

https://open.kuaishou.com/oauth2/authorize?app_id=your_app_id&scope=user_info&response_type=code&ua=pc&redirect_uri=your_callback_url&state=your_state

如果未登录，则携带来源地址，302到快手登录页。需要用户使用快手客户端扫码登录（登录二维码过期时间为2分钟，之后需要用户手动刷新）或手机号+验证码/密码登录，之后再跳转回授权页。
如果已登录，则携带参数，302到授权页。
用户在授权页点击授权后跳转到回调页
不支持将上述链接生成二维码后扫码授权,扫码授权请使用手机扫码授权模式

1.1 URL 域名

https://open.kuaishou.com

1.2 请求路径

GET /oauth2/authorize

1.3 请求参数

名称	类型	是否必填	说明
app_id	string	是	注册时获取的应用ID
scope	string	是	注册时申请的权限标识，多个scope可以使用","分割,代表需要用户授权什么能力,例如需要向用户快手账号下上传视频时,申请的scope需要包含user_video_publish
response_type	string	是	写死 code
redirect_uri	string	是	授权成功后的回调地址，必须以http/https开头。和注册时的回调地址保持`schema`和`子域名`一致
state	string	否	安全参数，标识和用户或者设备相关的授权请求。建议开发者实现。回调的时候会带回。
ua	string	否	运行环境,普通网页传pc, H5网页不传此参数即可

1.4 返回结果

成功授权：开放平台将授权码回调给第三方网站的回调地址，示例如下：

your\_callback\_uri?code=xxxxxxxx&state=your_state

失败授权：开发平台将错误信息回调给第三方网站的回调地址，示例如下：

your\_callback\_uri?error=200102&error_msg=invlaid uri

# 2. 手机扫码授权模式

手机扫码模式有两种模式, 分别为动态二维码模式 和 静态二维码模式 。

下面针对于2种方式分别做陈述:

2.1 动态二维码模式

此链接为一个网页,请嵌入你的网页中
此页面会展示二维码供用户使用客户端扫码授权。此二维码为动态二维码,不支持输出为线下物料。
将在快手客户端展示授权页面，用户点击授权后,展示二维码的页面跳转
二维码有过期时间

最佳实践

按照规则拼接获取授权码的URL，并作为授权入口放置到开发者自己的网页内。
建议在界面中嵌入一个iframe或者打开一个新窗体的方式

2.1.1 URL 域名

https://open.kuaishou.com

2.1.2 请求路径

GET /oauth2/connect

2.1.3 请求参数

名称	类型	是否必填	说明
app_id	string	是	注册时获取的应用ID
scope	string	是	注册时申请的权限标识，多个scope可以使用","分割
response_type	string	是	写死 code
redirect_uri	string	是	授权成功后的回调地址，必须以http/https开头。和注册时的回调地址保持`schema`和`子域名`一致
state	string	否	安全参数，标识和用户或者设备相关的授权请求。建议开发者实现。回调的时候会带回。
size	number	否	该字段定义页面上二维码的大小。默认为 280px * 280px，若需要改变二维码大小，需定义该字段。
href	string	否	自定义css样式链接地址，第三方可根据实际需求覆盖默认样式，详情见下方示例。详情见下方FAQ

2.1.4 返回结果

成功授权：开放平台在打开二维码的界面将授权码回调给第三方网站的回调地址，示例如下：

your\_callback\_uri?code=xxxxxxxx&state=your_state

2.1.5 示例数据

https://open.kuaishou.com/oauth2/connect?app_id=your_app_id&scope=user_info&response_type=code&redirect_uri=your_callback_url&state=your_state

2.2 静态二维码模式

此链接返回一个二维码图片，展示二维码供用户使用快手客户端扫码授权, 此二维码有效期为1年。
将在快手客户端展示授权页面，用户点击授权后,在快手APP内打开回调地址界面,回传授权码和state。

最佳实践

此二维码可以输出为线下物料,供线下扫码授权使用。
回调地址是打开在快手APP内,注意展示适配
如果二维码载体需要获取授权结果(例如嵌入式设备),可使用的二维码的state参数,标识此次扫码行为的唯一标识,开放平台会在授权成功后,将授权码和state回传到开发者服务器,二维码载体使用唯一标识向自己的服务器轮训此次结果即可。

2.2.1 URL 域名

https://open.kuaishou.com

2.2.2 请求路径

GET /oauth2/qr_code

2.2.3 请求参数

名称	类型	是否必填	说明
app_id	string	是	注册时获取的应用ID
scope	string	是	注册时申请的权限标识，多个scope可以使用","分割,代表需要用户授权什么能力,例如需要向用户快手账号下上传视频时,申请的scope需要包含user_video_publish
response_type	string	是	写死 code
redirect_uri	string	是	授权成功后的回调地址，必须以http/https开头。和注册时的回调地址保持`schema`和`子域名`一致,此场景下,redirect_uri必须是一个公网可访问的地址
state	string	否	自定义参数，可以标识用户或者设备相关的授权请求。回调的时候会带回。
qr_size	int	否	二维码大小,最小不小于64,最大不大于1000,默认450。
type	string	否	返回值类型,可选`img`和`path`,选择`img`会返回二维码图片,选择`path`会返回二维码内容的地址,开发者可以自己生成二维码。默认 `img` 。
debug	bool	否	时候开启调试模式,开启后,在用户授权失败时,会在快手APP内显示调试信息,可以根据调试信息来调试.默认false

2.2.4 返回结果

成功授权：开放平台在快手APP内打开界面将授权码和state回调给第三方网站的回调地址，注意:此界面是打开在快手APP内,注意展示适配 。示例如下：

your\_callback\_uri?code=xxxxxxxx&state=your_state

2.2.5 示例数据

https://open.kuaishou.com/oauth2/qr_code?app_id=your_app_id&scope=user_info&response_type=code&redirect_uri=your_callback_url&state=your_state&qr_size=300

开发者使用时，必须先自行调试，调试无问题后方可上线。

# 四、获取 accessToken

拿到授权码之后，开发者即可参考快手登录章节的说明，获取accessToken

# 五、撤销Web的登录态

如果想撤销Web的登录态，实现切换快手登录帐号的需求，可以在页面上放置如下请求：

https://open.kuaishou.com/rest/infra/n/logout?sid=kuaishou.oauth&followUrl=https://open.kuaishou.com/

用户点击该链接后，会清除浏览器当前的快手登录cookie。之后再次进行用户授权时，会302到快手登录页请求用户重新登录。这样就实现了切换帐号的需求。
该链接不支持跨域，如果要在第三方页面内嵌入，请使用iframe模式。

# FAQ

1.https://open.kuaishou.com/oauth2/connect页面的二维码原始UI是什么样？
答：下面列出了待扫码态、扫码成功、超时、二维码获取错误、用户取消授权、用户授权成功的六种样式：

2.怎么自定义二维码的显示大小？
答：二维码本身默认是280px *280px，若需要改变，只需要在url的query里面添加size参数。假设要将二维码大小设置为150px * 150px，url拼接示例：
https://open.kuaishou.com/oauth2/connect?app_id=XXXXXX&scope=XXXX&redirect_uri=XXXXX&state=1&size=150，效果如下图：

3.怎么自定义二维码的样式，比如要修改页面背景色、二维码所在区域背景色、是否显示“快手登录”、页面内字体颜色、字体大小、二维码大小、间距大小、是否显示快手icon等？
答：通过将自定义css样式链接地址赋值给href参数实现自定义ui样式。比如将页面的黑色背景该为白色、改变二维码所在区域白色框的颜色为灰色、改变“快手登录”四个字的字体大小。示例css链接文件地址：https://ali.static.yximgs.com/kos/nlav10382/normal/qr-href.010f6dbce3ab37fd.css (opens new window)，url拼接示例：https://open.kuaishou.com/oauth2/connect?app_id=XXXXXX&scope=XXXX&redirect_uri=XXXXX&state=1&&href=https://ali.static.yximgs.com/kos/nlav10382/normal/qr-href.010f6dbce3ab37fd.css&size=150
效果如下：

4.可以自定义哪些元素的css样式，页面结构是什么样呢？
答：页面元素结构：

// 页面整体元素  
.oauth {}  
  
// 页面中白框所在元素，也就是二维码所在的白色框体  
.oauth .qr-code {}  
  
// "快手登录"字体样式  
.oauth .qr-code .qr-title {}  
  
// 二维码中间的快手logo  
.oauth .qr-code-logo {}  
  
// 二维码下方文案样式  
.oauth .qr-refresh-text {}  
  
// 二维码下方解释文案的icon  
.oauth .qr-refresh-text img {}  
  
// 二维码错误时的背景图片  
.oauth .qr-code-error {}

详情可以参考示例css文件：
https://ali.static.yximgs.com/kos/nlav10382/normal/qr-href.010f6dbce3ab37fd.css (opens new window)
https://ali.static.yximgs.com/kos/nlav10382/normal/pure-qr.4029bea4899bf8b1.css (opens new window)

# 网站应用

# 一、 介绍

# 二、 准备工作

# 三、获取授权码

# 1. 网页登陆后授权模式

# 2. 手机扫码授权模式

# 四、获取 accessToken

# 五、撤销Web的登录态

# FAQ

# 一、介绍

# 二、准备工作