当前位置: 代码网 > it编程>前端脚本>Vue.js > VUE对接deepseekAPI调用方式

VUE对接deepseekAPI调用方式

2025年02月13日 Vue.js 我要评论
vue对接deepseekapi调用1.先去开放平台注册账号申请api key开放平台:https://platform.deepseek.com/api_keys2.你的项目需要有发送请求的axio

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>

文档:对话补全 | deepseek api docs

这个文档的url是

总结

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

(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com