vue对接deepseekapi调用
1.先去开放平台注册账号申请api key
开放平台:https://platform.deepseek.com/api_keys

2.你的项目需要有发送请求的axios或者自己写
npm install axios # 或 yarn add axios
3.创建 api 调用函数
在 vue 项目中,通常会将 api 调用的逻辑封装到一个单独的文件中,例如 src/api/deepseek.js。
关于其中 /your-endpoint-path 是需要你自己去api文档中查看的,文档具体地方在最后面。
import axios from 'axios';
const deepseek_api_url = 'https://api.deepseek.com'; // 实际的 deepseek api 地址
const deepseek_api_key = 'your-api-key'; // 替换为你的 deepseek api key
// 创建 axios 实例
const deepseekclient = axios.create({
baseurl: deepseek_api_url,
headers: {
'authorization': `bearer ${deepseek_api_key}`,
'content-type': 'application/json',
},
});
/**
* 调用 deepseek api 示例
* @param {object} data 请求参数
* @returns {promise} api 响应
*/
export const calldeepseekapi = async (data) => {
try {
const response = await deepseekclient.post('/your-endpoint-path', data); // 替换为实际的 api 路径
return response.data;
} catch (error) {
console.error('deepseek api 调用失败:', error);
throw error;
}
};在你的 vue 组件中,可以调用上面封装的 calldeepseekapi 函数。
<template>
<div>
<h1>deepseek api 调用示例</h1>
<button @click="fetchdata">调用 deepseek api</button>
<div v-if="loading">加载中...</div>
<div v-else>
<pre>{
{ responsedata }}</pre>
</div>
</div>
</template>
<script>
import { calldeepseekapi } from '@/api/deepseek'; // 导入封装的 api 函数
export default {
data() {
return {
loading: false,
responsedata: null,
};
},
methods: {
async fetchdata() {
this.loading = true;
try {
const data = {
// 替换为实际的请求参数
prompt: '你好,deepseek!',
max_tokens: 50,
};
this.responsedata = await calldeepseekapi(data);
} catch (error) {
console.error('api 调用失败:', error);
} finally {
this.loading = false;
}
},
},
};
</script>
<style scoped>
pre {
background: #f4f4f4;
padding: 10px;
border-radius: 5px;
}
</style>
这个文档的url是


总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持代码网。
发表评论