How to load an external HTML file in an iOS app
Published: 2021-03-18 19:43:53

---
title: How to load an external HTML file in an iOS app
published: true
description: 
tags: 
cover_image: https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t9b4qufgpik9wubu7nlp.png
canonical_url: https://www.daily.co/blog/how-to-load-an-external-html-file-in-an-ios-app/ 
---

> Daily Keyframes are byte-sized tips from our engineers. We hope they help you remove roadblocks so you can focus on building. 

When Apple announced, in iOS 14.3, that WKWebView would have support for `navigator.mediaDevices.getUserMedia`, we were ecstatic. It meant that iOS applications which relied on a webview could now use audio and video devices, a crucial element for an audio or video call. We were so excited, in fact, that we built [Party Line](https://www.daily.co/blog/how-to-load-an-external-html-file-in-an-ios-app/?utm_source=dev&utm_medium=post&utm_campaign=keyframe). 

However, in the course of development we quickly realized there was a known bug. `navigator.mediaDevices.getUserMedia` would only work if the HTML file in question was loaded via `http(s)` origins. If you were loading a local HTML file (using `file://`), `getUserMedia` would be denied. Luckily this has been [fixed](https://github.com/WebKit/WebKit/commit/ff60f0a9b3a455b56adb95dbab14d404cb024152?utm_source=dev&utm_medium=post&utm_campaign=keyframe), but those fixes can take time to land, and even longer for users to upgrade to the latest OS version. 

So what can be done to get around this today? 

The easiest thing to do is host your file somewhere that serves it via `https` (might as well keep it secure, while we’re at it). If you already have a server for your static assets, simply add it there and you’re good to go. If you don’t, and you want an easy solution, [Netlify](https://www.netlify.com/?utm_source=dev&utm_medium=post&utm_campaign=keyframe) is a great modern platform for static file deployments (among [other things](https://www.daily.co/blog/deploy-an-on-demand-video-meeting-platform-with-dailys-prebuilt-ui-and-netlify/?utm_source=dev&utm_medium=post&utm_campaign=keyframe)) and even has a drag and drop [feature](https://app.netlify.com/drop?utm_source=dev&utm_medium=post&utm_campaign=keyframep). For Party Line, our iOS HTML [file](https://github.com/daily-demos/party-line/blob/main/react/public/ios-bridge.html?utm_source=dev&utm_medium=post&utm_campaign=keyframe) is deployed alongside our React web app, which makes it publicly accessible at [`https://partyline.daily.co/ios-bridge.html`](https://partyline.daily.co/ios-bridge.html?utm_source=dev&utm_medium=post&utm_campaign=keyframe). 

To use it in our iOS app, we reference it in [`Client.swift`](https://github.com/daily-demos/party-line/blob/main/ios/Party%20Line/API/Client.swift?utm_source=dev&utm_medium=post&utm_campaign=keyframe#L173) with the following code: 

```javascript
private static var pageURL: URL {
    URL(string: "https://partyline.daily.co/ios-bridge.html")!
}
```

And then load it in [`Client.swift`](https://github.com/daily-demos/party-line/blob/e44761afade3b10b0771dd72898edfc35ccbbd56/ios/Party%20Line/API/Client.swift?utm_source=dev&utm_medium=post&utm_campaign=keyframe#L299-L303) with the following code:

```javascript
let pageURL = Self.pageURL
self.webView.load(URLRequest(url: pageURL))
```
And that’s it! 

If you want to read more about this, check out our [html file](https://github.com/daily-demos/party-line/blob/main/react/public/ios-bridge.html?utm_source=dev&utm_medium=post&utm_campaign=keyframe), and these related tickets: 

- [https://openradar.appspot.com/48813943](https://openradar.appspot.com/48813943) (rdar://48813943) 
- [https://bugs.webkit.org/show_bug.cgi?id=208667](https://bugs.webkit.org/show_bug.cgi?id=208667) 
- [https://bugs.webkit.org/show_bug.cgi?id=188360](https://bugs.webkit.org/show_bug.cgi?id=188360) 
- [https://bugs.chromium.org/p/chromium/issues/detail?id=752458](https://bugs.chromium.org/p/chromium/issues/detail?id=752458)

And if you’re curious about what we built, head over to the [repo](https://github.com/daily-demos/party-line?utm_source=dev&utm_medium=post&utm_campaign=keyframe) or read the [blog post](https://www.daily.co/blog/how-to-build-a-billion-dollar-audio-app-in-a-weekend/?utm_source=dev&utm_medium=post&utm_campaign=keyframe).