最近遇到一个chatGPT的相关功能,需要做成文字一个个弹出的功能,如果使用普通的http请求会一次性得到结果,如果后台计算时间太长还可能会导致超时,影响用户体验。
所以使用长连接SSE(Server Sent Event),直译为服务器发送事件,顾名思义,也就是客户端可以获取到服务器发送的事件。我们常见的 http 交互方式是客户端发起请求,服务端响应,然后一次请求完毕;但是在 sse 的场景下,客户端发起请求,连接一直保持,服务端有数据就可以返回数据给客户端,这个返回可以是多次间隔的方式。
但是问题是原生的EventSource 不能使用post方法,只能使用get方法,而且还不能自定义请求header,所以我们可以使用npm包:
@microsoft/fetch-event-source
代码示例:
import {fetchEventSource} from '@microsoft/fetch-event-source';
const controller = new AbortController()
const signal = controller.signal
fetchEventSource('请求的url', {
method: 'POST',
signal: signal,
headers: {
/* 请求头配置 */
body: JSON.stringify({
/* 发送的内容 */
onmessage() {
let result= JSON.parse(msg.data); // 得到的数据
onerror(err){
// 必须抛出错误才会停止
throw err
所以使用长连接SSE(Server Sent Event),直译为服务器发送事件,顾名思义,也就是客户端可以获取到服务器发送的事件。我们常见的 http 交互方式是客户端发起请求,服务端响应,然后一次请求完毕;但是在 sse 的场景下,客户端发起请求,连接一直保持,服务端有数据就可以返回数据给客户端,这个返回可以是多次间隔的方式。最近遇到一个chatGPT的相关功能,需要做成文字一个个弹出的功能,如果使用普通的http请求会一次性得到结果,如果后台计算时间太长还可能会导致超时,影响用户体验。
yii2提供了很多帮助类,比如Html、Url、Json等,可以很方便的实现一些功能,下面简单说下这个Html。用yii2写view时时经常会用到它,今天在改写一个页面时又用到了它。它比较好用的地方就在于,它不仅仅是生成一个简单的html标签,结合yii2自己的静态资源文件yii.js可以很方便的实现一个post请求。
yii2将这些功能都做好了封装,只要在合适的地方调用它的方法就可以了,可以说yii2是个可以开箱即用的框架,你可以用它很快的实现一个需要的功能:比如在页面中放置一个删除按钮,点击按钮发送post请求,弹出确认对话框。如果没有yii\helpers\Html类和yii.js,那么
格物钛智能科技作为非结构化数据赋能专家,为企业及AI开发者提供全新的智能时代数据管理方案,以数据引擎为核心技术,打造下一代数据平台,解决非结构化数据难发现、难管理、难利用等痛点,帮助企业筑牢新基建底层,实现海量复杂数据的灵活存取用,助推AI工程化和数据资产
08-19
作者:小鹿清孑明,格物钛前端部门,前端工程师
前段时间在Tensorbay数据集管理平台前端开发过程中,需要实现一个action 中的 activity log 实时输出的feature,很突然的接触到了一个新技术,迫不及待地想要和大家分享一下!
也就拖了2个月不到吧,SSE这不就来了嘛!
WHAT?什么是SSE?
SSE全称Server-Sent Events,字面意思就是服务器向客户端推送信息。
我们知道,客户端和服务器端通信一般是通过http请求,而http请求无法做
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class MyServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// 从请求中获取POST参数
String param1 = request.getParameter("param1");
String param2 = request.getParameter("param2");
// 在这里进行处理逻辑,例如保存到数据库或执行其他操作
// 设置响应内容类型
response.setContentType("text/html");
// 输出响应结果
response.getWriter().println("Received POST request with param1: " + param1 + " and param2: " + param2);
在web.xml文件中配置servlet的映射:
```xml
<servlet>
<servlet-name>MyServlet</servlet-name>
<servlet-class>com.example.MyServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>MyServlet</servlet-name>
<url-pattern>/myurl</url-pattern>
</servlet-mapping>
在上述示例中,当收到POST请求时,doPost方法会被调用。您可以从HttpServletRequest对象中获取POST参数,并在处理逻辑中使用这些参数。最后,使用HttpServletResponse对象将结果返回给客户端。