AJAX实现图灵机器人聊天

最新推荐文章于 2022-03-19 15:15:30 发布

风或许自媒体

最新推荐文章于 2022-03-19 15:15:30 发布

阅读量2.9k

点赞数

分类专栏：前端从入门到放弃文章标签：机器人聊天 ajax实现图灵机器人

本文链接：https://blog.csdn.net/LY_code/article/details/80087427

版权

本文介绍如何利用AJAX技术与图灵机器人接口交互，创建一个聊天应用。首先在图灵机器人平台注册并获取API key，然后在HTML中结合自封装的MYAJAX.js实现POST请求，实现与机器人的聊天功能。文章还提及了所需的图片资源和文件结构，包括背景图、头像图片以及myajax.js和HTML文件。

摘要由CSDN通过智能技术生成

首先，搜索图灵机器人，在图灵机器人注册一个账号，然后新建一个机器人，获得一个key就可以了，这样就可以聊天了。

关键是你在图灵机器人新建生成的key：

key=9257afd24a374c69b91eeb687d463763
这段代码是复制的，从你新建那里得到。

另外我用的是版本一：（post的第一个参数url）

http://www.tuling123.com/openapi/api

当然你可以用图灵的第二个版本的API也是可以的。

图片我这里用了三张：一张背景图，两张头像图片。

你们可以换成自己想要的图片即可。

文件呢，主要是两个：一个是myajax的js文件，另外一个是html文件。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Fengmaybe_Robot</title>
    <script src="myAjax.js"></script>
</head>
<style>
    *{
        padding: 0;
        margin: 0;
    }
    .imgLayout{
        width: 100%;
        height: 100%;
        margin: 0 auto;
        background: url("star.jpg");
        /*简单粗暴解决高度塌陷问题（记得复习其他方法） */
        padding:1px;
    }
    .outer{
        box-sizing: border-box;
        width: 600px;
        height: 600px;
        border-radius: 20px;
        background-color: whitesmoke;
        border: 2px solid white;
        margin: 20px auto;
        padding: 5px;
    }
    .chatContent{
        box-sizing: border-box;
        width: 100%;
        height: 480px;
        /*设置滚动 这里吕某经常用// 符号注释，使得下面一行代码失效*/
        overflow: auto;
        margin-bottom: 10px;
    }
    .outer input{
        width: 580px;
        height: 45px;
        font-size: 30px;
        line-height: 45px;
    }
    .outer button{
        width: 580px;
        height: 45px;

最低0.47元/天解锁文章

风或许自媒体

关注

0
点赞
踩
16

收藏

觉得还不错? 一键收藏
2
评论
AJAX实现图灵机器人聊天

首先，搜索图灵机器人，在图灵机器人注册一个账号，然后新建一个机器人，获得一个key就可以了，这样就可以聊天了。关键是你在图灵机器人新建生成的key：key=9257afd24a374c69b91eeb687d463763这段代码是复制的，从你新建那里得到。另外我用的是版本一：（post的第一个参数url）http://www.tuling123.com/openapi/api当然你可以用图灵的...
复制链接

扫一扫

专栏目录