laravel对接百度智能云 实现智能机器人

创建API Key和 Secret Key进入网址:百度智能云千帆大模型平台

如下图操作:

填写完毕点击确认后,即可得到sk和ak

 后端接口实现代码:

  //调用百度智能云第三方机器人接口public function run($text) {$curl = curl_init();curl_setopt_array($curl, array(CURLOPT_URL => "https://aip.baidubce.com/rpc/2.0/ai_custom/v1/wenxinworkshop/chat/ernie-4.0-8k-0104?access_token={$this->getAccessToken()}",CURLOPT_TIMEOUT => 30,CURLOPT_RETURNTRANSFER => true,CURLOPT_SSL_VERIFYPEER  => false,CURLOPT_SSL_VERIFYHOST  => false,CURLOPT_CUSTOMREQUEST => 'POST',CURLOPT_POSTFIELDS =>'{"messages":[{"role":"user","content":'.'"'.$text.'"'.'}],"temperature":0.8,"top_p":0.8,"penalty_score":1,"disable_search":false,"enable_citation":false,"enable_trace":false}',CURLOPT_HTTPHEADER => array('Content-Type: application/json'),));$response = curl_exec($curl);curl_close($curl);return $response;}/*** 使用 AK,SK 生成鉴权签名(Access Token)* @return string 鉴权签名信息(Access Token)*/private function getAccessToken(){$config = config('services.lev');$curl = curl_init();$postData = array('grant_type' => 'client_credentials','client_id' => '你的ak','client_secret' => '你的sk');curl_setopt_array($curl, array(CURLOPT_URL => 'https://aip.baidubce.com/oauth/2.0/token',CURLOPT_CUSTOMREQUEST => 'POST',CURLOPT_SSL_VERIFYPEER  => false,CURLOPT_SSL_VERIFYHOST  => false,CURLOPT_RETURNTRANSFER => true,CURLOPT_POSTFIELDS => http_build_query($postData)));$response = curl_exec($curl);curl_close($curl);$rtn = json_decode($response);return $rtn->access_token;}public function info_request(){$text = request()->get('content');$rtn = (new LevitatefSphereController())->run($text);return $rtn;}public function levitated(){return view('levitated_view');}

 页面HTML代码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Simple Chat Box</title><link rel="stylesheet" href="{{ asset('static/levitated-css.css') }}" /><style>body {overflow-y: hidden; /* 隐藏垂直滚动条 */}#box {width: 1000px;height: 100%;margin: 0px auto;/*position: relative;*/}#chat-box {width: 900px;height: 670px;overflow: auto;border: 1px solid #ccc;border-radius: 10px 10px 0px 0px;padding: 8px;background-color: #ffffff;}#message-input{width: 916px;height: 110px;border: 1px solid #ccc;/*pointer-events:none;*/border-top:none;/*position: absolute;*/border-radius: 0px 0px 10px 10px;background-color: #ffffff;}#btn{/*width: 80px;*/border-radius: 10px;border: none;background-color: #8a57ea;color: #ffffff;margin-left: 820px;/*position: absolute;*/position: relative;bottom: 45px;padding: 10px 20px;}.input-div{width: max-content;padding: 10px 20px;border-radius: 8px 8px 0px 8px;float : right;color: #ffffff;margin: 10px;}.answer-div{width: 700px;padding: 10px 20px;border-radius: 0px 10px 10px 10px;/*float : left;*/clear: both;margin: 10px;}.loading {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(255, 255, 255, 0.8);z-index: 9999;text-align: center;padding-top: 20%;font-size: 24px;color: #333;}.logo{width: 40px !important;height: 40px !important;}</style>
