将第三方OAuth添加到支持应用程序

在本教程中，您将创建一个私有Zendesk Support应用程序亚博oauth设置来管理第三方OAuth访问令牌。

Ze亚博ndesk管理员可以使用该应用程序将任务添加到他们的Todoist来自代理工作区的收件箱。当管理员安装应用程序时oauthsetting显示相关的OAuth提示符。

管理员可以使用此提示为Todoist创建和存储OAuth访问令牌。应用程序使用设置的访问令牌来代表管理员发出Todoist REST API请求。

免责声明:亚博Zendesk提供本文仅用于教学目的。亚博Zendesk不支持本教程中的应用程序或示例代码。

你需要什么

要完成本教程，您需要以下内容:

拥有亚博Zendesk Suite增长计划或以上版本，或支持专业人员计划或以上版本的Zendesk帐户。要获取免费的合格帐户进行测试，请参见获得开发的试用或赞助帐户．
Zend亚博esk命令行接口。要安装或升级ZCLI，请参见安装和更新ZCLI．您还需要使用Zendesk帐户验证ZCLI。亚博看到身份验证在ZCLI文档中。
ZCLI取代了Zendesk App亚博s Tools (ZAT)， ZAT目前处于维护模式。若要改用ZAT，请参阅安装和使用ZAT．
熟悉亚博Zendesk应用框架(ZAF)和ZAF客户的请求()方法。在开始之前，请完成构建第一个支持应用程序教程和阅读从Zendesk应用程序发出API请求亚博．
熟悉基本的OAuth 2.0概念，例如OAuth流和访问令牌。要了解更多关于OAuth的信息，请查看对应用程序使用OAuth身份验证．
Todoist帐户。Todoist提供免费计划。要创建Todoist帐户，请参见创建一个Todoist帐户在Todoist的帮助下。

创建应用程序文件

首先，为一个名为添加Todoist任务．

在你的shell中，导航到你想要存储应用程序的文件夹。

               
                cd项目

在文件夹中运行:

               
                zcli应用:新

在提示符下，输入以下值:
- 目录名称:add_todoist_tasks
- 作者姓名:您的姓名
- 作者邮箱:您的邮箱地址
- 作者网站:留空并按Enter。
- 应用名称:添加待办事项任务
中创建应用程序启动器文件add_todoist_tasks文件夹中。

建立Todoist

要使用Todoist REST API，首先需要注册一个Todoist应用程序。该应用程序包括一个OAuth客户端。在本教程中，创建一个名为添加Ze亚博ndesk任务．

登录Todoist，然后转到https://developer.todoist.com/appconsole.html．点击创建一个新应用程序．
2 .在“创建应用”页面输入添加Ze亚博ndesk任务作为应用程序的名称。离开应用服务URL空白。点击创建应用程序．
下应用程序设置，输入“https://” Zis.亚博zendesk.com/api/services/zis/connections/oauth/callback”作为OAuth重定向URL．
点击保存设置．
将客户端id和秘密保存在一个安全的地方。您将在本教程的后面使用它们。

添加一个OAuth设置到Zendesk应用程序亚博

接下来，添加一个oauth设置为Zendesk应用程序亚博manifest.json文件。

在manifest.json，添加以下顶级oauth对象。将CLIENT_ID和CLIENT_SECRET替换为客户端id和secret from建立Todoist．

               
                ｛.．.“oauth”：｛“client_id”：“CLIENT_ID”，“client_secret”：“CLIENT_SECRET”，“authorize_uri”：“https://todoist.com/oauth/authorize”，“access_token_uri”：“https://todoist.com/oauth/access_token”，“范围”：“数据:read_write”｝｝

在manifest.json，添加以下顶级参数财产。

               
                ｛.．.“参数”：［｛“名称”：“令牌”，“类型”：“oauth”｝］，“oauth”：｛“client_id”：“CLIENT_ID”，“client_secret”：“CLIENT_SECRET”，“authorize_uri”：“https://todoist.com/oauth/authorize”，“access_token_uri”：“https://todoist.com/oauth/access_token”，“范围”：“数据:read_write”｝｝

保存manifest.json．

添加Zendesk应用亚博程序的代码

为应用程序的iframe添加HTML和JavaScript。

