Is there a way to hide a url on a web page?

Question

Is there a way to hide a url on a web page?

Asked 7 years, 1 month ago

Viewed 8,319 times

0

Let’s go by parts, I’m making a site where I will read a database URL and then I will use it in an image, by clicking on it(image) will open this URL (within an iframe or in a new tab).

In the code, I have a page using HTML and PHP where I show the image with the link URL visible:

<!DOCTYPE html>
<html>
<head>

</head>
<body>
    <div> 
    <?php
        include ("connection.php");

        $sql = "SELECT * FROM table";
        $result = $conn->query($sql);

        if ($result->num_rows > 0) {
            // output data of each row
            while($row = $result->fetch_assoc()) {
                echo "<div class=\"gallery\">";
                echo "  <a target=\"iframe1\" href=\"".$row["url"]."\" onclick=\"openiframe()\">";
                echo "    <img src=\"images\\".$row["image"]."\" width=\"600\" height=\"400\">";
                echo "  </a>";
                echo "  <div class=\"desc\"><a href=\"".$row["url"]."\" target=\"_blank\">".$row["name"]."</a></div>";
                echo "</div>";
            }
        } else {
            echo "0 results";
        }

        $conn->close();
    ?> 
    </div>
</body>
</html>

The result of the previous code is something like this:

So far so good, now what I intended was not to be visible the URL, in the next image I marked what I speak:

There is a way to hide the URL using for example PHP or some other way?

2 answers

1

In the old days, in the old days, there was a method to this: window.status. Just put on the link something like onmouseover="window.status='Olá'" that when passing the mouse over the link appeared "Hello" in the browser status bar instead of the link in the href.

However, this method has been abolished and no longer has support in the most modern browsers.

One solution is to use the method window.open with onclick opening the URL in a new tab (some browsers will open in a new window):

<a href="javascript:void(0)" onclick='window.open("destino.html","_blank")'>link</a>

This way it will appear "javascript:void(0)' in the browser instead of the URL, and the "destination.html" URL will open in a new tab/window ("_Blank").

Using a function and deleting the script in the "programmer options" (Developers tools):

<a href="javascript:void(0)" onclick='abrirURL("qualquercoisa")'>link</a>

or

<a href="javascript:abrirURL('qualquercoisa')">link</a>

Script with a id:

<script id="novaJanela">
function abrirURL(i){
    if(i == "qualquercoisa"){
        i = "destino.html";
    }
    window.open(i,i);
}

// aqui eu excluo virtualmente a tag script da página pelo id "novaJanela"
// não há problema em excluir essa tag, ela continuará funcionando
// porque já foi inserida na memória após o carregamento da página
window.onload = document.getElementById("novaJanela").outerHTML = '';
</script>

I made an edit on the question because the other arrow was not noticed very well, I also need to hide in "code" the URL

– Tmc

2017/10/19 at 16:31
@Tmc I updated the answer by changing href from "#" to "javascript:void(0)"

– Sam

2017/10/19 at 16:33
It turned out that the way you say to change does not appear the URL at the bottom of the page however missing in the "programmer options" see in the image of the question what I say if you do not understand me. I have two arrows in the picture.

– Tmc

2017/10/19 at 16:48
@Tmc Got it, you want to hide in both places?

– Sam

2017/10/19 at 16:51
exactly, needed it, there is way?

– Tmc

2017/10/19 at 16:52
@Tmc Exists by creating a function and assigning a variable to the URL. But if the user views the source code he can see the URL in the function, but it is possible to delete the function in the "programmer options".

– Sam

2017/10/19 at 16:59
@Tmc I added in the answer.

– Sam

2017/10/19 at 17:06
Let’s go continue this discussion in chat.

– Tmc

2017/10/20 at 08:45

Show 3 more comments

Browser other questions tagged php html url

You are not signed in. Login or sign up in order to post.

by Roberto de Campos • **5,345** points · Answer 1 · 2017-10-19T14:40:55+00:00

You can use the function file_get_contents, and in it pass the URL of your image. The function will return a base64 of your image, so you just put that base64 within the tag IMG, would look something like this:

$base64 = file_get_contents('caminho_da_sua_imagem');
echo "<img src=\"data:image/png;base64, ".$base64."\">";

Remember that for each extension, it is necessary to inform on SRC:

PNG = <img src="data:image/png;base64, seu_base64">
JPG = <img src="data:image/jpg;base64, seu_base64">
GIF = <img src="data:image/gif;base64, seu_base64">