pdf.js跨服务器访问文件夹

话不多少直接操作
1,先附带一个官方地址提供下载
pdf.js官网:http://mozilla.github.io/pdf.js/
减压下来的文件夹
pdf.js跨服务器访问文件夹
我们新建一个项目
pdf.js跨服务器访问文件夹
添加一个新项(我用的webform)
pdf.js跨服务器访问文件夹
在里面添加一个iframepdf.js跨服务器访问文件夹
准备工作都做好,现在进入正题:
我们把我们下载的文件扔到项目中去这样:pdf.js跨服务器访问文件夹
我们在web文件夹里面找到viewer.js打开,把value的默认值清空
pdf.js跨服务器访问文件夹
下面我们只需要给iframe的src赋值就好了,我这里用的是jq
pdf.js跨服务器访问文件夹
jq的链接就不提供了,大家应该都有
然后我们运行一下项目pdf.js跨服务器访问文件夹
当当当,好看的页面出来了,表激动,激动的时候不在这里哈!
2,下面来说下跨浏览器的办法,办法有很多,我这里只说一种最简单的,也是大家最容易操作的方法:
pdf.js为了安全性的考虑,它是不自带跨服务器访问的,但是它也没有说不能对吧。
(我在这里啰嗦一下,这个对我们做项目也是一个启发:既然他不能跨出我们的项目文件夹进行访问,那么我们何不把下载的这俩个文件夹直接扔到我们远程上去用端口的形式进行访问文件夹呢?下面直接上操作步奏)
跨浏览器访问
我们在远程的服务器上新建一个网站,把我们下载好的俩个文件夹在它扔上去(记得清空viewer.js里面的value的默认值)
pdf.js跨服务器访问文件夹
然后生成网站给发布到远程的iis里面
pdf.js跨服务器访问文件夹
pdf.js跨服务器访问文件夹
不要点图二中的预览,点了也看不到
这个时候我们打开网站用端口的形式看能不能打开我们的样式
pdf.js跨服务器访问文件夹
不错很成功。
我们在我们的远程网站中建立一个文件夹用来测试用
pdf.js跨服务器访问文件夹
这个时候我们回到我们本地的demo中去
修改我们的src地址
pdf.js跨服务器访问文件夹
千万别激动(快激动死了,哈哈)
小伙伴们,让我们运行起来吧
pdf.js跨服务器访问文件夹
这不是幻觉,这是真的,好了完美收工,下面说一下我用的浏览器,以及你们可能出现的问题
1,360浏览器8.1版本
2,在你们项目中会出现的问题有,地址正确的,但是pdf文件打不开
出现这个问题原因应该是中文乱码造成的
什么是中文乱码,这里解释一下:我们的浏览器默认吧%号解析成转义字符(说到这里,有的小伙伴应该已经懂了),而我们的文件夹的命名会出现中文(这个属于一般字符),说到这里大家应该很明白了吧,老外很过分对吧,不让我们玩中文,哈哈,下里提供一种大牛的解决办法:
encodeURI()函数;明白的人已经知道,不明白的直接抄代码:
pdf.js跨服务器访问文件夹
大功告成,期待下次见面