logoAnt Design X

设计研发组件X MarkdownX SDK演示
  • 介绍
  • 数据流
    • useXChat会话数据
    • useXConversations会话管理
    • Chat Provider数据提供
  • 工具
    • XRequest请求
    • XStream流

XRequest
请求

何时使用

  • 向后端服务接口发起请求,获取响应数据。如果是OpenAI Compatible的LLM服务,建议使用XModelAPI。

代码演示

API

XRequestFunction

ts
type XRequestFunction<Input = Record<PropertyKey, any>, Output = Record<string, string>> = (
baseURL: string,
options: XRequestOptions<Input, Output>,
) => XRequestClass<Input, Output>;

XRequestFunction

属性描述类型默认值版本
baseURL请求接口地址string--
optionsXRequestOptions<Input, Output>--

XRequestOptions

属性描述类型默认值版本
callbacks请求回调处理集XRequestCallbacks<Output>--
params请求的参数Input--
headers额外的请求头配置Record<string, string>--
timeout请求超时配置,单位:msnumber--
streamTimeoutstream模式的数据超时配置,单位:msnumber--
fetch自定义fetch对象typeof fetch--
middlewares中间件,支持请求前和请求后处理XFetchMiddlewares--
transformStreamstream处理器XStreamOptions<Output>['transformStream'] | ((baseURL: string, responseHeaders: Headers) => XStreamOptions<Output>['transformStream'])--
manual是否手动控制发出请求,为true时,需要手动调用run方法booleanfalse-

XRequestCallbacks

属性描述类型默认值版本
onSuccess成功时的回调(chunks: Output[]) => void--
onError错误处理的回调(error: Error) => void--
onUpdate消息更新的回调(chunk: Output) => void--

XRequestClass

属性描述类型默认值版本
abort取消请求() => void--
run手动执行请求,当manual=true时有效(params?: Input) => void--
isRequesting当前是否在请求中boolean--

setXRequestGlobalOptions

ts
type setXRequestGlobalOptions<Input, Output> = (
options: XRequestGlobalOptions<Input, Output>,
) => void;

XRequestGlobalOptions

ts
type XRequestGlobalOptions<Input, Output> = Pick<
XRequestOptions<Input, Output>,
'headers' | 'timeout' | 'streamTimeout' | 'middlewares' | 'fetch' | 'transformStream' | 'manual'
>;

XFetchMiddlewares

ts
interface XFetchMiddlewares {
onRequest?: (...ags: Parameters<typeof fetch>) => Promise<Parameters<typeof fetch>>;
onResponse?: (response: Response) => Promise<Response>;
}
Request Log
Status-
Update Times0
基础使用

该示例说明如何使用 XRequest 发起 fetch 请求 ,请拷贝代码且在 DEV 环境用实际的值替换 BASE_URL, PATH, 和其他业务参数 来使用

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Request Log
Status-
Update Times0
自定义入参

自定义 params 参数,可以向智能体等发送消息。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Mock Custom Protocol - Log
自定义转换器

为 XRequest 配置自定义的 transformStream , 示例中使用 application/x-ndjson 数据演示

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Request Log
request undefined
Status-
Update Times0
模型接入

接入云服务平台,可发送请求、终止消息。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code
Request Log
request
Status-
超时配置

为 XRequest 配置 timeout,设置请求超时时间。

CodeSandbox Icon
codepen icon
External Link Icon
expand codeexpand code