CODEWITHSUNDEEP
javascriptcssapacheploneip-address
raytheengineer
raytheengineer

Reputation: 109

Hide or show a div element based on IP address

Is it possible, using Apache, Javascript, or CSS (or something in Plone for that matter) to make a <div> visible to only a set range of IP addresses?

Below is the code I would like to be available to a certain range of IP addresses:

<div id="user">
    <ul>
        <li><a href="#" title="Login">Login</a></li>
    </ul>
</div>

Ideally, I would like this to only be visible from 3 sets of IP addresses. I have a separate site running the following restriction (IP addresses changed, of course) in Apache to control access, but to a whole site, rather than just a div.

Order allow,deny
   Allow from 000.0.00
   Allow from 000.0.01

      # Order deny,allow
      # Deny from all

The purpose of this would be to restrict a pop-up login (or login page) to anyone not accessing the site from within a certain location. Even if I could just hide the "user" div (which is the login button when not logged in) to anyone not accessing from the range of IP addresses, that would be fine. Any help would be greatly appreciated, thanks!

Upvotes: 2

Views: 8108

Answers (3)

Claudio Longhi
Claudio Longhi

Reputation: 1

*multiple class hiding*
<script type="application/javascript">
function getip(json){
  if(json.query == "87.1.1.5") {
    var elems = document.getElementsByClassName('price');
    for (i = 0; i < elems.length; i++) {
    elems[i].style.display = 'block';
     }
  }
}


<script type="application/javascript" src="http://ip-api.com/json/?callback=getip"></script>

Upvotes: 0

Ulrich Schwarz
Ulrich Schwarz

Reputation: 7727

You can use Products.AutoRole to assign a group automatically to visitors from certain IP ranges, and then adapt your Plone templates so that your div is conditional on that group. (And for your ultimate problem, we should probably file a feature request that "can log in" should be tied to a permission, which by default would be granted to anonymous.)

FWIW, at work, we also restrict /login|/login_form in the apache config.

Upvotes: 2

Al.G.
Al.G.

Reputation: 4387

You need some css:

#user {
   display: none;
}

And some js:

<script type="application/javascript">
    function getip(json){
      if(json.ip === "127.0.0.1") {
         document.getElementById('user').style.display = 'block';
      }
    }
</script>

<script type="application/javascript" src="http://jsonip.appspot.com/?callback=getip"></script>

I got this from here: https://stackoverflow.com/a/810461/3132718

Now the div won't be visible on the page by default but could be still seen by viewing the source code.

Upvotes: 1

Related Questions