ollama离线环境部署deepseek及对话网站开发

news2025/7/18 5:22:43

ollama离线环境部署deepseek及局域网对话网站开发

需要在离线环境下面部署deepseek大模型,而且局域网内用户能在浏览器直接对话,主机的操作系统是win10

经不断探索,找到一条能走通的路,大致流程和思路如下:

  1. 局域网服务器上下载安装ollama,ollama运行下载的离线模型
  2. 开放局域网服务器ollama的主机地址和端口
  3. 编写前端对话窗口,并设置反向代理处理跨域请求

一、ollama及离线模型下载

1. 下载模型

ollama下载下来后,正常安装即可

离线模型下载,需要下载guff文件,国内可以在huggingface镜像站或者魔塔社区下载,由于主机算力非常差,我下了个DeepSeek-R1-Distill-Qwen-1.5B-Q5_K_M.gguf模型,在魔塔社区下的

下载完成后,需要写模型文件,也就是Modelfile

新建一个Modelfile文件,不需要后缀名,文件写入以下内容:

FROM ./DeepSeek-R1-Distill-Qwen-1.5B-Q5_K_M.gguf

SYSTEM """你是一个由 DeepSeek 提供支持的人工智能助手。"""

TEMPLATE """{{- if .System }}{{ .System }}{{ end }}
{{- range .Messages }}
{{- if eq .Role "user" }}[INST] {{ .Content }} [/INST]
{{- else if eq .Role "assistant" }}{{ .Content }}
{{- end }}
{{- end }}"""

PARAMETER stop "[INST]"
PARAMETER stop "[/INST]"
PARAMETER num_ctx 4096
PARAMETER temperature 0.7
PARAMETER top_p 0.9

如果熟悉的话,可以根据自己的需求自己写

2. 创建模型

将Modelfile和下载的guff文件放到同一个目录下,然后终端执行以下命令:

ollama create deepseek-qwen1.5b -f Modelfile

如果终端不报错,就表明离线模型部署成功了

然后执行ollama run deepseek-qwen1.5b可以在终端使用模型

二、主机开放IP

ollama在运行过程中,创建了一个后端服务,其运行在localhost:11434上,本机可以正常访问,但是局域网内不能访问,需要在本机的高级系统设置中新建两个环境变量,变量名和值如下:

  • 变量名:OLLAMA_HOST,值:0.0.0.0,作用是开放本机IP
  • 变量名:OLLAMA_ORIGINS,值:*,作用是运行局域网内所有用户访问,这一步忘了配置,导致卡了半天。。

三、编写前端页面

这里借助[Semi Design UI](Getting Started 快速开始 | semi-design-vue),因为它提供了快速使用的对话窗口,而且我个人觉得它的UI风格比ant design还要漂亮,但是它是基于JSX写的,用起来不是特别顺手

1. 对话组件

用的是上述UI框架中的Chat组件,全部代码如下:

<template>
  <div class="container">
    <Chat
      :key="align + mode"
      :align="align"
      :mode="mode"
      :style="commonOuterStyle"
      :chats="message"
      :roleConfig="roleInfo"
      @chatsChange="onChatsChange"
      @messageSend="onMessageSend"
      @messageReset="onMessageReset"
      class="chat"
    />
    <Spin
      v-show="loadingStatus"
      tip="loading..."
      size="large"
      class="loading"
    />
  </div>
</template>

<script setup>
import { ref, defineComponent } from "vue";
import { Chat, Spin } from "@kousum/semi-ui-vue";
import { getLargeModelAPI } from "@/apis/chat";

const defaultMessage = [
  {
    role: "system",
    id: "1",
    createAt: new Date(),
    content: "您好,我是您的智能助理,您可以问我任何问题.",
  },
];

const roleInfo = {
  user: {
    name: "用户",
    avatar: "/user.png",
  },
  assistant: {
    name: "系统",
    avatar: "/model.png",
  },
  system: {
    name: "系统",
    avatar: "/model.png",
  },
};

const commonOuterStyle = {
  border: "1px solid var(--semi-color-border)",
  borderRadius: "16px",
  margin: "8px 16px",
  height: 550,
};

