I'm experimenting for the first time with transition between html pages. I've been looking for the differences between replace and a href when I founded them I chose the second one. I'm building a sign-out button. So when i click on it I need to be redirected to the login page. But I also need to make impossible for the user to navigate back to the home (from the login) with the back button. So in my home.js file I wrote that (I'am working with firebase):
const disconnettitiButton = document.getElementById("disconnettiti");
disconnettitiButton.addEventListener('click', () => {
firebase.auth().signOut().then(function() {
// Sign-out successful.
window.location.replace("../index.html");
}).catch(function(error) {
// An error happened.
});
});
while this is the html corresponding to the button (It's not really a button...)
<a class="nav-link" href="#" id="disconnettiti">Disconnettiti<span class="sr-only"></span></a>
The problem is: The window.location.replace() succeeds in changing the page and returning back to the login form. But when i click the back button I can also return to the home page, where i called the .replace() function. The replace method should delete the top of the history but this is not the case. Any solutions? Many thanks
There is a basic error in your logic. Restricted area pages should be accessible only with valid grants.
These grants should be deleted when user logs out. So even if you press the back button you don't have the grants anymore and you are redirected to the login page. The same will happen if you try to point to a specific url in the restricted area.
You can use a cookie for example that you set/unset on login/logout or you can use sessions. On each page in the restricted area you need to have the check of the existence of the cookie at the beginning and otherwise the redirect.
Something is working wrong in your application if after logout you can still see things that are inside the restricted area (but you didn't provide code to check that)
EDIT: i saw #scragar comment after i posted my answer but I fully agree with that and not with OP's answer. There are no need for a login page if you don't want to restrict the application. The login becomes completely meaningless if you can access restricted areas anyway
I think you need to give complete url rather than giving a relative path. So if you are serving the page from localhost at port 3000 and index.html is at root, then you should give the path as http://localhost/index.html.
Also, your script must be throwing an error. You should check the browser console first, if something doesn't work.
Hope it helps:)
Related
I am trying to make a navigation button that just sends me to the index page but shows a different text in the url.
so i found this line of code to help me do it.
window.history.pushState("index.php", "test", "Testie");
But the problem is when i run it in an onclick function it just takes the last value and puts it in the url bar.
That itself is not the problem its that i dont have a Testie.html/php file.
I want it to be send to index.php but make the appearance of Testie in the url.
How do i do it?
The purpose of history.pushState is to say:
Some other JavaScript has manipulated the page so what the user is seeing is the same as what they would see if they went to this URL.
It lets you get fast updates to the page and bookmarkable URLs with real content that is good for fast initial page loads and for search engines to index.
It doesn't send data to the server (you need to do that with other code).
It does mean that if the URL isn't actually handled by the server (as you say it is in your case) then the page will break if the user does bookmark the page (or refreshes it, or sends the link to someone, etc).
If you want to navigate to a URL with Testie in it, then the first thing to do is to make the server support it. Forget about JavaScript.
I have the following files on my server:
var/www/html/web/
-- login.html
-- files/content.html
-- css/
-- js/
-- images/
My aim is when a valid user heads to my domain and/or opens login.html, it will redirect them to content.html. I can do this easily with JavaScript.
Next, I need to block access to content.html through any other method but that redirect. If a user tries to head straight to the reference of the file, it will not allow access; the same goes for all my other folders. Also If the content page access via new tab , then also it redirect to login page .
How can I go about doing this? Usage of .htaccess?
I'm about to vote to close this, but commenting here rather than in the comment box (due to space restrictions).
You have a "login.html" page but you don't want users to login before getting access to the content. This appears to be absurd. There might be a sensible reason for it, which might have something to do with the problem you are trying to solve. If that is the case, then knowing what it is would help in formulating a response.
Next, I need to block access to content.html through any other method but that redirect
This requires you to perform some sort of state management. You've not mentioned any capability serverside for this (PHP, Perl, python etc). You could drop a cookie in Javascript and redirect away based on the cooie, but this only proves that the user has previously visited the login.html not that they navigated to the page via the previous redirect. Further state is therefore maintained and asserted by the client which is insecure.
You've provided no explanation of what you are trying to achieve with this redirection, nor provided any context nor details of any constraints.
You can use document.referrer to see where the user came from. Then if a user didn't come from there you redirect him back or something like that.
You could also set a cookie on the login page and the content page checks for that.
I have a link like the one in the title in a custom 404 error page, which allows the user to go to the previous page just like with the browser's go back button. I just wanna ask if this method of linking is safe or not. I guess it is safe, but I am not sure. Thanks in regards!
One use case I can say that will not be "safe" is if the user has JavaScript disabled. In that case, you would have to create the link dynamically with server-side code using the HTTP referer header field's value as your href value on the anchor element.
Another thing to consider is the never-ending back and forth loop users would get stuck in, if they came from a page with an HTTP redirect.
Edit:
As you said above, you can use $_SERVER['HTTP_REFERER'] but the documentation says
.. This is set by the user agent. Not all user agents will set this,
and some provide the ability to modify HTTP_REFERER as a feature. In
short, it cannot really be trusted.
In reality, most browsers do set it correctly though, and seeing how this is not mission critical I think it's safe if you use it. You could also account for browsers that don't set it as follows:
if(isset($_SERVER['HTTP_REFERER']))
{
// Show a Back button link, if the referrer is available
echo "« Back";
}
else
{
// If not, show a link to your homepage instead
echo "Home";
}
My aim is to redirect user to a specific website for 18 seconds and then redirect back to my website. To accomplish this, I have written the code below. The problem I am facing was that the website started to redirect in a loop so I had to come up with a condition to avoid that. For this I have putted a check if the user is coming from my redirected website or not but now the redirection isnt working at all. Please guide. Thanks
Note: startupsandfinance is the domain name from which the user gets redirected back.
<script type='text/javascript'>
if !(( document.referrer.search("startupsandfinance"))){
document.cookie="toURL"+ "=" +escape(document.URL)+";path=/; domain=.mycsnippets.com";
document.cookie="refURL"+ "=" +escape(document.referrer)+";path=/; domain=.mycsnippets.com";
this.location='http://www.startupsandfinance.com/welcome.htm';
}
</script>
Please guide
if !(( is a syntax error
!search() will not work, since search returns -1 when nothing is found and the index else
Do not use this.location, but window.location
No need to use entity escapes inside <script> tags
Do never ever rely on referer, it can easily be spoofed or is disabled. Use cookies instead: Before redirecting set it, when coming back you can check it.
I have just tried to use the Facebook registration plugin inside an iframe page tab.
In case anyone is wondering why I would want to do this, I want to use the Facebook registration plugin to create a newsletter signup form on my FB page.
I tried with this code:
<iframe src="https://www.facebook.com/plugins/registration.php?
client_id=113869198637480&
redirect_uri=&
fields=name,birthday,gender,location,email"
scrolling="auto"
frameborder="no"
style="border:none"
allowTransparency="true"
width="100%"
height="330">
</iframe>
and this code:
<div id="fb-root"></div>
<script src="https://connect.facebook.net/en_US/all.js#appId={YOUR_APP_ID}&xfbml=1"></script>
<fb:registration
fields="name,birthday,gender,location,email"
redirect-uri=""
width="530">
</fb:registration>
In both cases I used the APP_ID of the page tab application, and the canvas url for that page tab, but I filled out the website field with the website being used.
WHen I take out the pre-filled FB info and fill out the form, a var_dump on the receiving page gives out the right info, but when I submit it with the pre-filled FB info, it does a popup saying, you are registering with APP_NAME_HERE, if you want to do this click continue, or undo if you don't (something like that) and when I click continue nothing happens.
I have used Firebug to inspect the page, and I think that the data is being sent to another iframe, but I don't know how to access it. I have tried changing target to _top, _self and _parent but this didn't work either. I also tried creating a new app specifically using the website attribute, and that failed in the same way too. ANy help gratefully received.
As far as I can tell, the target attribute is broken when using pre-filled info. Perhaps it has something to do with the way the flow must happen when the confirmation popup appears, but AFAIK it's not documented that the two cannot be used together. In any case, the pre-filled data seems to have the effect of forcing target=_top no matter what you specify in the attributes.
That being the case, you will have to specify an external page address as the redirect_uri and process the data there and then redirect back to the Facebook page address. If necessary you can pass some data back using the app_data parameter in the query string.
Most than likely you are already flagged as registered and are receiving back the cookie/header for FB connect to work. If this is the case you will need to un-register your application on facebook in the application management page. Once you do that the button will work again.
Lastly, if the user is logged into Facebook and already connected to
your application, the button will say Login and won't do anything when
clicked (but your application should detect this state using the
getLoginStatus method and not show the button).
https://developers.facebook.com/docs/plugins/registration/
You can debug your registration status using
FB.Event.subscribe('auth.statusChange', function(response) {
if(!response.authResponse) return;
console.log(response)
});
Hope this helps.
Looks to me that you are missing something:
< fb:register >
Here you can see that tha attribute onvalidate, which contains the name of the js function called after the Register button is pressed, to whom is passed the whole object containing the user info.
Greetings ;)
Luca
In the second code redirect-uri="" needs a value. It needs to be prefixed by your site url.