使用GraphHttpClient调用Microsoft Graph接口 - POST

简介: 博客地址:http://blog.csdn.net/FoxDave本篇接上一讲,我们继续看如何通过GraphHttpClient创建一个Office 365的组,需要使用POST请求。

博客地址:http://blog.csdn.net/FoxDave

本篇接上一讲,我们继续看如何通过GraphHttpClient创建一个Office 365的组,需要使用POST请求。

为结果添加按钮和占位符(PlaceHolder)

我们需要再次修改HTML代码,添加一个用来创建组的按钮。

1. 在Visual Studio Code中打开文件\src\webparts\helloWorld\HelloWorldWebPart.ts。

2. 修改render()方法,使其包含一个按钮和一个div用来显示创建成功与否的结果信息。修改后的render方法代码如下所示:

public render(): void {
    this.domElement.innerHTML = `
      <div class="${styles.helloWorld}">
      <div class="${styles.container}">
      <div class="ms-Grid-row ms-bgColor-themeDark ms-fontColor-white ${styles.row}">
        <div class="ms-Grid-col ms-u-lg10 ms-u-xl8 ms-u-xlPush2 ms-u-lgPush1">
          <span class="ms-font-xl ms-fontColor-white">Welcome to SharePoint!</span>
          <p class="ms-font-l ms-fontColor-white">Customize SharePoint experiences using Web Parts.</p>
          <p class="ms-font-l ms-fontColor-white">${escape(this.properties.description)}</p>
          <a href="https://aka.ms/spfx" class="${styles.button}">
            <span class="${styles.label}">Learn more</span>
          </a>
          <p>
          <input id="readGroups" type="button" value="Read Groups"/> 
          <input id="createGroup" type="button" value="Create New Group"/>                           
          </p>
          <div id="spCreateGroupResults" ></div>
          <div id="spTableContainer" ></div>
        </div>
      </div>
    </div>
  </div>`;
  this.domElement.querySelector('#createGroup').addEventListener('click',() => {this._createGroup();});
  this.domElement.querySelector('#readGroups').addEventListener('click',() => {this._readGroups();});    
  }
添加_createGroup()方法来调用Microsoft Graph API创建一个组,_createGroup()方法的代码如下所示:

protected _createGroup(){
  // Use Microsoft Graph to create a sample group.
  this.context.graphHttpClient.post(`v1.0/groups`,GraphHttpClient.configurations.v1,{
    body: JSON.stringify({"description": "Self help community for library",
    "displayName": "Library Assist",
    "groupTypes": [
      "Unified"
    ],
    "mailEnabled": true,
    "mailNickname": "library",
    "securityEnabled": false
  })
}).then((response: HttpClientResponse) => {
  const resultContainer: Element = this.domElement.querySelector('#spCreateGroupResults');
    if (response.ok) {
      resultContainer.innerHTML = `<p>Sample group created</p>`;
    } else {
      resultContainer.innerHTML = `<p>Could not create group see console for details</p>`;        
      console.warn(response.status);
    }
  });
}
上面使用Microsoft Graph的代码示例中的代码创建了一个简单的组,可以点击 这里了解详情。
post()方法发起了一个POST REST接口请求去调用URLv1.0/groups。第三个参数是IGraphHttpClientOptions值,里面的JSON体用来描述要创建的新组。HttpClientResponse用来判定调用是否成功执行并显示恰当的信息。

运行web部件去创建一个新组

1. 使用gulp打包你的解决方案
打开命令行,转到你的工程所在目录,输入命令gulp package-solution来打包你的解决方案。


2. 部署解决方案到你的SharePoint租户:

>访问你的应用程序目录网站,访问Apps for SharePoint。

>上传刚才打出的.sppkg包(\demowp\sharepoint\solution),如果提示已存在选择覆盖即可。

>在接下来弹出的提示是否信任解决方案的窗口中选择部署。


3. 使用gulp serve命令来承载我们写好的web部件,命令为gulp serve --nobrowser。

4. 添加web部件到任意一个网页或者使用工作台来测试,做法跟上一讲一样,此刻我的网络环境实在是非常的差,我就不上图了。

5. 当点击Create New Group按钮时,代码会创建一个新的Office 365组。注意如果创建的组在Office 365中已存在,就会返回组已存在的错误信息。

本篇就介绍到这里,下一篇会简单介绍一下如何更新组信息。

相关文章
使用GraphHttpClient调用Microsoft Graph接口 - PATCH
博客地址:http://blog.csdn.net/FoxDave 通过前两讲的阐述我们应该大致了解了使用GraphHttpClient调用Microsoft Graph接口的模式,并介绍了使用get或post方法去请求指定的URL端点。
1060 0
|
Web App开发 网络架构
使用GraphHttpClient调用Microsoft Graph接口 - GET
博客地址:http://blog.csdn.net/FoxDave 使用GraphHttpClient类调用Microsoft Graph REST API,你可以使用GET,POST和PATCH请求(分别对应get(),post()和fetch()方法)。
1339 0
|
SQL 数据库
Microsoft SQL Server 2000数据还原
Microsoft SQL Server 2000还原数据操作流程 1、开始 - 所有程序 - Microsoft SQL Server - 企业管理器(如图1-1)。
1103 0
|
SQL 数据库
Microsoft SQL Server 2000数据附加
Microsoft SQL Server 2000附加数据操作流程 1、开始 - 所有程序 - Microsoft SQL Server - 企业管理器(如图1-1)。
1105 0
|
SQL 数据库 Windows
Microsoft SQL Server 2008数据还原
Microsoft SQL Server 2008还原数据操作流程 1、开始 - 所有程序 - Microsoft SQL Server 2008 R2 - SQL Server Management Studio(如图1-1)。
1122 0
|
SQL 数据库 Windows
Microsoft SQL Server 2000数据库备份
Microsoft SQL Server 2000备份数据操作流程 1、开始 - 所有程序 - Microsoft SQL Server - 企业管理器(如图1-1)。
1226 0
|
SQL 监控 数据库
Microsoft SQL Server 2008清理LDF日志
Microsoft SQL Server 2008 LDF数据文件清理方法。 PS:由于该操作涉及数据库中的数据,请在操作前先做好数据备份。 准备:Microsoft SQL Server 2008清理LDF脚本,请点击下载获取。
1683 0
|
SQL 数据库 Windows
Microsoft SQL Server 2008修改混合模式
数据库身份验证SQL Server和Windows设置 1、开始 - 所有程序 - Microsoft SQL Server 2008 R2 - SQL Server Management Studio(如图1-1) 图 1-1 2、进入后会弹出窗口【连接到服务器】,在【身份验证】选择中【Windows身份验证】— 点击【连接】(如图1-2) 图 1-2 3、在数据库服务实例名(如图1-3,WIN-VQ5SKTLJ9EU\sql位置)点击鼠标右键【属性】。
1197 0
|
SQL 数据库 数据安全/隐私保护
Microsoft SQL Server 2008修改sa密码
数据库sa密码忘记处理方案 1、开始 - 所有程序 - Microsoft SQL Server 2008 R2 - 点击SQL Server Management Studio(如图1-1)。
1568 0
|
SQL 数据库 数据安全/隐私保护
Microsoft SQL Server 2000修改sa密码提示错误:2812
报错提示:错误 2812:未能找到存储过程 ‘ sp_password ’。 准备:存储过程修复脚本,请点击下载获取。下载完毕后,请放置C盘根目录并解压。
1106 0