Is it possible to use Live-server for PHP with autoreload on save?

Question

I tried to use the Live-Server extension on VS Code for PHP, but it only opened the "root" of the "served" project folder and showed the index.php as a downloadable file link.

Then I read about the Live-Server Web Extension and installed it, but it still did not work.
(Yes, I did enable the web extension inside Live-Server config settings in VS Code).

I've also tried to use the PHP Server extension, which does good job for serving the project, instead of using Apache in XAMPP, but I have not found a way to reload when saving.

Is there even a way to autoreload PHP on PHP Server?

Does the Live-Server Web Extension require something else other than the Live-Server installed in VS Code and enabling the web extension in Live-Server config settings?

I've seen that it works for some people in gifs/videos, but I didn't manage to work it out.

Answer 1

First of all, I want to tell you that Live Server which is available in visual code market place is the solution to your problem. It works mainly with the static webpage like HTML but also works with dynamic webpages like PHP, NodeJs and ASP.NET in a tricky way. In the following example I will guide you to install a live server which works with both webpages (static & dynamic).

1. Install PHP Server and Live Server from VS Code market place.
2. Create a PHP file, example index.php and place it in any sub-directory(say, demo) under /var/www/html/, like /var/www/html/demo/
3. Install the live server extension in the chrome browser and edit like this.
4. Now click on the "Go Live" button in the VS Code. 5.Now open the index.php file which is placed under /var/www/html/demo/ in VS Code and right click and select "PHP Server: Reload Server" then "PHP Server: Open file in browser".
5. In the Browser just open the IP address

http://localhost:3000/demo/index.php

you will see that it is working in a live server with a dynamic webpage like PHP. When you edit and save the index.php file with the running VS Code, it will automatically updated on that IP address.

Answer 2

I was having a similar issue and I think I have found a workaround. With php server and live server installed, go to the web extension for live server and check "I don't want a proxy setup". For the actual server address put in your php server address (for me the default was http://localhost:3000/) and for live server address type in http://127.0.0.1:5500 if you kept the live server default address and port. In my settings.json I had "liveServer.settings.useWebExt" set to true, but setting it to false didn't make a difference for me for some reason.

I couldn't figure out how to get it to open the php server address rather than the live server address when pressing "go live". It still brings up the directory structure and I think the issue lies with live server not being in the working directory of the php server, if that makes sense. However, if you go to the php server address (localhost:3000/) the php pages worked for me and pressing ctrl+s to save updated the page correctly.

I hope this helps!

Answer 3

For having auto reload in PHP files in Visual Studio Code:

1. Install Live Server extension.
2. Install PHP Server extension.
3. Config PHP Server: (PHP Config Path), (PHP Path).
4. Install Google Chrome Live Server extensions.
5. Open your PHP file in Visual Studio Code and 'Click to run Lie Server'.
6. Copy the opened page address and past it in "Live Server Address" in live server chrome extension and click Apply.
7. Switch again to Visual Studio Code and right click on your PHP file and click on "PHP Server: Reload server", it will open your PHP file in browser and just copy IP and port (for example: http://localhost:3000) and paste it on "Actual Server Address" in live server of Google Chrome extension and click apply.
8. Turn On live Reload in live server of chrome extension. Now whenever you run your PHP file with "PHP Server: Reload server", it will reload automatically on each saving.

Note: For having good experience of automatically reload active Autosave and set 400ms for its delay.

Answer 4

put this meta tag to your code that work for me <meta http-equiv="refresh" content="10">