iOS集成PDFJS及WKWebView加载本地资源问题

  1. iOS下加载PDF,不管是UIWebView还是WKWebView都可以轻松做到,再不行可以使用UIDocumentInteractionController;
  2. 安卓的webView无法直接预览PDF,安卓一般都是用PDFJS插件,前端页面也是用这个插件,我们公司有个APP所有详情都是PDF格式的,为了多端界面统一,我也采用PDFJS插件

一、引入PDFJS

直接去mozilla/pdfjs-dist下载,这里也有一份弄好的 👉传送门

解压后项目中引入时,必须保证目录结构不变(PDFJS内部有资源互相引用,不能打乱),所以一定要选择Create folder refrences

image.png

二、基于UIWebView使用PDFJS

可以看出,其实使用这个插件的方法就是拿到viewer .html,然后添加url参数file,值就是我们PDF文件的路径

/// 使用本地PDFJS加载PDF
- (void)openPDF:(NSString *)pdfPath {
    NSString *htmlPath = [[NSBundle mainBundle] pathForResource:@"viewer" ofType:@"html" inDirectory:@"minified/web"];
    NSString *urlStr = [NSString stringWithFormat:@"%@?file=%@#page=1",htmlPath,pdfPath];
    urlStr = [urlStr stringByAddingPercentEncodingWithAllowedCharacters:[NSCharacterSet URLQueryAllowedCharacterSet]];
    NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL URLWithString:urlStr]];
    [self.webView loadRequest:request];
}

三、基于WKWebView使用PDFJS

  1. 由于UIWebView太老了 (其实用起来很方便,操作简单,我也一直没有把WKWebView用起来),并且明年貌似使用UIWebView控件项目无法上架,所以....
  2. 把UIWebView替换成WKWebView发现加载不了PDF了,原因是WKWebView访问本地文件有一些权限问题
那应该如何加载PDFJS框架呢?

可以开启一个HTTP服务,通过http来加载相关资源,这里要启用一个库CocoaHttpServer,使用它来搭建一个本地的web服务(具体参考示例 )

导入相关库
image.png
示例代码
#import "ViewController.h"
#import "HTTPServer.h"
#import "DDLog.h"
#import "DDTTYLogger.h"
#import <WebKit/WebKit.h>

// Log levels: off, error, warn, info, verbose
static const int ddLogLevel = LOG_LEVEL_VERBOSE;

@interface ViewController ()
{
    HTTPServer *httpServer;
}

@property (strong, nonatomic) IBOutlet WKWebView *webView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    [self startServer];
    
    // 加载本地PDF
    NSString *pdfPath = [[NSBundle mainBundle] pathForResource:@"demo.pdf" ofType:nil];
    [self openPDF:pdfPath];
}


/// 使用本地PDFJS加载PDF
- (void)openPDF:(NSString *)pdfPath {
    NSString *urlStr = [NSString stringWithFormat:@"http://127.0.0.1/minified/web/viewer.html?file=/demo.pdf#page=1"];
    urlStr = [urlStr stringByAddingPercentEncodingWithAllowedCharacters:[NSCharacterSet URLQueryAllowedCharacterSet]];
    NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL URLWithString:urlStr]];
    [self.webView loadRequest:request];
}

- (void)startServer
{
    // 开启打印日志
    [DDLog addLogger:[DDTTYLogger sharedInstance]];
    
    httpServer = [[HTTPServer alloc] init];
    [httpServer setType:@"_http._tcp."];
    // 设置端口
    [httpServer setPort:80];
    // 设置web根路径
    NSString *webPath = [[NSBundle mainBundle] resourcePath];
    [httpServer setDocumentRoot:webPath];
    
    // 开启web服务
    NSError *error;
    if ([httpServer start:&error])
    {
        DDLogInfo(@"Started HTTP Server on port %hu", [httpServer listeningPort]);
    }else {
        DDLogError(@"Error starting HTTP Server: %@", error);
    }
}
@end