# How to open/render an HTML file on IOS ..

**URL:** <https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696>\
**Category:** web dev\
**Created:** [May 22, 2021, 5:12pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696 "2021-05-22T17:12:09Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![gNeandr](https://avatars.discourse-cdn.com/v4/letter/g/bcef8e/32.png) [@gNeandr](https://forum.kirupa.com/u/gNeandr)\
**Post date:** [May 22, 2021, 5:12pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/1 "2021-05-22T17:12:09Z")

</div>

After using Android phones for years, I switched to the Apple IOS iPhone … and surprise surprise … have to deal with the limited OS environment.  
Opening/rendering an HTML file (with CSS/JS/HTML) on Android (and on LX/Mint) was never a problem, but is on iPhone IOS 14.4.2.  
The HTML file is starting to render a few lines of the HTML code, but afais doesn’t start the JS code.  
Is There a remote dev tool available as knows with Firefox/Chrome, the Developer Tool kit?  
_Edit: Just remembered from a previous post this page: [How to debug problems on Mobile Safari - Chris Kenst](https://www.kenst.com/2019/03/how-to-debug-problems-on-mobile-safari/)_  
_Is this state-of-the-art … or are there other newer, better pages?_  
_Any help for this? Maybe special settings on the iPhone or special coding of the file required?_

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 23, 2021, 1:59am UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/2 "2021-05-23T01:59:25Z")

</div>

Are you developing on a Windows machine? If on macOS, Safari provides really good debugging capabilities that will attach to your running iPhone and web page. Does the web page you are trying to load work in Chrome on desktop?

---

<div class="post-metadata">

**Author:** ![gNeandr](https://avatars.discourse-cdn.com/v4/letter/g/bcef8e/32.png) [@gNeandr](https://forum.kirupa.com/u/gNeandr)\
**Post date:** [May 23, 2021, 5:34pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/3 "2021-05-23T17:34:46Z")

</div>

No M$ here, never.  
The dev base is LX/Mint, but also having access to macOS.  
The HTML file is running well on LX/Mint and Android, normally using FX, but also tested with Chrome and Brave … all are rendering the file without problems.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 23, 2021, 7:28pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/4 "2021-05-23T19:28:47Z")

</div>

Can you post the file on a public endpoint so that I can take a look?

---

<div class="post-metadata">

**Author:** ![gNeandr](https://avatars.discourse-cdn.com/v4/letter/g/bcef8e/32.png) [@gNeandr](https://forum.kirupa.com/u/gNeandr)\
**Post date:** [May 24, 2021, 2:25pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/5 "2021-05-24T14:25:03Z")

</div>

Basically no problem to send the file … or a truncated part of it.  
_It seems the real problem is how to open that plain HTML file on iPhone/IOS._  
I followed [How to debug problems on Mobile Safari - Chris Kenst](https://www.kenst.com/2019/03/how-to-debug-problems-on-mobile-safari/) and can debug another little program (written with py/bottle etc) which is stored on a RPI and called in the local net with an url like 192.168…x.  
Now my idea was to pack the code into one HTML/JS/CSS file and have that stored on the IOS/iPhone and run it directly on the device (as I can do it on an Android!).  
I’m missing how to store that file on the IOS/iPone/iPad so it can be run with Safari (or FX or Chrome or Brave). Storing it as an IOS file I can only “open/preview” that file and afaiu only the HTML elements are rendered but the required JS code isn’t started at all. Without that this approach would be useless.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 25, 2021, 1:23am UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/6 "2021-05-25T01:23:50Z")

</div>

Gotcha! That won’t be possible from what I can tell. What you could do is create a dedicated WebView app for the sole purpose of loading HTML from the app’s own resources. That isn’t elegant, but it is a workaround 🙂

---

<div class="post-metadata">

**Author:** ![gNeandr](https://avatars.discourse-cdn.com/v4/letter/g/bcef8e/32.png) [@gNeandr](https://forum.kirupa.com/u/gNeandr)\
**Post date:** [May 25, 2021, 3:02pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/7 "2021-05-25T15:02:48Z")

</div>

Thanks for your comment.  
So if WebView seems to be the way, I read your article “Understanding WebViews” and tried to follow the “Web FUNdamentals”  
[Web FUNdamentals](https://www.kirupa.com/web/) to find a good route to WebViews.  
The only I found near to it are the following pages, but with them … not more than 404 pages:

> ```
> What are Progressive Web Apps (PWA)?
> https://www.kirupa.com/web/pwa_101.htm
> Build a PWA in Just 10 Minutes
> https://www.kirupa.com/web/build_a_pwa.htm
> 
> ```

Can you provide alternative references to further development tools or sites?

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [May 25, 2021, 5:41pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/8 "2021-05-25T17:41:38Z")

</div>

I fixed those links! Thanks for pointing that out.

I don’t cover how to create webviews for the various native apps. What I do have that may help is a sample iOS xCode project I created a few years ago to load content into a webview: [kirupa/webview-ios-test at master · kirupa/kirupa · GitHub](https://github.com/kirupa/kirupa/tree/master/webview-ios-test)

---

<div class="post-metadata">

**Author:** ![gNeandr](https://avatars.discourse-cdn.com/v4/letter/g/bcef8e/32.png) [@gNeandr](https://forum.kirupa.com/u/gNeandr)\
**Post date:** [May 25, 2021, 9:39pm UTC](https://forum.kirupa.com/t/how-to-open-render-an-html-file-on-ios/647696/9 "2021-05-25T21:39:15Z")

</div>

Thanks for the webview-ios link.  
The other link to “build\_a\_pwa.htm” isn’t repaired … afais