</head>
<body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="box"><div id="chat-box"></div><div  onfocus="divFocusMess()" onclick="divClickMess()" onblur="divBlurMess()"  contenteditable = "true" tabindex="0" id="message-input" onkeydown="handleEnter(event)" onkeyup="keyup(event)" style="word-break: break-word;"></div><button onclick="sendMessage()" id="btn" >提问</button><div class="loading" id="loading">正在加载中 请耐心等待...</div>
</div>
<script>var chatbox = document.getElementById("chat-box");var message = document.getElementById('message-input').innerHTML;if(message == ''){document.getElementById('message-input').innerHTML = '输入消息';}function divClickMess(){ //点击时为空document.getElementById('message-input').innerHTML = '';}function divBlurMess(){ //失焦时设置为输入信息document.getElementById('message-input').innerHTML = '输入消息';}function divFocusMess(){ //聚焦时为空document.getElementById('message-input').innerHTML = '';}// function divSelMess(){//     document.getElementById('message-input').innerHTML = '';// } onselect="divSelMess()"function scrollToBottom() {chatbox.scrollTop = chatbox.scrollHeight;}window.onload = function() {var chatbox = document.getElementById("chat-box");chatbox.scrollTop = chatbox.scrollHeight;}function sendMessage() {//获取输入框内容var message = document.getElementById('message-input').innerHTML;var chatBox = document.getElementById('chat-box');// 清除输入框的内容document.getElementById('message-input').innerHTML = '';// 在聊天框中添加消息chatBox.innerHTML += '<div class="input-div" style="background-color: #8a57ea;">' + message + '</div><div style="clear: both"></div>';document.getElementById('loading').style.display = 'block';document.getElementById('message-input').innerHTML = '';// 在这里处理加载完成后的操作,例如显示答案等$.ajax({url:'info_request',//请求的路由接口data:{content:message},//传值type:'get',//接口类型dataType:'json',success:function (res){var result = res.result;document.getElementById('loading').style.display = 'none';//将返回的答案展示在页面上chatBox.innerHTML += '<img class="logo" src="{{asset('static/images/levitated.png')}}"><div class="answer-div"  style="background-color: #f8f8f8">' + result.replace(/\n/g, '<br>') + '</div>';//自动展示最新,将滚轮滑动至最下方if (chatbox.scrollHeight - chatbox.scrollTop - chatbox.clientHeight > 10) {scrollToBottom();}}})}function handleEnter(event) {// 检查按下的键是否是回车键if(event.key === "Enter") {// 可以在这里添加其他的逻辑处理var message = document.getElementById('message-input').innerHTML;var chatBox = document.getElementById('chat-box');// 清除输入框的内容document.getElementById('message-input').innerHTML = '';// 在聊天框中添加消息chatBox.innerHTML += '<div class="input-div" style="background-color: #8a57ea;">' + message + '</div><div style="clear: both"></div>';document.getElementById('loading').style.display = 'block';document.getElementById('message-input').innerHTML = '';// 在这里处理加载完成后的操作,例如显示答案等$.ajax({url:'info_request',//请求的路由接口data:{content:message},//传值type:'get',//接口类型dataType:'json',success:function (res){var result = res.result;// 停止加载document.getElementById('loading').style.display = 'none';//将返回的答案展示在页面上chatBox.innerHTML += '<img class="logo" src="{{asset('static/images/levitated.png')}}"><div class="answer-div"  style="background-color: #f8f8f8">' + result.replace(/\n/g, '<br>') + '</div>';//自动展示最新,将滚轮滑动至最下方if (chatbox.scrollHeight - chatbox.scrollTop - chatbox.clientHeight > 10) {scrollToBottom();}}})event.preventDefault(); // 阻止 Enter 键的默认行为return false;}}</script></body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/37315.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

前后端分离项目验证码实现

一、验证码实现流程&#xff1a; 1、后端使用工具生成二维码&#xff08;包括image的字符串和code字符&#xff09;&#xff1b; 2、使用uuid生成唯一的key值&#xff0c;将key和code以键值对的形式存储到redis缓存中&#xff0c;设置过期时间&#xff1b; 3、将image字符串…

一、评估代码质量好坏的几个维度

评估代码质量好坏的几个维度 一、代码质量1、可维护性2、灵活性3、简洁性4、可复用性5、可测试性6、可扩展性7、可读性二、编程方法论1、面向对象2、设计原则3、设计模式4、编程规范5、重构三、提高代码质量方法论总结四、简单了解:什么是设计模式五、设计模式的分类六、UML图…

2024年计算机行业投资策略:AI创新推动行业加速发展

2023年,计算机行业在AI创新的推动下呈现出"M"型走势,年初在ChatGPT带动的大模型、AI算力以及行业应用的推动下,板块强势上行,4月和6月分别出现年内高点,其后随着AI、信创等热门板块的调整,指数回调幅度明显。从年初到12月26日,申万计算机指数上涨3.61%,跑赢沪…

阿一网络安全培训中心专门为你准备了一份WScan使用教程

下载地址&#xff1a;https://github.com/chushuai/wscan/releases 版本的选择 Windows就选windows_amd64 Linux就选linux_amd64 mac就选darwin_amd64 下载好后&#xff0c;运行一次exe会生成一个config.yaml文件 把该文件中plugins下面的所有插件的enabled设置为True。&…

数据库使用笔记

1.mysql数据库频繁访问导致连接超时 解决办法一&#xff1a; 优化查询&#xff1a;检查并优化SQL查询语句&#xff0c;减少不必要的数据库调用。增加连接池大小&#xff1a;如果应用程序使用连接池&#xff0c;可以考虑增加连接池的最大连接数。&#xff08;注&#xff1a;不能…

【JavaScript脚本宇宙】从入门到精通:让你的JavaScript项目无坚不摧的测试框架指南

众里寻他千百度&#xff1a;为你的JavaScript项目选择最佳测试框架 前言 本文将对几个常用的JavaScript测试框架进行比较&#xff0c;包括Jest、Mocha、Jasmine、AVA、QUnit和Cypress。每个框架都将从概述、主要特性、安装与配置以及示例代码等方面进行介绍。通过比较这些框架…

Selenium进行Web自动化滚动

在使用Selenium进行Web自动化时&#xff0c;计算页面内的滚动条位置或执行滚动操作通常涉及JavaScript执行。Selenium的WebDriver提供了执行JavaScript代码的功能&#xff0c;这可以用来获取滚动条的位置或滚动到页面上的特定位置。 获取滚动条位置 你可以使用JavaScript的wi…

Nginx网站服务详解(设置并发数、实现不同虚拟主机等)

一、nginx的最大并发数设置已经状态收集模块 [root192 nginx]# cat nginx.conf # For more information on configuration, see: # * Official English Documentation: http://nginx.org/en/docs/ # * Official Russian Documentation: http://nginx.org/ru/docs/user ngin…

单源最短路径问题(Dijstra)

#include<iostream> using namespace std; #define MAX 500 #define INT 999 typedef struct {char vex[MAX];int Edge[MAX][MAX];int vexnum,arcnum; }MGraph; void InitMG(MGraph &MG) {cout<<"输入顶点数和边数&#xff1a;";cin>>MG.vexnu…

SOBEL图像边缘检测器的设计

本项目使用FPGA设计出SOBEL图像边缘检测器&#xff0c;通过分析项目在使用过程中的工作原理和相关软硬件设计进行分析详细介绍SOBEL图像边缘检测器的设计。 资料获取可联系wechat 号&#xff1a;comprehensivable 边缘可定义为图像中灰度发生急剧变化的区域边界,它是图像最基本…

linux中find命令和exec的强大组合用法

如何将 find 命令与 exec 一起使用 Find 是一个已经非常强大的命令&#xff0c;用于根据许多条件搜索文件。exec 命令使您能够处理 find 命令的结果。 我在这里分享的例子只是一瞥。find-exec 命令组合在一起为您提供了在 Linux 命令行中执行操作的无限可能。 find 和 exec 命令…

Llama 3 模型微调的步骤

环境准备 操作系统&#xff1a;Ubuntu 22.04.5 LTS Anaconda3&#xff1a;Miniconda3-latest-Linux-x86_64 GPU&#xff1a; NVIDIA GeForce RTX 4090 24GStep 1. 准备conda环境 创建一个新的conda环境&#xff1a; conda create --name llama_factory python3.11激活刚刚创…

[每周一更]-(第103期):GIT初始化子模块

文章目录 初始化和更新所有子模块分步骤操作1. 克隆包含子模块的仓库2. 初始化子模块3. 更新子模块 查看子模块状态提交子模块的更改处理子模块路径错误的问题 该问题的缘由是因为&#xff1a;在写某些代码的时候&#xff0c;仓库中有些文件夹&#xff0c;只提交了文件夹名称到…

Spring Boot中的依赖注入详解

Spring Boot中的依赖注入详解 大家好&#xff0c;我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编&#xff0c;也是冬天不穿秋裤&#xff0c;天冷也要风度的程序猿&#xff01;在今天的文章中&#xff0c;我们将深入探讨Spring Boot中的依赖注入&#xff08;D…

EasyExcel 导出批注信息以及背景色

1. 批注信息 package com.xxx.demo;import lombok.Getter; import org.apache.poi.ss.usermodel.IndexedColors;/*** This class represents the comment information associated with a specific cell in an Excel sheet.* The columnIndex field specifies the column numbe…

react中自定义上传文件的hook

react中自定义上传文件的hook 在React中&#xff0c;你可以创建自定义Hook来处理文件上传的逻辑。自定义Hook允许你将组件逻辑提取到可重用的函数中&#xff0c;这样你就可以在不同的组件之间共享这些逻辑。 以下是一个简单的示例&#xff0c;展示了如何创建一个用于文件上传…

[GIS]WPS地理处理服务

在GeoServer中&#xff0c;WPS&#xff08;Web Processing Service&#xff09;是一个用于执行地理空间数据处理的规范。WPS服务允许用户提交地理处理请求&#xff0c;这些请求由服务器上的地理处理过程&#xff08;GeoProcessing Process&#xff09;执行&#xff0c;并返回结…

时常在面试中被问到的多线程问题:下篇

文章目录 线程和线程池有什么区别&#xff1f;线程池 (ThreadPool)区别 如何创建线程池&#xff1f;1. 固定大小线程池 (Fixed Thread Pool)2. 可缓存线程池 (Cached Thread Pool)3. 单线程线程池 (Single Thread Pool)4. 定时线程池 (Scheduled Thread Pool) 推荐使用哪种方式…

【贪心】个人练习-Leetcode-2271. Maximum White Tiles Covered by a Carpet

题目链接&#xff1a;https://leetcode.cn/problems/maximum-white-tiles-covered-by-a-carpet/description/ 题目大意&#xff1a;给定一个左右区间序列tiles[][]&#xff0c;每个元素代表这个区间被瓷砖覆盖&#xff08;左右都是闭合的&#xff09;。给定一块毯子&#xff0…

使用 Ubuntu x86_64 平台交叉编译适用于 Linux aarch64(arm64) 平台的 QT5(包含OpenGL/WebEngine支持) 库

使用 Ubuntu AMD64 平台交叉编译适用于 Linux ARM64 平台的 QT5(包含 OpenGL/WebEngine 支持) 库 目录 使用 Ubuntu AMD64 平台交叉编译适用于 Linux ARM64 平台的 QT5(包含 OpenGL/WebEngine 支持) 库写在前面前期准备编译全流程1. 环境搭建2. 复制源码包并解压&#xff0c;创…