uni.connectEventSource(options) @connecteventsource

展示全部

# uni.connectEventSource(options)

连接 SSE

SSE，全称是Server-sent Events，一种服务器基于http向客户端推送文本消息的技术。

一些AI大语言模型的服务器，利用SSE向客户端不停的发消息，持续的流式输出AI推理的结果文本。

但小程序不支持SSE，如果跨端的话，需要使用socket。

如果是搭建自己的服务器对接AI服务器，可以由自己的服务器使用SSE连接AI服务器，然后转socket和客户端通信。

socket在跨端、双向传输、二进制传输上有更多优势。

# connectEventSource 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件
x	-	4.51	4.51	x	x

Web端暂未兼容uni.connectEventSource API，请使用标准的Web API。

# 参数

名称

类型

必填

默认值

兼容性

描述

options

ConnectEventSourceOptions

是

名称

类型

必备

默认值

兼容性

描述

url

string

是

服务器地址

# 返回值

类型
UniEventSource

# UniEventSource 的方法

# onMessage(callback : ConnectEventSourceCallback) : void

message 事件，会在通过事件源收到数据时触发。

# onMessage 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件
x	-	4.51	4.51	x	x

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(ev: UniMessageEvent) => void	是	-	-	事件回调

# UniMessageEvent 的属性值

名称

类型

必备

默认值

兼容性

描述

data

any

否

null

消息发射器发出的数据。

lastEventId

string

否

null

一个字符串，表示事件的唯一 ID。

bubbles

boolean

是

是否冒泡

cancelable

boolean

是

是否可以取消

type

string

是

事件类型

target

UniElement

否

触发事件的组件

currentTarget

UniElement

否

当前组件

timeStamp

number

是

事件发生时的时间戳

# UniMessageEvent 的方法

# stopPropagation(): void

阻止当前事件的进一步传播

# stopPropagation 兼容性

Web	微信小程序	Android	iOS
-	-	-	-

# preventDefault(): void

阻止当前事件的默认行为

# preventDefault 兼容性

Web	微信小程序	Android	iOS
4.0	-	3.9	x

# onError(callback : ConnectEventSourceErrorCallback) : void

onerror 是当发生错误且这个错误事件（error）被 UniEventSource 触发时调用的一个事件处理函数。

# onError 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件
x	-	4.51	4.51	x	x

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(error: UniError) => void	是	-	-	事件回调

# onOpen(callback : ConnectEventSourceCallback) : void

一个事件处理器，它在收到 open 事件时被调用，在那时，连接刚被打开。

# onOpen 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件
x	-	4.51	4.51	x	x

# 参数

名称	类型	必填	默认值	兼容性	描述
callback	(ev: UniMessageEvent) => void	是	-	-	事件回调

# close() : void

关闭当前的连接

# close 兼容性

Web	微信小程序	Android	Android uni-app x UTS 插件	iOS	iOS uni-app x UTS 插件
x	-	4.51	4.51	x	x

# 示例

hello uni-app x

该 API 不支持 Web，请运行 hello uni-app x 到 App 平台体验

<template>
	<!-- #ifdef APP -->
	<scroll-view style="flex:1">
	<!-- #endif -->
		<view>
			<page-head :title="title"></page-head>
			<button class="button" type="primary" @click="connect">连接</button>
			<button class="button" type="primary" @click="close">关闭</button>
			<text style="margin: 2px; padding: 2px; border: 1px solid #000000;">{{ log }}</text>
		</view>
	<!-- #ifdef APP -->
	</scroll-view>
	<!-- #endif -->
</template>

<script>
	export default {
		data() {
			return {
				log: '',
				title: 'sse',
				url: 'https://request.dcloud.net.cn/api/sse/connect',
				eventSource: null as UniEventSource | null,
				open:false,
				receiveMessage:false
			}
		},
		unmounted() {
			if(this.eventSource!=null){
				this.eventSource?.close()
			}
		},
		methods: {
			connect() {
                console.log('connect')
				this.eventSource?.close()
				this.eventSource = uni.connectEventSource({
					url: this.url
				} )
				this.eventSource?.onMessage((ev) => {
					this.log +='type:' + ev.type + '\ndata:' + ev.data + '\n\n'
					this.receiveMessage = true
				})
				this.eventSource?.onOpen((ev) => {
					this.log += 'open:' + ev.type+ '\n\n'
					this.open = true
				})
				this.eventSource?.onError((ev) => {
					this.log += 'error:' + ev.errMsg+ '\n\n'
				})
				console.log('connect end')
			},
			close() {
				this.eventSource?.close()
			}
		}
	}
</script>

<style>
	.button {
		margin-left: 30px;
		margin-right: 30px;
		margin-bottom: 15px;
	}
</style>

# 参见

# 示例

hello uni-app x

该 API 不支持 Web，请运行 hello uni-app x 到 App 平台体验

<template>
	<!-- #ifdef APP -->
	<scroll-view style="flex:1">
	<!-- #endif -->
		<view>
			<page-head :title="title"></page-head>
			<button class="button" type="primary" @click="connect">连接</button>
			<button class="button" type="primary" @click="close">关闭</button>
			<text style="margin: 2px; padding: 2px; border: 1px solid #000000;">{{ log }}</text>
		</view>
	<!-- #ifdef APP -->
	</scroll-view>
	<!-- #endif -->
</template>

<script>
	export default {
		data() {
			return {
				log: '',
				title: 'sse',
				url: 'https://request.dcloud.net.cn/api/sse/connect',
				eventSource: null as UniEventSource | null,
				open:false,
				receiveMessage:false
			}
		},
		unmounted() {
			if(this.eventSource!=null){
				this.eventSource?.close()
			}
		},
		methods: {
			connect() {
                console.log('connect')
				this.eventSource?.close()
				this.eventSource = uni.connectEventSource({
					url: this.url
				} )
				this.eventSource?.onMessage((ev) => {
					this.log +='type:' + ev.type + '\ndata:' + ev.data + '\n\n'
					this.receiveMessage = true
				})
				this.eventSource?.onOpen((ev) => {
					this.log += 'open:' + ev.type+ '\n\n'
					this.open = true
				})
				this.eventSource?.onError((ev) => {
					this.log += 'error:' + ev.errMsg+ '\n\n'
				})
				console.log('connect end')
			},
			close() {
				this.eventSource?.close()
			}
		}
	}
</script>

<style>
	.button {
		margin-left: 30px;
		margin-right: 30px;
		margin-bottom: 15px;
	}
</style>