前言
网络上的PDF需要下载至本地才能浏览,本方法借助PDF.js项目上传至Gitee仓库,将自己的PDF文件生成链接,实现在线预览。
PDF文件实现在线预览,好处在于:
只需要一个固定的链接,不需要下载就可以浏览文件。
上传的PDF文件可以更新。
实现步骤
下载PDF.js项目→替换PDF.js→上传Gitee仓库→保存链接
Gitee仓库搭建
注册gitee账号并创建仓库
登录码云 https://gitee.com/
创建一个与自己用户名同名的仓库,比如我的gitee账户名是sumsu,那么创建一个sumsu的项目,这样的目的是为了使用giteepages服务,也就是拿这个仓库来做网页。
如果不会使用,可自行百度,方法简单,不过多叙述。
生成SSH密钥
在此之前,需要使用一个命令编辑器和git程序,如果没有的可以下载安装:visual studio code、git
下载中间这个蓝色的就好了。git点download就好了,下载完成后安装。
打开软件VS code,ctrl+~打开命令框,
$ ssh-keygen -t rsa -C '你的邮箱' -f ~/.ssh/gitee_id_rsa #邮箱使用gitee注册的邮箱
三次回车,这里什么也不用填
在C:\Users\你的用户名.ssh目录下可以看见以.pub结尾的文件,在VS code中将此文件打开。复制所有内容,回到刚刚注册好的gitee账号页面,点击右上角头像-个人主页-SSH公钥-将内容粘贴到gitee公钥中。
点击确定,完成。
最后可以使用命令测试是否连接成功:
$ ssh -T git@gitee.com
连接远程仓库并上传代码文件
Git 全局设置:
git config --global user.name "用户名"
git config --global user.email "你的邮箱"
创建 git 仓库:
mkdir PDF #选择一个路径创建一个名为‘PDF’文件夹,默认在Users/你的电脑用户名/中
cd PDF #进入PDF文件夹中,就好像你双击文件夹进入一样
git init #git 初始话PDF文件夹
创建好文件夹后,将PDF.JS源码下载下来,全部解压后放入PDF文件夹中:
PDF.js项目下载
PDF.js下载地址:PDF.js
将下载完成的文件全部解压
将上述的文件移入你创建的PDF文件夹中。
现在只需要将你需要展示的PDF文件放入到web文件夹中,删除原有的PDF文件。(注意PDF文件名称最好不要有中文)
之后回到VS code中执行命令(必须将cd PDF到指定的文件夹下执行):
git add * #git添加所有文件,准备上传
git commit -m "first commit" #提交文件
git remote add origin git@gitee.com:你的gitee用户名/你的gitee用户名.git #连接到gitee远程仓库
git push -u origin master #上传你提交的文件
回到gitee你创建的仓库中,点击服务-giteepages-更新部署。
之后打开链接:
https://你的gitee用户名.gitee.io/web/viewer.html?file=你的pdf文件名.pdf
即可完成。
如果只有一个PDF文件需要上传可以使用默认链接更加简洁:
https://你的gitee用户名.gitee.io/pdf.js/web/viewer.html
但是需要在viewer.js中将默认的PDF文件名修改成需要显示的PDF文件名。
更新PDF文件
之后每一次更新文件时,仅仅每次将web中的PDF文件替换,然后执行命令:
git add * #git添加所有文件,准备上传
git commit -m "xxx" #提交文件
git push -u origin master #上传你提交的文件
回到gitee你创建的仓库中,点击服务-giteepages-更新部署即可。