Перейти к содержимому

How to Run a Local Web Server on iPhone and iPad

The built-in server reads .htaccess.

Not a token version of it either. RewriteEngine, RewriteCond, RewriteRule with the flags, RewriteBase, DirectoryIndex, ErrorDocument, Header, Expires, the lot. Drop a Laravel or WordPress style rewrite file in and it behaves.

Most people never find this out, so it seems like the place to start.

What it parses

Directives it acts on:

RewriteEngine, RewriteBase, RewriteCond, RewriteRule, Redirect, RedirectMatch, RedirectPermanent, RedirectTemp, DirectoryIndex, ErrorDocument, Header, ExpiresActive, ExpiresByType, ExpiresDefault, AddType, AddDefaultCharset, SetEnv, UnsetEnv, Require, Allow, Deny.

Plus the block forms: <Files>, <FilesMatch>, <IfModule>, <IfDefine>.

The flags it acts on are L, END, R, NC, QSA, QSD, F, G, and S, plus OR on a RewriteCond. Long forms work too, so [NOCASE,LAST] is read the same as [NC,L].

Others parse without erroring but do nothing, PT and NE among them. In a local dev server neither has much to do anyway.

So the front controller pattern works unchanged:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ index.php [L]

IfModule blocks

This one catches people, so it is worth knowing the rule.

An <IfModule> block only runs if DevBox emulates that module. The list is mod_rewrite, mod_alias, mod_headers, mod_expires, mod_mime, mod_dir, mod_env, mod_authz_core, mod_authz_host, mod_access_compat, core, and anything starting mod_php.

Wrap rules in <IfModule mod_deflate.c> and they get skipped, because compression is not emulated. Apache would do the same thing if the module were missing, so the behaviour is right. It just means a config copied from a host with more modules may quietly drop a block.

Default DirectoryIndex is index.php, then index.html, then index.htm.

Two ways to serve

The built-in server runs at http://127.0.0.1 the whole time a project is open. Static files and PHP. Nothing to start.

Or you launch your own process. Express, Flask, anything that binds a port. That is the route for Node and Python.

Both are steered from devbox.json at the top of the project.

devbox.json

{
  "httpRoot": "public",
  "main": "node server.js",
  "browserURL": "http://127.0.0.1:8080",
  "splitViewType": 1
}

httpRoot moves the document root to a subfolder. Set it to public and your vendor and config directories sit above the web root, unreachable over HTTP, exactly as on a real host.

main is what the run button executes. Set it and run launches your server instead of running files one at a time.

browserURL is where the preview opens. splitViewType is iPad only and picks what sits beside the editor.

The file is read at project load. Edit it, then close and reopen the project.

Ports

iPhone and iPad use port 80, so a bare http://127.0.0.1 reaches it.

Mac uses 81. DevBox runs there as a Designed for iPad app, and port 80 on a desktop is usually taken already. So http://127.0.0.1:81.

Three built-in URLs

The server hosts a few tools of its own, and knowing the paths saves hunting through menus.

/.admin/ is phpMyAdmin. /.lite/ is phpLiteAdmin, which also opens by tapping any .sqlite or .db file. /.eruda/ is the developer console.

The console

Mobile browsers hide the JavaScript console. So a script fails on a phone and you cannot see why, which is how people end up debugging with alert() and giving up on device testing.

DevBox puts it back. Pull the console up over any page in the built-in browser and you get log output, a network panel, the DOM tree, and storage.

Not the full Safari inspector. But it answers the two questions that cover most debugging: what did my script print, and which request failed.

Previewing

The browser is WebKit. Same engine as Safari, so you are seeing the real thing, not an approximation with a narrow window.

On iPad, editor one side and browser the other. Edit, save, refresh, look. On a phone the browser takes the screen and you swap.

Reaching it from your laptop

Turn on external network access in Settings. Grant the local network permission when iOS asks.

Then open the device's Wi-Fi address from the other machine:

http://192.168.1.42

Yours will differ. Same network both ends.

The remote file manager goes the other way, letting you edit the phone's files from a browser on your laptop.

Keeping it awake

iOS suspends apps that leave the screen. Put the phone down mid test and requests stop arriving.

The screen saver setting holds the display on so that does not happen. Switch it on at the start of a cross-device session.