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

文章目录

    • 前言
    • 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.rhkb.cn/news/434074.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ST188单光束反射式红外光电传感器心率测量原理

光电传感器心率测量原理 ST188传感器测量脉搏的具体原理如下: 当手指轻轻按压在ST188红外光电传感器上时,传感器内部的红外发射二极管会发出红外线。这些红外线穿透手指皮肤,照射到血液上。由于脉搏跳动时,血液的体积和压力会发生…

从零开始,Docker进阶之路(三):Docker镜像与命令

一、Docker核心名词 镜像文件、容器、仓库 镜像:简单理解为就是一个安装包,里面包含容器所需要运行的基础文件和配置信息,比如:redis镜像、mysql镜像等。 镜像的来源方式: 1.自己做镜像,比如自己开发微服…

K8s容器运行时,移除Dockershim后存在哪些疑惑?

K8s容器运行时,移除Dockershim后存在哪些疑惑? 大家好,我是秋意零。 K8s版本截止目前(24/09)已经发布到了1.31.x版本。早在K8s版本从1.24.x起(22/05),默认的容器运行时就不再是Doc…

记录Mac编译Android源码踩过的坑

学习Android源码,如果电脑配置还不错,最好还是下载一套源码,经过编译后导入到Android Studio中来学习,这样会更加的直观,代码之间的跳转查看会更加方便。因此,笔者决定下载并编译一套源码,以利于…

生活中重大决定,除了你自己,谁也帮不了你!

随着年龄增长,越来越发现:生活是非常现实,更现实的社会,自己除了自己,谁也帮不了你。 因此,一个人的生活是好是坏,往往取决于我们自己的努力程度,越努力才会越幸运。没有伞的孩子&am…

力扣(leetcode)每日一题 2516 每种字符至少取 K 个 | 滑动窗口

2516. 每种字符至少取 K 个 给你一个由字符 a、b、c 组成的字符串 s 和一个非负整数 k 。每分钟,你可以选择取走 s 最左侧 还是 最右侧 的那个字符。 你必须取走每种字符 至少 k 个,返回需要的 最少 分钟数;如果无法取到,则返回…

Win10系统插入带有麦克风的耳机_麦克风不起作用_解决方法_亲测成功---Windows运维工作笔记054

今天我在使用讯飞输入法的时候,想通过讯飞的语音输入法来提高自己的输入效率。 但是这个时候发现一个问题就是我插入我的台式机的是一个带有麦克风的耳机。 但是发现我这个耳机没有办法被电脑识别出麦克风来,所以说就没办法使用讯飞输入法的语音输入功能来直接输入文字了。…

你知道AI模型是如何学习的吗???零基础入门到精通,收藏这一篇就够了

在人工智能的广阔天地中,AI模型的学习方式不仅决定了其智能行为的深度和广度,更是推动技术进步和应用创新的关键动力。随着AI技术的飞速发展,我们越来越意识到,深入了解AI的学习机制对于把握其潜能至关重要。 这篇文章将从基础概…

从物流员到月薪12K:他如何成功转行人工智能大模型,逆袭人生!

苑同学,21岁,江苏人 专科学历,物流管理专业 入行后:嵌入式开发,12K 工作地点:苏州 苑同学,来自江苏苏州,是一名普通的大专毕业生,今天我们来听听他的故事。。。 我的…

蓝桥杯—STM32G431RBT6(TIM定时器输入捕获频率和占空比)

一、什么是输入捕获?对比输出捕获区别? 输入捕获是指对输入信号的特定事件进行检测和记录它主要用于测量输入信号的时间间隔、频率等参数。而输出捕获则是对输出信号的特定事件进行控制和监测。两者的主要区别在于作用对象不同,输入捕获关注的…

【Threejs进阶教程-着色器篇】8. Shadertoy如何使用到Threejs-基础版

【Threejs进阶教程-着色器篇】8. Shadertoy如何使用到Threejs - 基础版 前七篇地址,建议按顺序学习致谢带我入门的[X01动力装甲]大佬本文适用范围怎么样在Shadertoy中画出正圆形shadertoy中的坐标系比例转换理解Shadertoy的fragCoord理解Shadertoy中的iResolution 转移Shaderto…

【YOLO目标检测输电线路异物数据集】共4516张、已标注txt格式、有训练好的yolov5的模型

目录 说明图片示例 说明 数据集格式:YOLO格式 图片数量:4516 标注数量(txt文件个数):4516 标注类别数:4 标注类别名称:nest、kite、balloon、trash 数据集下载:输电线路异物数据集 图片示例 数据集…

react 状态管理

Redux Redux是React中常用的状态管理组件,类似于Vue中的Pinia(Vuex),可以独立于框架运行 作用: 通过集中管理的方式管理应用的状态 配套工具 在react中使用redux,官方要求按照两个插件,Redux Toolkit 和 react-red…

c++(AVL树及其实现)

一、AVL树的概念 AVL树是最先发明的自平衡⼆叉查找树,AVL是⼀颗空树,或者具备下列性质的⼆叉搜索树:它的 左右子树都是AV树,且左右子树的高度差的绝对值不超过1。AVL树是⼀颗高度平衡搜索⼆叉树, 通过控制高度差去控…

星辰计划04-深入理解kafka的消息存储和索引设计

消息存储 提到存储不得不说消息的读写,那么kafka他是如何读写数据的呢? 读取消息 1.通过debug(如何debug) 我们可以得到下面的调用栈,最终通过FileRecords来读取保存的数据 写入消息 1.通过debug(如何debug) 我们可以得到下面的调用栈&am…

在LLMs模型中发现人类的记忆特征

论文地址:https://arxiv.org/abs/2311.03839 介绍 大型语言模型(LLM),如 ChatGPT,为语言建模和生成人类水平的文本输出带来了质的飞跃。 这些模型在庞大的文本库中进行训练,有效地建立了高度复杂和准确的…

标准 I/O

标准 I/O 引言 I/O 是一切实现的基础,其分为标准 I/O 和文件 I/O。 文件 I/O 依赖操作系统,因系统的实现方式而定,对于程序员来说会造成很大困扰。如打开文件,Linux 系统调用为 open() 函数,而 Windows 的系统调用为…

【锁住精华】MySQL锁机制全攻略:从行锁到表锁,共享锁到排他锁,悲观锁到乐观锁

MySQL有哪些锁 1、按照锁的粒度划分 行锁 是最低粒度的的锁,锁住指定行的数据,加锁的开销较大,加锁较慢,可能会出现死锁的情况,锁的竞争度会较低,并发度相对较高。但是如果where条件里的字段没有加索引&…

OpenCV 形态学相关函数详解及用法示例

OpenCV形态学相关的运算包含腐蚀(MORPH_ERODE),膨胀(MORPH_DILATE),开运算(MORPH_OPEN),闭运算(MORPH_CLOSE),梯度运算(MORPH_GRADIENT),顶帽运算(MORPH_TOPHAT),黑帽运算(MORPH_BLACKHAT),击中…

AI产品经理:基于大模型Agent的客服实践,更低的成本与更大的收益

现在AI客服已经在各行业普遍使用了,但是实际效果并不如意——用户宁愿等人工客服,也不愿意找AI客服解决问题。如果给当前的AI客服换成大模型,效果会不会更好一些?这篇文章,我们来看看作者的思考。 一、为什么要用大模型…