ionic3 百度AI 探索

前言

最近好久都没写简书了，今天抽空更新一下简书，不知道还有没有人记得我哈~
以自然语言为例，一步一步照着我的做吧

创建应用

在百度AI创建一个开发者账号，并创建一个应用就可以了。我们可以在控制台直接获取API Key和Secret Key

控制台

token获取

百度AI文档地址
token是通过你的API Key和Secret Key自动生成的，通过token，接口可以确认我们的身份，所以我们首先生成token吧。这里我用的是nodejs，直接上代码：

//获取token
var https = require('https');
var qs = require('querystring');

const param = qs.stringify({
    'grant_type': 'client_credentials',
    'client_id': '您的 Api Key',
    'client_secret': '您的 Secret Key'
});

https.get(
    {
        hostname: 'aip.baidubce.com',
        path: '/oauth/2.0/token?' + param,
        agent: false
    },
    function (res) {
        // 在标准输出中查看运行结果
        res.pipe(process.stdout);
    }
);

完成之后在命令行里直接复制token保存下来就行了

发起请求

某些细节在官方文档没有提及，特别是刚接触Ionic3的同学来说。所以我这里写了个示例：
xx.html

//text为你所想发送的数据
<button ion-button (click)="post(' 你好，世界')">发送</button>

xx.ts

//还有一些其他的已省略
import { HttpClient } from '@angular/common/http';

export class AiPage {
    basicUrl: string = '/rpc/2.0/nlp/v1/depparser?charset=UTF-8&access_token=';
    token:string='你的token';
    constructor(public http: HttpClient) {}
    post(text) {
        var url=this.basicUrl+this.token;
        var body={
            "text":text
        }
        var options={
            headers:{
                'Content-Type':'application/json',
            },
        }
        this.http.post(url,body,options).subscribe(data => {
            console.log(data);
        })
    }
}

跨域问题

老生常谈，这里我就不解释为什么会有跨域问题了，我只告诉你怎么解决。在ionic.config.json里面配置代理即可

{
    "name": "AI",
    "integrations": {},
    "type": "ionic-angular",
    "proxies": [
        {
            "path": "/rpc",
            "proxyUrl": "https://aip.baidubce.com/rpc"
        }
    ]
}

效果预览

结语

还有不懂的同学可以访问我的Github，好了，今天就到这里了。

最后编辑于：2018.12.02 11:31:36