Skip to content

Instantly share code, notes, and snippets.

@manidip
Forked from nguyenanhtu/SSLXampp.md
Created March 8, 2021 08:35
Show Gist options
  • Save manidip/3bc319462cd676805f199b2d189e94e3 to your computer and use it in GitHub Desktop.
Save manidip/3bc319462cd676805f199b2d189e94e3 to your computer and use it in GitHub Desktop.

Revisions

  1. @nguyenanhtu nguyenanhtu revised this gist Nov 22, 2016. 1 changed file with 79 additions and 109 deletions.
    188 changes: 79 additions & 109 deletions SSLXampp.md
    Original file line number Diff line number Diff line change
    @@ -1,119 +1,89 @@
    ### How to test 'https' in XAMPP for localhost ? I will guide you
    # How to test 'https' in XAMPP for localhost ? I will guide you

    *Step 1 : Go to your XAMPP installation directory (in my case it’s E:\xampp), figure out apache folder
    ## Menu
    - Create certificate
    - Config Apache to access `https` instead of `http`
    - Config mod rewrite to generate SSL url
    - Config Virtual host to test site

    ![Step 1 image](http://i.imgur.com/8LPqS2c.png)

    *Step 2 : In this folder, run this batch file named “makecert.bat” :

    ![Step 2 image](http://i.imgur.com/68AlpM0.png)

    *Step 3 : A CMD window will appear like that, this is where you setup your certificate to verify your websit. All you need is only typing all information that ‘s very easy, except one information “Common Name”, at this you must be typed exactly your URL website. For example in localhost, I will use a Virtual host URL (I will configure it later)

    ![Step 3.1 image](http://i.imgur.com/cxF7jv1.png)

    ![Step 3.2 image](http://i.imgur.com/1p3Btkb.png)

    *Step 4 : Now this is time for you to config Apache to access folders with “https” instead of “http”. First, we will force ssl when access folders by add this directive `SSLRequireSSL` in this config file (`e:\xampp\apache\conf\extra\httpd-xampp.conf`)

    ![Step 4 image](http://i.imgur.com/8qrZfkt.png)

    Open this and add line that I talked above in all list folders below :
    - e:\xampp\phpmyadmin
    - e:\xampp\htdocs\xampp
    - e:\xampp\webalizer
    - e:\xampp\security\htdocs
    ## Step 1 : Create certificate
    - Go to your XAMPP installation directory (in my case it’s E:\xampp), figure out apache folder. In this, find & run batch file
    named `makecert.bat`

    Another config file that also need directive `SSLRequireSSL` located in e:\xampp\webdav.

    *Step 5: This next optional step is to redirect “http” requests to “https” requests for the pages we want to secure. This is more user friendly and allows you to still use http when you type in the address (and automatically switch to https:// and encryption). If you don’t do this, and you used SSLRequireSSL, you will only be able to access these pages by typing https://. This is fine and probably a little bit more secure, but is not so user friendly. To accomplish the redirection, we will use mod_rewrite so that we don’t have to use the server name in this part of the config file. This helps keep small the number of places in the config files where the server name is written (making your config files more maintainable).

    First, we need to make sure that mod_rewrite is enabled. To do this, edit `E:\xampp\apache\conf\httpd.conf` and get rid of the comment (# character) in this line

    ```#LoadModule rewrite_module modules/mod_rewrite.so```

    Make it look like this :

    ```LoadModule rewrite_module modules/mod_rewrite.so```

    ![Step 5 image](http://i.imgur.com/Bt6vRLx.png)

    Now paste all this text to the config file at address E:\xampp\apache\conf\extra\httpd-xampp.conf (That is rewrite URL):

    ```
    <IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} xampp
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /phpMyAdmin folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} phpmyadmin
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /security folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} security
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /webalizer folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} webalizer
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    </IfModule>
    ```

    Don’t forget to put also your project directory rewrite URL, if not, you can’t access your project through SSL , summarize this is total config you must put in :

    ```
    <IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} xampp
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /phpMyAdmin folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} phpmyadmin
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /security folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} security
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /webalizer folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} webalizer
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /folder_name folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} folder_name
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    </IfModule>
    ```

    *Step 6 : It’s time to config a virtual host to make a better URL to access our project. So, let’s go to file at address : E\xampp\apache\conf\extra\httpd-vhosts.conf

    ![Step 6 image](http://i.imgur.com/Mj0iBRe.png)

    ![Step 1 image](http://i.imgur.com/68AlpM0.png)

    - A CMD window will appear like that, this is where you setup your certificate to verify your website. All you need is only typing all information that ‘s very easy, except one information “Common Name”, at this you must be typed exactly your URL website. For example in localhost, I will use a Virtual host URL (I will configure it later)

    ![Step 1.2 image](http://i.imgur.com/1p3Btkb.png)

    ## Step 2 : Config Apache to access `https` instead of `http`
    - Now this is time for you to config Apache to access folders with “https” instead of “http”. First, we will force ssl when access folders by add this directive “SSLRequireSSL” in this config file (`e:\xampp\apache\conf\extra\httpd-xampp.conf`)

    ![Step 4 image](http://i.imgur.com/8qrZfkt.png)

    - Open this and add line that I talked above in all list folders below :
    - e:\xampp\phpmyadmin
    - e:\xampp\htdocs\xampp
    - e:\xampp\webalizer
    - e:\xampp\security\htdocs
    - Another config file that also need directive `SSLRequireSSL` located in e:\xampp\webdav.

    ## Step 3: Config mod_rewrite to generate SSL url

    - This next optional step is to redirect “http” requests to “https” requests for the pages we want to secure. This is more user friendly and allows you to still use http when you type in the address (and automatically switch to https:// and encryption). If you don’t do this, and you used SSLRequireSSL, you will only be able to access these pages by typing https://. This is fine and probably a little bit more secure, but is not so user friendly. To accomplish the redirection, we will use mod_rewrite so that we don’t have to use the server name in this part of the config file. This helps keep small the number of places in the config files where the server name is written (making your config files more maintainable).

    - First, we need to make sure that mod_rewrite is enabled. To do this, edit `E:\xampp\apache\conf\httpd.conf` and get rid of the comment (# character) in this line :
    ```#LoadModule rewrite_module modules/mod_rewrite.so```
    Make it look like this :
    ```LoadModule rewrite_module modules/mod_rewrite.so```

    ![Step 5 image](http://i.imgur.com/Bt6vRLx.png)

    - Now paste all this text to the config file at address `E:\xampp\apache\conf\extra\httpd-xampp.conf`(That is rewrite URL, if not, you can't access your site via SSL):

    ```
    <IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} xampp
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /phpMyAdmin folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} phpmyadmin
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /security folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} security
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /webalizer folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} webalizer
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /folder_name folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} folder_name
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    </IfModule>
    ```
    ## Step 4 : Config Virtual host to test site
    It’s time to config a virtual host to make a better URL to access our project. So, let’s go to file at address : `E\xampp\apache\conf\extra\httpd-vhosts.conf`
    Create new virtual config as following sample :
    - VirtualHost *:443 : This is port to run SSL
    - VirtualHost *:443 : This is port to run SSL
    - DocumentRoot : Point to your project folder
    - SSLEngine on : Turn on SSL
    - SSLCertificateFile : Just copy, don’t modified it because in step create certificate, XAMPP will auto put your certificate in appropriate folder.
    - SSLCertificateKeyFile : Same as SSLCertificateFile.

    After all, if you configure everything correctly, it will show you result like this :
    ![Last image](http://i.imgur.com/kMIE4T2.png)
    After all, if you configure everything correctly, it will show you result like this :
    ![Last image](http://i.imgur.com/kMIE4T2.png)


  2. @nguyenanhtu nguyenanhtu revised this gist Nov 22, 2016. 1 changed file with 5 additions and 3 deletions.
    8 changes: 5 additions & 3 deletions SSLXampp.md
    Original file line number Diff line number Diff line change
    @@ -36,11 +36,12 @@ Make it look like this :

    ```LoadModule rewrite_module modules/mod_rewrite.so```

    ![Step 5 image](http://imgur.com/a/qb4Ii)
    ![Step 5 image](http://i.imgur.com/Bt6vRLx.png)

    Now paste all this text to the config file at address E:\xampp\apache\conf\extra\httpd-xampp.conf (That is rewrite URL):

    ```<IfModule mod_rewrite.c>
    ```
    <IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
    @@ -67,7 +68,8 @@ Now paste all this text to the config file at address E:\xampp\apache\conf\extr

    Don’t forget to put also your project directory rewrite URL, if not, you can’t access your project through SSL , summarize this is total config you must put in :

    ```<IfModule mod_rewrite.c>
    ```
    <IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
  3. @nguyenanhtu nguyenanhtu revised this gist Nov 22, 2016. 1 changed file with 9 additions and 7 deletions.
    16 changes: 9 additions & 7 deletions SSLXampp.md
    Original file line number Diff line number Diff line change
    @@ -2,20 +2,22 @@

    *Step 1 : Go to your XAMPP installation directory (in my case it’s E:\xampp), figure out apache folder

    ![Step 1 image](http://i.imgur.com/a/BQF19)
    ![Step 1 image](http://i.imgur.com/8LPqS2c.png)

    *Step 2 : In this folder, run this batch file named “makecert.bat” :

    ![Step 2 image](http://i.imgur.com/a/pqnXu)
    ![Step 2 image](http://i.imgur.com/68AlpM0.png)

    *Step 3 : A CMD window will appear like that, this is where you setup your certificate to verify your websit. All you need is only typing all information that ‘s very easy, except one information “Common Name”, at this you must be typed exactly your URL website. For example in localhost, I will use a Virtual host URL (I will configure it later)

    ![Step 3.1 image](http://i.imgur.com/a/0JMZb)
    ![Step 3.1 image](http://i.imgur.com/cxF7jv1.png)

    ![Step 3.2 image](http://i.imgur.com/a/kSihH)
    ![Step 3.2 image](http://i.imgur.com/1p3Btkb.png)

    *Step 4 : Now this is time for you to config Apache to access folders with “https” instead of “http”. First, we will force ssl when access folders by add this directive `SSLRequireSSL` in this config file (`e:\xampp\apache\conf\extra\httpd-xampp.conf`)
    ![Step 4 image](http://i.imgur.com/a/kEOtm)

    ![Step 4 image](http://i.imgur.com/8qrZfkt.png)

    Open this and add line that I talked above in all list folders below :
    - e:\xampp\phpmyadmin
    - e:\xampp\htdocs\xampp
    @@ -98,7 +100,7 @@ Don’t forget to put also your project directory rewrite URL, if not, you can

    *Step 6 : It’s time to config a virtual host to make a better URL to access our project. So, let’s go to file at address : E\xampp\apache\conf\extra\httpd-vhosts.conf

    ![Step 6 image](http://i.imgur.com/a/Mvgo9)
    ![Step 6 image](http://i.imgur.com/Mj0iBRe.png)

    Create new virtual config as following sample :
    - VirtualHost *:443 : This is port to run SSL
    @@ -109,7 +111,7 @@ Create new virtual config as following sample :

    After all, if you configure everything correctly, it will show you result like this :

    ![Last image](http://i.imgur.com/a/VMgff)
    ![Last image](http://i.imgur.com/kMIE4T2.png)



  4. @nguyenanhtu nguyenanhtu revised this gist Nov 22, 2016. 1 changed file with 7 additions and 7 deletions.
    14 changes: 7 additions & 7 deletions SSLXampp.md
    Original file line number Diff line number Diff line change
    @@ -2,20 +2,20 @@

    *Step 1 : Go to your XAMPP installation directory (in my case it’s E:\xampp), figure out apache folder

    ![Step 1 image](http://imgur.com/a/BQF19)
    ![Step 1 image](http://i.imgur.com/a/BQF19)

    *Step 2 : In this folder, run this batch file named “makecert.bat” :

    ![Step 2 image](http://imgur.com/a/pqnXu)
    ![Step 2 image](http://i.imgur.com/a/pqnXu)

    *Step 3 : A CMD window will appear like that, this is where you setup your certificate to verify your websit. All you need is only typing all information that ‘s very easy, except one information “Common Name”, at this you must be typed exactly your URL website. For example in localhost, I will use a Virtual host URL (I will configure it later)

    ![Step 3.1 image](http://imgur.com/a/0JMZb)
    ![Step 3.1 image](http://i.imgur.com/a/0JMZb)

    ![Step 3.2 image](http://imgur.com/a/kSihH)
    ![Step 3.2 image](http://i.imgur.com/a/kSihH)

    *Step 4 : Now this is time for you to config Apache to access folders with “https” instead of “http”. First, we will force ssl when access folders by add this directive `SSLRequireSSL` in this config file (`e:\xampp\apache\conf\extra\httpd-xampp.conf`)
    ![Step 4 image](http://imgur.com/a/kEOtm)
    ![Step 4 image](http://i.imgur.com/a/kEOtm)
    Open this and add line that I talked above in all list folders below :
    - e:\xampp\phpmyadmin
    - e:\xampp\htdocs\xampp
    @@ -98,7 +98,7 @@ Don’t forget to put also your project directory rewrite URL, if not, you can

    *Step 6 : It’s time to config a virtual host to make a better URL to access our project. So, let’s go to file at address : E\xampp\apache\conf\extra\httpd-vhosts.conf

    ![Step 6 image](http://imgur.com/a/Mvgo9)
    ![Step 6 image](http://i.imgur.com/a/Mvgo9)

    Create new virtual config as following sample :
    - VirtualHost *:443 : This is port to run SSL
    @@ -109,7 +109,7 @@ Create new virtual config as following sample :

    After all, if you configure everything correctly, it will show you result like this :

    ![Last image](http://imgur.com/a/VMgff)
    ![Last image](http://i.imgur.com/a/VMgff)



  5. @nguyenanhtu nguyenanhtu revised this gist Nov 22, 2016. No changes.
  6. @nguyenanhtu nguyenanhtu created this gist Nov 22, 2016.
    115 changes: 115 additions & 0 deletions SSLXampp.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,115 @@
    ### How to test 'https' in XAMPP for localhost ? I will guide you

    *Step 1 : Go to your XAMPP installation directory (in my case it’s E:\xampp), figure out apache folder

    ![Step 1 image](http://imgur.com/a/BQF19)

    *Step 2 : In this folder, run this batch file named “makecert.bat” :

    ![Step 2 image](http://imgur.com/a/pqnXu)

    *Step 3 : A CMD window will appear like that, this is where you setup your certificate to verify your websit. All you need is only typing all information that ‘s very easy, except one information “Common Name”, at this you must be typed exactly your URL website. For example in localhost, I will use a Virtual host URL (I will configure it later)

    ![Step 3.1 image](http://imgur.com/a/0JMZb)

    ![Step 3.2 image](http://imgur.com/a/kSihH)

    *Step 4 : Now this is time for you to config Apache to access folders with “https” instead of “http”. First, we will force ssl when access folders by add this directive `SSLRequireSSL` in this config file (`e:\xampp\apache\conf\extra\httpd-xampp.conf`)
    ![Step 4 image](http://imgur.com/a/kEOtm)
    Open this and add line that I talked above in all list folders below :
    - e:\xampp\phpmyadmin
    - e:\xampp\htdocs\xampp
    - e:\xampp\webalizer
    - e:\xampp\security\htdocs

    Another config file that also need directive `SSLRequireSSL` located in e:\xampp\webdav.

    *Step 5: This next optional step is to redirect “http” requests to “https” requests for the pages we want to secure. This is more user friendly and allows you to still use http when you type in the address (and automatically switch to https:// and encryption). If you don’t do this, and you used SSLRequireSSL, you will only be able to access these pages by typing https://. This is fine and probably a little bit more secure, but is not so user friendly. To accomplish the redirection, we will use mod_rewrite so that we don’t have to use the server name in this part of the config file. This helps keep small the number of places in the config files where the server name is written (making your config files more maintainable).

    First, we need to make sure that mod_rewrite is enabled. To do this, edit `E:\xampp\apache\conf\httpd.conf` and get rid of the comment (# character) in this line

    ```#LoadModule rewrite_module modules/mod_rewrite.so```

    Make it look like this :

    ```LoadModule rewrite_module modules/mod_rewrite.so```

    ![Step 5 image](http://imgur.com/a/qb4Ii)

    Now paste all this text to the config file at address E:\xampp\apache\conf\extra\httpd-xampp.conf (That is rewrite URL):

    ```<IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} xampp
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /phpMyAdmin folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} phpmyadmin
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /security folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} security
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /webalizer folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} webalizer
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    </IfModule>
    ```

    Don’t forget to put also your project directory rewrite URL, if not, you can’t access your project through SSL , summarize this is total config you must put in :

    ```<IfModule mod_rewrite.c>
    RewriteEngine On
    # Redirect /xampp folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} xampp
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /phpMyAdmin folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} phpmyadmin
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /security folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} security
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /webalizer folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} webalizer
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    # Redirect /folder_name folder to https
    RewriteCond %{HTTPS} !=on
    RewriteCond %{REQUEST_URI} folder_name
    RewriteRule ^(.*) https://%{SERVER_NAME}$1 [R,L]
    </IfModule>
    ```

    *Step 6 : It’s time to config a virtual host to make a better URL to access our project. So, let’s go to file at address : E\xampp\apache\conf\extra\httpd-vhosts.conf

    ![Step 6 image](http://imgur.com/a/Mvgo9)

    Create new virtual config as following sample :
    - VirtualHost *:443 : This is port to run SSL
    - DocumentRoot : Point to your project folder
    - SSLEngine on : Turn on SSL
    - SSLCertificateFile : Just copy, don’t modified it because in step create certificate, XAMPP will auto put your certificate in appropriate folder.
    - SSLCertificateKeyFile : Same as SSLCertificateFile.

    After all, if you configure everything correctly, it will show you result like this :

    ![Last image](http://imgur.com/a/VMgff)