-1

I have seen a few different online quizzes/forms where there are multiple webpages used. If you try to skip a page by editing the URL (for example, you are on www.exampledomain.com/pg2 and you edit it to www.exampledomain.com/pg3), it would redirect you back to the page you didn't finish.

I am working on an online game with a different webpage for each level. I would like help finding a way in which I can prevent users from editing the URL of a level and skipping to the next. Is there a way I can code this in JavaScript, jQuery, etc.?

Thanks!

  • 2
    You already asked this question: [How to create multi-page quiz](/q/69156305/4642212). Did you read [Persist variables between page loads](/q/29986657/4642212) and make some attempts in the meantime? [Edit] your post and include them, please. Do you have some server-side implementation that could check user cookies and session data? – Sebastian Simon Sep 13 '21 at 02:50
  • I apologize for reposting the question. The previous one was closed due to not being focused, so I created a new one. I am currently figuring out the local storage feature. Thanks for the link –  Sep 13 '21 at 02:59
  • That’s a long-standing bug and an unfortunate trap for new users; see [“You can edit the question or post a new one”](//meta.stackoverflow.com/q/394552/4642212). – Sebastian Simon Sep 13 '21 at 03:08
  • Oh okay, I'll keep that in mind. I've run a few simple tests with session/local storage and it's working great, so I'm going to try and apply it with some of my code. Thanks for the help! –  Sep 13 '21 at 03:14

1 Answers1

0

Yes, create a JavaScript array of changes that you want to make on each level and edit the DOM whenever the level gets completed with the help of that array. May be you could use a counter variable to get incremented whenever one level gets completed, and set that variable as the array index to get the respective change.

Whenever you make these kind of online games, try to have some elements which are going to have some traits that are common say if its a obstacle avoidance game then you may have the walls in common but their arrangements might change according to the level. So I assume that even your game would have such kind of elements. If so then the job is quite simple , you can just alter the specific elements of the page after one level gets completed with the help of JavaScript.

Say Level 1 got completed then you can set a condition whether the user as completed the task or not if yes then with the help of JS create a modal screen that asks them to either to continue or leave, if they choose to continue then don't use a separate HTML file to create the next level just use JS and alter the DOM with some methods like innerHtml or innerText.

Jai Ganesh Baskar
  • 16
  • 4
  • If you need more clarity in the answer then you can share your code to me so that I could have a deeper look on it. – Jai Ganesh Baskar Sep 13 '21 at 03:11
  • 1
    Thanks for the answer. This is actually something I've considered doing, but I would rather not have every level on a single webpage due to how long it would get. There are also a few times in the game where the page is refreshed, and that would cause the game to restart. –  Sep 13 '21 at 03:18
  • Yes I can understand your point for such cases you need to move to React and maintain a database for each user with some database manager like MangoDB etc. – Jai Ganesh Baskar Sep 13 '21 at 03:20