let id = 0;
function getId() {
  return `id-${id++}`;
}

// const uploadProps = { action: "https://api.semi.design/upload" };
// const uploadTipProps = { content: "自定义上传按钮提示信息" };

const message = ref(defaultMessage);
const mode = ref("bubble");
const align = ref("leftRight");

// 加载状态
const loadingStatus = ref(false);
const question = ref("");
const onMessageSend = async (content, attachment) => {
  question.value = content;
  loadingStatus.value = true;
  try {
    const res = await getLargeModelAPI(content);
    loadingStatus.value = false;
    const newAssistantMessage = {
      role: "assistant",
      id: getId(),
      createAt: Date.now(),
      content: res.choices[0].text.replace("]", ""),
    };
    setTimeout(() => {
      message.value = [...message.value, newAssistantMessage];
    }, 200);
  } catch (error) {
    loadingStatus.value = false;
  }
};

const onChatsChange = (chats) => {
  message.value = chats;
};

const onMessageReset = () => {
  setTimeout(async () => {
    const lastMessage = message.value[message.value.length - 1];
    loadingStatus.value = true;
    const res = await getLargeModelAPI({ prompt: question.value });
    loadingStatus.value = false;

    const newLastMessage = {
      ...lastMessage,
      status: "complete",
      content: res.generated_text,
    };
    message.value = [...message.value.slice(0, -1), newLastMessage];
  }, 200);
};
</script>

