本地部署开源在线PPT制作与演示应用PPTist并实现异地远程使用

news2024/11/17 13:33:49

文章目录

    • 前言
    • 1. 本地安装PPTist
    • 2. PPTist 使用介绍
    • 3. 安装Cpolar内网穿透
    • 4. 配置公网地址
    • 5. 配置固定公网地址

前言

本文主要介绍如何在Windows系统环境本地部署开源在线演示文稿应用PPTist,并结合cpolar内网穿透工具实现随时随地远程访问与使用该项目。

PPTist 是一个基于Vue3.x和TypeScript构建的在线演示文稿应用,模仿了微软PowerPoint 的大部分常用功能。它允许用户在线编辑和展示 PPT,并支持将文件导出为 PPTX 格式。除此之外,还支持绘制各种图形和图表,支持插入视频和音频,与移动端使用,目前项目在github上面收获了5.6K star!

自己在本地部署PPTist的优势是无需安装和购买许可,也大大减少了在不同设备上出现的兼容性问题。不过只能本地使用也有一定局限性,但只要安装内网穿透工具就能轻松解决没有公网IP,也能远程访问本地服务的问题。

1719299881503

1. 本地安装PPTist

接下来教大家如何在Windows系统本地安装 PPTist

项目地址:https://github.com/pipipi-pikachu/PPTist

