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是
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持代码网。
发表评论