<style lang="scss" scoped>
.container {
  position: relative;
  width: 100vh;
  height: 100vh;
  display: flex;
  justify-content: center;
  .chat {
    width: 100%;
    height: 100%;
  }
  .loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>

关键逻辑是调用getLargeModelAPI方法,也就是ollama的调用接口,获取对话信息,并将消息堆入对话数组

2. getLargeModelAPI调用ollama接口

这里不再封装axios,直接使用axios,代码如下:

import axios from "axios";
import { Toast } from '@kousum/semi-ui-vue';

export const getLargeModelAPI = async (prompt) => {
    try {
        // const url = "http://localhost:11434/v1/completions"
        const url = "/api/v1/completions"
        const headers = {
            "Content-Type": "application/json",
        }
        const request = {
            prompt,
            model: "deepseek-qwen1.5b",
            max_tokens: 1000,
            temperature: 0.7,
            top_p: 1,
            n: 1
        }
        const response = await axios.post(url, request, headers)
        return response.data
    } catch (error) {
        console.error(error);
        Toast.error("Failed to get large model API")
    }
}

值得关注的是,这里调用的地址并非直接是ollama的地址(http://localhost:11434/v1/completions),而是代理的地址,因为ollama的端口是11434,与页面地址的端口不一样,所以会出现跨域问题(实际上,本机上我直接调用http://localhost:11434/v1/completions也能得到数据,但是局域网内其他用户就不行了),所以还需要配置反向代理

3. 配置反向代理

在vite的配置文件中设置代理

import { fileURLToPath, URL } from "node:url";

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import vueDevTools from "vite-plugin-vue-devtools";

// https://vite.dev/config/
export default defineConfig({
  plugins: [vue(), vueDevTools()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
  server: {
    proxy: {
      "/api": {
        // target: "http://localhost:11434",
        target: "http://192.168.xxx.xxx:11434",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  },
});

代理地址替换成本机ip即可

至此,大功告成,前端访问页面如下:

image-20250214143235859

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2300017.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Unity】 HTFramework框架(六十)Assistant助手(在Unity中接入DeepSeek等AI语言大模型)

更新日期&#xff1a;2025年2月14日。 Github源码&#xff1a;[点我获取源码] Gitee源码&#xff1a;[点我获取源码] 索引 Assistant助手安装Ollama使用Assistant&#xff08;在编辑器中&#xff09;打开Assistant配置Assistant使用Assistant处理Assistant回复的内容使用推理大…

Spring AI集成DeepSeek,实现流式输出

前面一篇文章我们实现了《Spring AI集成DeepSeek&#xff1a;三步搞定Java智能应用》&#xff0c;大模型的响应速度是很慢的&#xff0c;为了提升用户体验&#xff0c;我们通常会使用流式输出一点点将结果输出给用户。先看下效果&#xff1a; 在 SpringBoot 中实现流式输出可以…

搭建一个经典的LeNet5神经网络

第一章&#xff1a;计算机视觉中图像的基础认知 第二章&#xff1a;计算机视觉&#xff1a;卷积神经网络(CNN)基本概念(一) 第三章&#xff1a;计算机视觉&#xff1a;卷积神经网络(CNN)基本概念(二) 第四章&#xff1a;搭建一个经典的LeNet5神经网络 一、LeNet-5背景 LeNet-…

DeepSeek-R1:通过强化学习激励大型语言模型的推理能力

摘要 我们介绍了第一代推理模型DeepSeek-R1-Zero和DeepSeek-R1。DeepSeek-R1-Zero是一个通过大规模强化学习(RL)训练而成的模型,无需监督微调(SFT)作为初步步骤,展示了卓越的推理能力。通过RL,DeepSeek-R1-Zero自然涌现出许多强大而有趣的推理行为。然而,它也面临诸如…

Unity 编辑器热更C# FastScriptReload

工具源码&#xff1a;https://github.com/handzlikchris/FastScriptReload 介绍 用于运行时修改C#后能快速重新编译C#并生效&#xff0c;避免每次改C#&#xff0c;unity全部代码重新编译&#xff0c;耗时旧且需要重启游戏。 使用 需要手动调整AssetPipeline自动刷新模式&…

DeepSeek在linux下的安装部署与应用测试

结合上一篇文章&#xff0c;本篇文章主要讲述在Redhat linux环境下如何部署和使用DeepSeek大模型&#xff0c;主要包括ollama的安装配置、大模型的加载和应用测试。关于Open WebUI在docker的安装部署&#xff0c;Open WebUI官网也提供了完整的docker部署说明&#xff0c;大家可…

VNC远程控制Mac

前言 macOS系统自带有VNC远程桌面&#xff0c;我们可以在控制端上安装配置VNC客户端&#xff0c;以此来实现远程控制macOS。但通常需要在不同网络下进行远程控制&#xff0c;为此&#xff0c;我们可以在macOS被控端上使用cpolar做内网穿透&#xff0c;映射VNC默认端口5…

计算机视觉:卷积神经网络(CNN)基本概念(一)

第一章&#xff1a;计算机视觉中图像的基础认知 第二章&#xff1a;计算机视觉&#xff1a;卷积神经网络(CNN)基本概念(一) 第三章&#xff1a;计算机视觉&#xff1a;卷积神经网络(CNN)基本概念(二) 第四章&#xff1a;搭建一个经典的LeNet5神经网络 一、引言 卷积神经网络&…

Python的那些事第二十三篇:Express(Node.js)与 Python:一场跨语言的浪漫邂逅

摘要 在当今的编程世界里,Node.js 和 Python 像是两个性格迥异的超级英雄,一个以速度和灵活性著称,另一个则以强大和优雅闻名。本文将探讨如何通过 Express 框架将 Node.js 和 Python 结合起来,打造出一个高效、有趣的 Web 应用。我们将通过一系列幽默风趣的实例和表格,展…

核货宝外贸订货系统:批发贸易企业出海的强劲东风

在全球贸易一体化的汹涌浪潮中&#xff0c;批发贸易企业正积极探寻海外市场的广阔天地&#xff0c;试图开辟新的增长版图。然而&#xff0c;出海之路绝非坦途&#xff0c;众多难题如暗礁般潜藏在前行的航道上。从复杂繁琐的跨境交易流程、变幻莫测的国际市场需求&#xff0c;到…

最新智能优化算法: 阿尔法进化(Alpha Evolution,AE)算法求解23个经典函数测试集,MATLAB代码

一、阿尔法进化算法 阿尔法进化&#xff08;Alpha Evolution&#xff0c;AE&#xff09;算法是2024年提出的一种新型进化算法&#xff0c;其核心在于通过自适应基向量和随机步长的设计来更新解&#xff0c;从而提高算法的性能。以下是AE算法的主要步骤和特点&#xff1a; 主…

【弹性计算】容器、裸金属

容器、裸金属 1.容器和云原生1.1 容器服务1.2 弹性容器实例1.3 函数计算 2.裸金属2.1 弹性裸金属服务器2.2 超级计算集群 1.容器和云原生 容器技术 起源于虚拟化技术&#xff0c;Docker 和虚拟机和谐共存&#xff0c;用户也找到了适合两者的应用场景&#xff0c;二者对比如下图…

【个人开发】deepspeed+Llama-factory 本地数据多卡Lora微调

文章目录 1.背景2.微调方式2.1 关键环境版本信息2.2 步骤2.2.1 下载llama-factory2.2.2 准备数据集2.2.3 微调模式2.2.3.1 zero-3微调2.2.3.2 zero-2微调2.2.3.3 单卡Lora微调 2.3 踩坑经验2.3.1 问题一&#xff1a;ValueError: Undefined dataset xxxx in dataset_info.json.2…

两步在 Vite 中配置 Tailwindcss

第一步&#xff1a;安装依赖 npm i -D tailwindcss tailwindcss/vite第二步&#xff1a;引入 tailwindcss 更改配置 // src/main.js import tailwindcss/index// vite.config.js import vue from vitejs/plugin-vue import tailwindcss from tailwindcss/viteexport default …

计算机视觉-尺度不变区域

一、尺度不变性 1.1 尺度不变性 找到一个函数&#xff0c;实现尺度的选择特性。 1.2 高斯偏导模版求边缘 1.3 高斯二阶导 用二阶过零点检测边缘 高斯二阶导有两个参数&#xff1a;方差和窗宽&#xff08;给定方差可以算出窗宽&#xff09; 当图像与二阶导高斯滤波核能匹配…

SNARKs 和 UTXO链的未来

1. 引言 SNARKs 经常被视为“解决”扩容问题的灵丹妙药。虽然 SNARKs 可以提供令人难以置信的好处&#xff0c;但也需要承认其局限性——SNARKs 无法解决区块链目前面临的现有带宽限制。 本文旨在通过对 SNARKs 对比特币能做什么和不能做什么进行&#xff08;相对&#xff09…

DeepSeek 通过 API 对接第三方客户端 告别“服务器繁忙”

本文首发于只抄博客&#xff0c;欢迎点击原文链接了解更多内容。 前言 上一期分享了如何在本地部署 DeepSeek R1 模型&#xff0c;但通过命令行运行的本地模型&#xff0c;问答的交互也要使用命令行&#xff0c;体验并不是很好。这期分享几个第三方客户端&#xff0c;涵盖了桌…

性格测评小程序07用户登录

目录 1 创建登录页2 在首页检查登录状态3 搭建登录功能最终效果总结 小程序注册功能开发好了之后&#xff0c;就需要考虑登录的问题。首先要考虑谁作为首页&#xff0c;如果把登录页作为首页&#xff0c;比较简单&#xff0c;每次访问的时候都需要登录。 如果把功能页作为首页&…

deepseek多列数据对比,联想到excel的高级筛选功能

目录 1 业务背景 ​2 deepseek提示词输入 ​3 联想分析 4 EXCEL高级搜索 1 业务背景 系统上线的时候经常会遇到一个问题&#xff0c;系统导入的数据和线下的EXCEL数据是否一致&#xff0c;如果不一致&#xff0c;如何快速找到差异值&#xff0c;原来脑海第一反应就是使用公…

国产编辑器EverEdit - “切换文件类型”的使用场景

1 “切换文件类型”的使用场景 1.1 应用背景 一般的编辑器都是通过扩展名映射到对应的语法高亮规则的&#xff0c;比如&#xff1a;文件test.xml中的扩展名“xml"对应XML的语法高亮&#xff0c;在编辑器中打开test.xml就会给不同标识符显示不同的颜色。 但有时一些应用程…