在Zendes亚博k应用程序的资产文件夹,打开iframe.html．替换文件的内容如下:

               
                <超文本标记语言><身体><链接rel＝＂样式表＂href＝＂https://cdn.jsdelivr.net/combine/npm/@亚博zendeskgarden/css-bedrock,npm/@zendeskgarden/css-buttons,npm/@zendeskgarden/css-forms,npm/@zendeskgarden/css-grid,npm/@zendeskgarden/css-utilities＂/><形式id＝＂taskForm＂类＝＂容器＂><div类＝＂行c-txt＂><标签为＝＂任务＂类＝＂col-12 c-txt__label＂>任务名称标签><文本区域名字＝＂任务＂id＝＂任务＂占位符＝＂在这里输入任务＂类＝＂col10 c-txt__input c-txt__input—area is- resized＂>文本区域>div><div类＝＂行u-mt-sm＂><按钮id＝＂submitTask＂类＝＂c-btn c-btn——主＂>提交按钮>div>形式><脚本src＝＂https://static.zdassets.com/亚博zendesk_app_framework_sdk/2.0/zaf_sdk.min.js＂>脚本><脚本类型＝＂text / javascript＂src＝＂main.js＂>脚本>身体>超文本标记语言>

HTML包含提交Todoist任务的表单。HTML还加载main.js脚本。您将创建main.js在下一步。

在资产文件夹，创建一个main.js文件。将以下JavaScript粘贴到该文件中。

该代码包括对ZAF客户端的调用请求()方法。的请求()调用包含一个{{设置。token}}存储的Todoist访问令牌的占位符。该调用还使用了安全选项为true。

               
                常量客户端＝ZAFClient．初始化（）；客户端．调用（“调整”，｛高度：“155 px”｝）；文档．getElementById（“submitTask”）．addEventListener（“点击”，（事件）= >｛事件．preventDefault（）；常量任务＝｛内容：文档．getElementById（“任务”）．价值，｝；常量选项＝｛url：“https://api.todoist.com/rest/v1/tasks”，类型：“职位”，头：｛授权：“不记名{{setting.token}}”，｝，contentType：“application / json”，数据：JSON．stringify（任务），安全：真正的，｝；客户端．请求（选项）．然后（（）= >｛文档．getElementById（“taskForm”）．重置（）；客户端．调用（“通知”，“任务添加到Todoist”）；｝，（错误）= >｛varerrorMsg＝｀错误$ {错误．状态｝$ {错误．statusText｝｀；客户端．调用（“通知”，errorMsg，“错误”）；｝）；｝）；

当管理员提交任务时，请求()调用向Todoist REST API发出一个经过验证的请求创建一个新任务端点。ZAF通过Zendesk代理服务器路由请求。亚博代理服务器将存储的访问令牌插入到{{设置。令牌}}占位符。

保存iframe.html而且main.js．

安装app

ZCLI为应用程序测试提供了一个本地web服务器。但是，ZCLI服务器不支持安全设置，例如oauth设置。作为一种解决方案，使用ZCLI将应用程序打包并安装到测试帐户。

在add_todoist_tasks文件夹,运行:
```
               
                zcli应用程序:创建
               
```
离开添加待办事项任务设置。令牌值提示空白，按“Enter”。
ZCLI将应用程序打包、上传并安装到Zendesk实例。亚博
在管理中心，按应用程序和集成图标()。然后选择应用程序>亚博Zendesk支持应用．
应用程序显示在当前安装的应用程序列表中我的应用程序页面。

启动OAuth流

使用应用程序的OAuth提示启动和完成OAuth流与Todoist。

在我的应用程序页，单击应用程序图标，以访问应用程序的设置。
在应用程序的设置页面，单击使用“添加Todoist任务”登录．
这将使用Todoist启动OAuth流。根据提示，单击同意在Todoist OAuth页面。
当流程完成时，OAuth身份验证部分显示一个复选标记图标。ZAF将流的访问令牌存储在浏览器之外。
点击更新重新加载应用程序。

测试应用程序

添加一个Todoist任务，以确保应用程序按预期工作。

转到Zendesk Support中的代理工作区。亚博从工作空间打开一个新的或现有的票据。

URL应该是这样的:

               
                https：//｛子域名｝．亚博．com/代理/票/｛ticket_id｝

点击Apps图标。
在添加Todoist任务应用程序中输入任务任务名称字段。示例:“测试我的新Zendesk应用程序”。亚博
点击提交．
一个通知出现在代理工作区的右上角。
过了一会儿，任务出现在Todoist收件箱中。

开始

应用开发者指南

创建应用

设计应用

亚博Zendesk Apps Tools (ZAT)