Question

我想使用Pannellum（https://pannellum.org/download/）html，css和js文件显示全景图像。我以某种方式取得了成功，但未显示本地全景图像，显示“无法访问文件”。为了使其完全脱机，它还应该加载本地图像，我如何使用本地图像URL使其从iphone加载图像？

我实际上必须以js字符串形式传递一个URL，该URL被添加到WKUserContentController中，然后使用它来配置WKWebView。我试图用swift的URL类以及NSURL类创建url，但是没有用。还尝试传递base64图像，以防万一它起作用。

func addCustomScript（string：String）{ let脚本= WKUserScript（源：字符串，injectionTime：.atDocumentEnd，forMainFrameOnly：true） self.addUserScript（脚本） }

覆盖func loadView（）{ super.loadView（）

    let webConfiguration = WKWebViewConfiguration()
    let contentController = WKUserContentController()

    contentController.addCssFromFile(name: "pannellum")
    contentController.addJavascriptFromFile(name: "pannellum")

    //Panoramic Image
    let imagePath = Bundle.main.path(forResource: "panorama", ofType: "jpg")!
    let imgNSUrl = NSURL(fileURLWithPath: imagePath)
    let imageURL = URL(fileURLWithPath: imagePath)

    print("imagePath : \(imagePath)") //output : /var/containers/Bundle/Application/94C69C64-FC83-45AF-B1BE-0D1B2BDA4306/EasyOne360.app/panorama.jpg
    print("imageURL : \(imageURL)") //output : file:///var/containers/Bundle/Application/94C69C64-FC83-45AF-B1BE-0D1B2BDA4306/EasyOne360.app/panorama.jpg

    //Add pannellum viewer
    let scriptSourcePano = "pannellum.viewer('panorama', { \"type\": \"equirectangular\", \"panorama\": \"\(imgNSUrl)\", \"autoLoad\": true });"
    contentController.addCustomScript(string: scriptSourcePano)

    //Dimensions of box
    let scriptSource = "var pano = document.getElementById('panorama'); if (pano) {pano.style.width = '360px'; pano.style.height = '600px'; }"
    contentController.addCustomScript(string: scriptSource)

    webConfiguration.userContentController = contentController

    webView = WKWebView(frame: .zero, configuration: webConfiguration)
    webView.uiDelegate = self
    view = webView

}

我希望它像这样加载（以这个网址-https://pannellum.org/images/cerro-toco-0.jpg为例）

如何使用HTML img标签或javascript在WKWebview中显示来自iPhone（带有路径URL）的本地图像？

0 个答案: