Custom Captive Portal Page



  • Hi everyone,

    I have created a custom Captive Portal page and it seems to be working fine with 1 small glitch...

    My scenario.... I have all of the users when connecting to the wireless internet to authenticate at the initial entry point which is the WAP / Association point and its with a common password only no username. This has been working excellent for quite a long time.

    Hence I introduce pFSense to the equation.... I have enabled the Captive Portal functionality as I want each person to be presented with a Splash page where by they have to read, or at least Click Continue indicating they have at least seen and agree to the End User Acceptance Policy. I am not using any authentication at this point as its already been done and at this point they are just acknowledging the Policy which was displayed to them.

    Here lies the irritating issue....

    I upload the custom Captive Portal page in to pFSense, in the appropriate Captive Portal setup area, Services / Captive Portal / My Zone Name / Configuration. The page is displayed when users try to access the internet, no problem at all, and they do have to click continue to acknowledge the End User Acceptance Policy. The issue is I have 3 images on the Custom Captive Portal page, 2 header Logo Images, and then also a washed out watermark back ground image file. None of the 3 images will display on the page at all, but everything else on the page layout / text wise is there.

    In testing, In the Captive Portal setup area, under HTML Page Contents there is another section called "Current Portal Page" with 3 selection options buttons 1-"Live View", 2-"View Page Contents", and 3-Download. When I use option 1 or 2 to see what the page looks like from within pFSense, same result as the end users see. The 3rd option "Download", downloads the page, and then it opens automatically in the local browser perfectly with the images displayed.

    So my question is, in pFSense, how can I get the images to load properly on the Captive Portal page for the end users? I have tried Services / Captive Portal / My Zone Name / File Manager and uploaded them there thinking pFSense needed them to be there, no help at all. I am missing something that pFSense is looking for. Downloading the page from within pFSense works, just not the live version. Just doesn't make sense.

    Any suggestions would be greatly appreciated.


  • Rebel Alliance

    This post is deleted!

  • Rebel Alliance

    @wd_doug said in Custom Captive Portal Page:

    I have tried Services / Captive Portal / My Zone Name / File Manager and uploaded them there thinking pFSense needed them to be there, no help at all.

    In your captive portal HTML file, what's the location you are giving of your images? I mean, what's the src in your <img src="....."/> ?
    Did you put the right captive portal IP (or hostname)?

    The files need to be in the file manager, but you also need to update the source of your files in your HTML custom page

    Also, did you tried to debug using the chrome devlopper tools?



  • Hi free4

    what's the src in your <img src="....."/>

    It shows
    <img src="home/folder-name/Desktop/a/header-logo.jpg"

    This file opens up normally when I click the download button in the setup......

    Did you put the right captive portal IP (or hostname)?
    No answer for this one. There's no IP address or Hostname listed in the src path to image in my html file. If it is suppose to have a path to the file manager there, I don't know what it would be, or the format it should be in.
    Again, in the section called "Current Portal Page" with 3 selection options buttons 1-"Live View", 2-"View Page Contents", and 3-Download. option 3 downloads it and displays it correctly.

    I know how to get to the file manager in pFSense,I am unsure of how to document the path to the file manager in order to place it in my html source file. That's what I was thinking along the lines of, just have not been able to come up with how to do that.



  • @free4

    So I went back and had another look at it, and have found the correct path to the file..

    <img src="captiveportal-filename.jpg>

    Now that works just fine.

    Now I move on to the next issue with the page and that is that the fonts in the frame show as White, on a washed out white logo image. Very hard to read. The fonts should be black...
    Just another small issue to get the bug worked out of.

    Thanks for the reference to the file manager source file path as that once I discovered it was in the root of the captive portal helped a lot and corrected that issue.

    D


Log in to reply