首先需要从github上克隆 PPTist(如果没有安装git的话,进入git官网进行下载windows版本 https://git-scm.com/downloads)

image-20240506142150939

打开终端,从github下载项目到本地,执行下面的命令:

git clone https://github.com/pipipi-pikachu/PPTist.git

image-20240625152907269

然后进入项目目录:

cd PPTist

然后安装依赖:

npm install

image-20240625154000788

最后运行项目即可:

npm run dev

1719301237351

可以看到运行成功,出现项目地址: http://localhost:5173

通过浏览器访问,即可开始在线创建编辑与展示幻灯片。

image-20240625155013029

2. PPTist 使用介绍

PPTist 提供了在线演示和编辑的功能,整体观感非常干净美观。

左上角为主菜单,包括了导入、导出与快捷键介绍功能。

image-20240625155640951

image-20240625160115841

中间的主编辑区上方,则是插入文字,图片,表格与音视频功能。

image-20240625160026742

右侧则是可以对PPT进行整体设计,切换效果选择等操作。

image-20240625160515865

点击当前文稿可对当前页面进行样式编辑,位置调整,添加动画等操作。

image-20240625155953876

3. 安装Cpolar内网穿透

作为一个开源的在线PPT演示应用,PPTist提供了与桌面版 PowerPoint 相似的功能和极其快捷方便的用户体验,不需要安装任何软件,跨平台兼容性强。

目前我们在本机安装了PPTist,但如果没有公网IP的话,只能在本地局域网环境使用,有一定局限性。如果出差在外想要远程使用的话,可以结合Cpolar内网穿透生成公网地址,免去了本地重新部署过程,只需要使用公网地址直接就可以访问本地部署的PPTist,进行演示。

下面是安装cpolar步骤:

Cpolar官网地址: https://www.cpolar.com

点击进入cpolar官网,点击免费使用注册一个账号,并下载最新版本的Cpolar

img

登录成功后,点击下载Cpolar到本地并安装(一路默认安装即可)本教程选择下载Windows版本。

image-20240319175308664

Cpolar安装成功后,在浏览器上访问http://localhost:9200,使用cpolar账号登录,登录后即可看到Cpolar web 配置界面,结下来在web 管理界面配置即可。

img

4. 配置公网地址

接下来配置一下本地 PPTist 的公网地址,

登录后,点击左侧仪表盘的隧道管理——创建隧道,

创建一个 PPTist 的公网http地址隧道:

  • 隧道名称:可自定义命名,注意不要与已有的隧道名称重复
  • 协议:选择 http
  • 本地地址:5173
  • 域名类型:免费选择随机域名
  • 地区:选择China Top

点击创建

image-20240625161411946

隧道创建成功后,点击左侧的状态——在线隧道列表,查看所生成的公网访问地址,有两种访问方式,分别是http和https。

image-20240625161941543

使用任意一个上面Cpolar生成的公网地址,在电脑或任意设备在浏览器进行登录访问,即可成功看到 PPTist 界面,这样一个可以远程访问的公网地址就创建好了,使用了Cpolar的公网域名,无需自己购买云服务器,即可在公网访问本地部署的服务了!

image-20240625162402262

小结

由于刚才创建的是随机的公网地址,24小时会发生变化。另外它的网址是由随机字符生成,不容易记忆。如果你有长期远程访问本地部署服务的需求,或者想把域名变成固定,好记的二级子域名,并且不想每次都重新创建隧道来访问你在本地部署的服务,我们可以选择创建一个固定的公网地址来解决这个问题。

5. 配置固定公网地址

我们接下来为其配置固定的HTTP端口地址,该地址不会变化,方便分享给别人长期查看你的本地服务,而无需每天重复修改服务器地址。

配置固定http端口地址需要将cpolar升级到专业版套餐或以上。

登录cpolar官网,点击左侧的预留,选择保留二级子域名,设置一个二级子域名名称,点击保留,保留成功后复制保留的二级子域名名称。

image-20240625162601023

保留成功后复制保留成功的二级子域名的名称:myppt(大家可以自定义)

image-20240625162629519

返回登录Cpolar web UI管理界面,点击左侧仪表盘的隧道管理——隧道列表,找到所要配置的隧道 PPTist ,点击右侧的编辑:

image-20240625162724288

修改隧道信息,将保留成功的二级子域名配置到隧道中

  • 域名类型:选择二级子域名
  • Sub Domain:填写保留成功的二级子域名

点击更新(注意,点击一次更新即可,不需要重复提交)

image-20240625162810498

更新完成后,打开在线隧道列表,此时可以看到公网地址已经发生变化,地址名称也变成了固定的二级子域名名称的域名:

image-20240625162836062

最后,我们使用固定的公网地址在任何浏览器打开访问,可以看到成功访问 PPTist,这样一个固定且永久不变的二级子域名公网地址就设置好了。

image-20240625163008747

以上就是如何在Windows系统电脑本地部署开源在线演示文稿应用PPTist,并结合cpolar内网穿透工具实现远程访问使用的全部流程,另外由于该服务无需账号即可在浏览器直接访问,出于安全考虑,建议大家远程访问时不要轻易与他人分享地址,感谢您的观看,有任何问题欢迎留言交流。

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

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

相关文章

Vue3(五) 组件通信大汇总

文章目录 一、props二、自定义事件三、mitt四、v-model1.v-model的本质2.v-model用在组件标签上3.更换modelValue4.更换modelValue时,可以在组件标签上多次使用v-model 五、$attrs六、$refs,与¥parent1. 回顾标签ref属性修改组件信息2. $refs实现父修改所…

学校周赛(1)

A - Short Sort 题目: 思路: 本条题目只允许改一处地方,只有三个字母,我们可以直接枚举所有移动过的结果,同时使用哈希去记录其值,对于每一个输入我们都寻找是否有这个值记录,有则输出YES否则…

毕业设计选题:基于ssm+vue+uniapp的校园订餐小程序

开发语言:Java框架:ssmuniappJDK版本:JDK1.8服务器:tomcat7数据库:mysql 5.7(一定要5.7版本)数据库工具:Navicat11开发软件:eclipse/myeclipse/ideaMaven包:M…

数据库管理与开发的全面解决方案——Devart全线产品测评

在现代数据库管理和应用开发中,拥有一套高效且强大的工具是至关重要的。Devart,作为一家专业提供数据库开发和管理工具的公司,已经在行业内树立了坚实的声誉。其产品线涵盖了从数据库连接驱动到全面的数据集成和管理解决方案,满足…

读数据湖仓02数据抽象

1. 不同类型的数据 1.1. 不同类型的数据在存储方面有各自的特性,这些特性极大地影响了数据在数据湖仓中的存储和使用方式 1.2. 结构化数据 1.2.1. 在企业等组织中,只有少量的数据是结构化数据 1.2.2. 结构化数据是基于事务的数据,是组织日…

[spring]用MyBatis XML操作数据库 其他查询操作 数据库连接池 mysql企业开发规范 动态sql

文章目录 一. MyBatis XML配置文件1. 配置链接字符串和MyBatis2. 写持久层代码方法定义Interface方法实现xml测试 3. 增删改查增:删改查 二. 开发规范(mysql)三. 其他查询操作1. 多表查询2. #{} 和 ${}(面试题)使用区别 排序功能like查询 三. 数据库连接池四. 动态sql1. < i…

【补充】倒易点阵定义

晶体点阵&#xff1a;晶体内部结构在三维空间周期平移的客观存在的数学抽象&#xff0c;反映晶体实际原子排列。 倒易点阵&#xff1a;通过对晶体的正点阵进行傅里叶变换得到的&#xff0c;其中正点阵中每个阵点的位置矢量方向代表晶面族的法向&#xff0c;位置矢量的长度是晶…

C++ | Leetcode C++题解之第442题数组中重复的数据

题目&#xff1a; 题解&#xff1a; class Solution { public:vector<int> findDuplicates(vector<int>& nums) {int n nums.size();vector<int> ans;for (int i 0; i < n; i) {int x abs(nums[i]);if (nums[x - 1] > 0) {nums[x - 1] -nums[…

我把101篇公众号文章喂给了AI,终于,「小爱」可以为我代言了!

前段时间&#xff0c;搞了个微信 AI 小助理-小爱(AI)&#xff0c;爸妈玩的不亦乐乎。 零风险&#xff01;零费用&#xff01;我把AI接入微信群&#xff0c;爸妈玩嗨了&#xff0c;附教程&#xff08;下&#xff09; 目前小爱(AI)仍在持续迭代中&#xff0c;受到了很多粉丝朋友…

使用transformers中的pipeline调用huggingface中模型过程中可能遇到的问题和修改建议

使用transformers中的pipeline调用huggingface中模型过程 前言管线使用中的问题和解决huggingface的连接问题使用huggingface示例修改源继续使用pipeline No module named keras.engine 前言 HuggingFace有一个巨大的模型库&#xff0c;其中包括很多的比较成熟的经典模型&…

牛犇啊!LSTM+Transformer炸裂创新,精准度高至95.65%!

【LSTMTransformer】作为一种混合深度学习模型&#xff0c;近年来在学术界和工业界都受到了极大的关注。它巧妙地融合了长短期记忆网络&#xff08;LSTM&#xff09;在处理时序数据方面的专长和Transformer在捕捉长距离依赖关系上的优势&#xff0c;从而在文本生成、机器翻译、…

Request 原理

目录 request原理 Request继承体系 ​编辑Request获取请求行数据方法介绍 1、获取请求行数据 2、获取请求头数据 3、获取请求体数据 4、其他功能 1、获取请求参数通用方式&#xff1a; 中文乱码问题&#xff1a; 2.请求转发 3.共享数据 4.获取servletcontext reques…

set和map结构的使用

个人主页&#xff1a;敲上瘾-CSDN博客 个人专栏&#xff1a;游戏、数据结构、c语言基础、c学习、算法 目录 一、序列式容器和关联式容器 二、set和multiset 1.insert 2.erase 3.find 4.count 三、map和mapmulti 1.pair 2.insert 3.find 4.operator[ ] 5.erase 6.lo…

QT-自定义信号和槽对象树图形化开发计算器

1. 自定义信号和槽 核心逻辑&#xff1a; 需要有两个类&#xff0c;一个提供信号&#xff0c;另一个提供槽。 然后在窗口中将 信号和槽 链接起来。 示例目标&#xff1a; 创建一个 Teacher 类&#xff0c;提供信号。 创建一个 Student 类&#xff0c;提供槽。 实现步骤&…

策略路由控制选路

&#x1f423;个人主页 可惜已不在 &#x1f424;这篇在这个专栏 华为_可惜已不在的博客-CSDN博客 &#x1f425;有用的话就留下一个三连吧&#x1f63c; 目录 一、 实验拓扑 二、 实验简述 三、 实验配置 配置路由信息 配置控制选路 四、 实验验证 ​ 一、 实验…

「安装」 Windows下安装CUDA和Pytorch

「安装」 Windows下安装CUDA和Pytorch 文章目录 「安装」 Windows下安装CUDA和PytorchMac、Linux、云端Windows安装CUDA安装miniconda安装PyTorch测试总结 其他 Mac、Linux、云端 Mac、Linux、云端安装Miniconda和Pytorch的方法参考其他资料。 Windows 下面进行Windows下安装…

CSS选择器的全面解析与实战应用

CSS选择器的全面解析与实战应用 一、基本选择器1.1 通配符选择器&#xff08;*&#xff09;2.标签选择器&#xff08;div&#xff09;1.3 类名选择器&#xff08;.class&#xff09;4. id选择器&#xff08;#id&#xff09; 二、 属性选择器&#xff08;attr&#xff09;三、伪…

转行大模型的必要性与未来前景:迎接智能时代的浪潮

随着人工智能&#xff08;AI&#xff09;技术的迅猛发展&#xff0c;特别是大型语言模型&#xff08;LLM, Large Language Models&#xff09;的崛起&#xff0c;各行各业正迎来一场前所未有的技术革命。对于普通程序员而言&#xff0c;转行进入大模型领域不仅是对个人职业发展…

通配符与Powershell

通配符与正则表达式 通配符 通配符是一种特殊的语句&#xff0c;主要有*、?和[]&#xff0c;用来模糊搜索文件。 通配符表达意思举例说明*星号、匹配任何字符*.cpp匹配.cpp文件?问号、匹配任意一个字符*.?d匹配具有特定格式的文件[]中括号、匹配括号中的一个字符.[a-z]d代…

DC00020基于springboot新闻网站系统java web项目MySQL新闻管理系统

1、项目功能演示 DC00020基于springboot新闻网站系统java web项目MySQL 2、项目功能描述 基于springbootvue新闻网站包括用户和系统管理员两个角色。 2.1 用户功能 1、用户登录、用户注册 2、新闻信息&#xff1a;点赞、点踩、收藏、查看 3、用户分享&#xff1a;点赞、点踩…