javascript Werd Example

Unlike other languages (php, python, perl, c#) javascript runs purely in the context of the user. This means that you cannot "hide" the answers on the server side handler, making it fairly succeptable to exploitation. It may be possible to use randomized hidden variables mixed in with other random hidden elements to make it harder to guess, but the logic is still on the client side and therefore can be programmatically defeated. Below is an example of how werd would work with javascript (though using server side controls is highly recommended).

Werd JavaScript Example:

Werd Javascript Source<!-- START JAVASCRIPT WERD SAMPLE --> <div class="rnd txt" style="color:#ffffff;background-color:white;background-image:url(https://YOUR_URL/YOURPAGE/images/YOUR_WERD_IMAGE.png);background-repeat:no-repeat;background-size:cover;float:left;height:350px;width:96%;text-align:center;align-content:center"><div style="width:100%;float:left"><b>JavaScript Example:</b></div> <form method=GET action="https://YOUR_URL/YOURPAGE"> <div id="jsfrm" style="width:80%;float:left"> </div><div style="width:100%;float:left;align-content:center"><input type="submit" id="jssubmit" value="Check" class="rnd"></div> </form> </div> <script> try{ var $_GET = {}, args = location.search.substr(1).split(/&/); $jsq="0"; $jsa="1"; for (var i=0; i<args.length; ++i) { var tmp = args[i].split(/=/); if (tmp[0] == "expected") { $jsa=tmp[1]; }//pckd if (tmp[0]=="wddl"){ $jsq=tmp[1]; }//wddl }//loop }//try catch{} if ($jsq==$jsa) { alert("You picked the correct Answer!\n You can now do something fun."); } var r = new XMLHttpRequest(); r.open('GET', 'https://247coding.com/wrd', false); r.send(null); if (r.status == 200) { $wrdStr=r.responseText; const $wrdArray = $wrdStr.split(","); $jsindex=$wrdArray[0]; $jsTxt=$wrdArray.length+" werds<br>Answer Index:["+$jsindex+"]<br><select id=\"wddl\" name=\"wddl\" class=\"rnd\">"; cnt=0;//out of band counter to get correct index. for (var j=1;j< $wrdArray.length;j++){ $jsTxt += "<option>"+$wrdArray[j]+"</option>"; if (cnt==$jsindex) { $jsanswer=$wrdArray[j]; //set answer } cnt++; }//endloop $jsTxt+="</select>"; try { $jsTxt+="<input type=\"hidden\" name=\"expected\" id=\"expected\" value=\""+$jsanswer+"\">"; } catch{} document.getElementById('jsfrm').innerHTML=$jsTxt; } </script>