3

I used this command to startup ngrok for a laravel site, namely testsite.local:

ngrok http -host-header=rewrite testsite.local:80

I have testsite.local defined in /etc/hosts to map to 127.0.0.1

This works, Ngrok starts up just fine and now serves the local site on some random *.ngrok.io address, which I can access. But all URLs within the laravel application (e.g. internal links, or urls for loading a css or js file) are absolute urls to my locally defined domain, like http://testsite.local/news, or http://testsite.local/css/styles.css. In other words, I can load the site fine, but anyone else just sees a bunch of unstyled html and gets a non functional site.

This has to be a general issue for anyone who uses ngrok and has absolute URLs within their project, but google didn't yield anything useful.

Two possible approaches come to my mind:

  1. rewrite all links in the application to be relative instead of absolute (oh god please no)
  2. any client that wants to access my site via the *.ngrok.io url has to map the 'testsite.local' domain within their very own /etc/hosts file to the ngrok.io url.

The approaches may work, but this seems so far stretched... isn't there anything else one can do?

SOLUTION

https://stackoverflow.com/a/54488972/718980

mwallisch
  • 1,751
  • 2
  • 21
  • 29
  • i dont think you should ever link absolute links to css etc. however i believe you could do something with .htaccess file to re-route the urls – Sari Yono Sep 02 '16 at 12:55
  • Hi, in the WordPress community we have the same problem as Wordpress often uses absolute URLs. The commonly adopted solution is to dynamically transform absolute URLs into relative URLs, by using WordPress internal hooks (es. https://github.com/optimizamx/odt-relative-urls). I am not sure how you would do the same if your app is not event-based... – coccoinomane Sep 11 '16 at 17:29
  • In the httpd.conf set your DocumentRoot and Directory to the path of your project. ` DocumentRoot "C:/xampp/htdocs/projectName" ` – Pratik Hyomba May 29 '17 at 11:47
  • Seem like no one who responded understood your issue. I have same issue. Did you get ngrok working with absolute urls? – Guerrilla May 20 '18 at 20:11
  • @Guerrilla no. Haven't touched it since. – mwallisch May 21 '18 at 07:28
  • 1
    @Guerrilla I answered this question here: https://stackoverflow.com/questions/50194923/laravel-and-ngrok-url-domain-is-not-correct-for-routes-and-assets – patricus Feb 04 '19 at 21:57

3 Answers3

1

You need to use Apache Module mod_substitute. First, enable module:

a2enmod substitute
service apache2 restart

Then, add the following to the .htaccess file:

AddOutputFilterByType SUBSTITUTE text/html
Substitute "s|<your-local-link>|<your-ngrok-link>|in"

More information: https://httpd.apache.org/docs/2.4/mod/mod_substitute.html

Serhii Posternak
  • 504
  • 2
  • 7
-1

In xammp/apache/conf/httd.conf

DocumentRoot "C:/xampp/htdocs/{your-project-path}"

Directory "C:/xampp/htdocs/{your-project-path}"

dil pila
  • 3
  • 2
  • 1
    Providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value... – Badacadabra May 29 '17 at 12:10
-1

In the httpd.conf set your DocumentRoot and Directory to the path of your project.

DocumentRoot "C:/xampp/htdocs/projectName" <Directory "C:/xampp/htdocs/projectName">

Pratik Hyomba
  • 330
  • 3
  • 14