How do I make a page redirect in a website?

Please tell me. I want to make a page that redirects to my pokemon trades.

Hey @lettucecrab,

You can do this using JavaScript by placing the following piece of code in your script.js:

window.onload = function() {
  window.location.href = "<THE SITE URL TO REDIRECT TO>";
}

Note that the redirect happens on onload of the page. If you want to redirect on mouse click, just use <a></a> tags as hyperlink.

Also, according to W3Schools.com (https://www.w3schools.com/howto/howto_js_redirect_webpage.asp), you could also use

window.location.replace("http://www.w3schools.com");

but the difference between href and replace, is that replace() removes the URL of the current document from the document history, meaning that it is not possible to use the “back” button to navigate back to the original document.

Hope this helps!

Hey there!

There’s another and simple way if you’re using Express.

app.get('/mypage', (req, res) => {
    res.redirect('https://link.com');
});

Happy Glitching!

1 Like
window.location.replace('http://w3c.com');

It’s better than using window.location.href = 'http://w3c.com';

Using replace() is better for redirect, because it does not keep the originating page in the session history, meaning the user won’t get stuck in a never-ending back-button fiasco.

1 Like

What if you’re trying to redirect to a new page within your glitch page? Say for example, I am on my “About Me” page and I want to get back to the home page?

Same way, let’s say your home page is <project>.glitch.me/

Then do:

window.location.replace("/")

Or a link:

<a href="/">Back Home</a>
2 Likes

Hello, I just added the code to mine, and I got redirected to my 404 error page, do I have to remove it for it to work?

Hi @Normi,

Can you show the code you put in your project? Did you remember to add the https:// part for the external site?

const app = express();

function checkHttps(req, res, next){
  
  if(req.get('X-Forwarded-Proto').indexOf("https")!=-1){
    return next()
  } else {
    res.redirect('https://' + req.hostname + req.url);
  }
}

app.all('*', checkHttps);
app.use(express.static("public"));


app.get("/", function(request, response) {
  response.sendFile(__dirname + "/page/index.html");
});

app.get("/accueil", function(request, response) {
  response.sendFile(__dirname + "/page/index.html");
// only /accueil work, /tos... redirect me to 404 error page
});

app.get("*", function(request, response) {
  response.sendFile(__dirname + "/page/404.html");
});

app.get("/404", function(request, response) {
  response.sendFile(__dirname + "/page/404.html");
});

app.get("/tos", function(request, response) {
  response.sendFile(__dirname + "/page/important/tos.html");
});

app.get("/invite", function(request, response) {
    response.redirect("https://discord.com/");
});

app.get("/thanks", function(request, response) {
  response.sendFile(__dirname + "/page/thanks.html");
});

app.get("/object", function(request, response) {
  response.sendFile(__dirname + "/page/other/object.html");
});

``` only /accueil work

I think rules are processed in order. You have a catch-all rule, app.get("*" ... which is defined after accueil and before the others.

Try moving this wildcard rule so that it is the last one you define (underneath all the others).

1 Like