前往openrouter ai申请一个免费的 key,然后使用ew-chat我写的这个ai聊天,就可以完成一个聊天会话网页。
在线地址。
在线地址由于没有api\_key,所以询问问题会报错。
效果如下图所示:
聊天会话的数据都使用永久会话存储在本地,以下是这个聊天会话的详细功能介绍。
说明:这个项目是使用trae编辑器帮忙编写,然后本人再修补一些trae处理不了的问题完成的。
这个聊天会话包含了多个功能。
具体功能如下图所示:
核心api请求主要是如下这一段代码。
const response = await fetch('https://openrouter.ai/api/v1/chat/completions', {
method: 'POST',
headers: {
'Authorization': `Bearer ${API_KEY}`,
'Content-Type': 'application/json'
},
body: JSON.stringify({
model: MODEL,
messages: chats.value[chatId].messages.map(msg => ({
role: msg.role,
content: msg.content
})),
stream: true
})
});
可以看到我们只要申请了key,就可以使用这个接口,然后得到ai回答的数据,我们通过fetch向openrouter ai发送请求就行了。
感兴趣的可以看看源码,自行下载下来体验吧。如果觉得有用,希望不吝啬点赞收藏并给个star。