2016-01-22 103 views
1

我正在將一個簡單的HTML5虛擬教室整合到語言教學網站上。用JS創建一個url實例

我抄課堂的源代碼,並將其粘貼到下面的文件夾中的index.html頁面...

site.com/classes/room-1

這是工作的罰款但是任何人都可以隨時進入教室,我需要限制訪問課程。

我想通過製作一個獨特的URL實例來實現這一點,所以基本上如果你沒有url鏈接,你將無法訪問教室。因此,URL會是這個樣子......

site.com/classes/room-1?instance=l23jhvn23o1i2un3lnj12xas

然後當老師登錄到他與他的老師教室名稱生成一個唯一的URL和教師被重定向到唯一的URL實例。他可以通過電子郵件與學生分享鏈接,他們可以繼續上課。

以下是處理實例URL的代碼片段...那麼生成URL實例的最佳方式是什麼?

function start() 
{ 
    // Optional username and password. If not specified here, a popup dialog 
    // box will appear. 
    var username = ''; 
    var password = ''; 

    // The Groupworld server to connect to. You can optionally specify the 
    // port number (using the format "server:port"). 
    var base = 'www.groupworld.net:9175:1639'; 

    // The object to load and instance name. To create a different "session", 
    // just copy the html page and change the instance name. 
    var object = 'new_conference:room-1'; 

    // Flags: not currently used. 
    var flags = 0; 
    groupworld.startup(username, password, base, object, flags); 
} 

下面是我們所需要的圖解...提前

Teacher work flow

感謝,

傑思羅。

+0

如果你想在網頁限制指定的參數中的URL,你應該使用服務器端,像PHP一樣。 – jcubic

+0

如果學生傳播唯一的祕密URL,該怎麼辦?因爲@ jcubic說你需要實現服務器端的功能 –

+0

對,你能解釋一下「限制頁面到指定參數的URL」嗎?參數是實例嗎? JS也不可能完成這個任務,或者只是不太安全? –

回答

0

我想我自己可能已經回答了這個問題,如果有人願意檢查我的邏輯,我會非常感激。

關鍵是在這裏的課堂嵌入代碼...

// The object to load and instance name. To create a different "session", 
 

 
// just copy the html page and change the instance name. 
 

 
var object = 'new_conference:jethro';

所以我需要從「葉忒羅」在Javascript來改變「變種對象」(這是什麼每次教師創建教室時,我都會將教室命名爲隨機字符串)。該隨機字符串應該被保存在一個PHP變量中,我將其稱爲'$ instance'...

所以我創建了一個包含臨時數據庫的index.php登錄頁面。以下是直播網站上的鏈接:http://toucan-talk.com/classes

臨時數據庫具有以下憑據

用戶名:傑思羅

密碼:密碼

下面是評論的index.php代碼由我...

<?php 
session_start(); 

if ($_POST['username']) { 

     // Temporary database 
    $dbUsname = "jethro"; 
    $dbPaswd = "password"; 
    $uid = "1"; 

    $usname = strip_tags($_POST['username']); 
    $paswd = strip_tags($_POST['password']); 

    if ($usname == $dbUsname && $paswd == $dbPaswd) { 
     // Set session variables 
     $_SESSION['username'] = $usname; 
     $_SESSION['id'] = $uid; 
     // To generate the random string from a word 
     $str = "Hello"; // word to hash 
     $instance = md5($str); // hash stored in variable 
     header('Location: classroom.php?instance='.$instance);// Hash is concatenated onto the login redirect page 
    } else { 
     echo "<p>Oops! That username or password combination is incorrect. Please try again.</p>"; 
    } 
} 

?> 



<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<title>Toucan-Talk Tutor Login</title> 
</head> 

<body> 
    <div id="wrapper"> 
     <center> 
      <img style="width: 250px;" alt="" src="http://www.toucan-talk.com/images/logos/footer-logo.png"> 
     </center> 
     <h1>Enter Classroom</h1> 
     <form id="form" action="index.php" method="post" enctype="multipart/form-data"> 
     Username: <input type="text" name="username"/><br> 
     Password: <input type="password" name="password" /><br> 
     <br> 
     <center> 
      <input class="button" type="submit" value="Enter" name="Submit" /> 
     </center> 
     </form> 
</body> 
</html> 

所以我認爲串接MD5哈希到頭部頁面重定向使我現在得到的URL看起來像這樣:http://toucan-talk.com/classes/classroom.php?instance=8b1a9953c4611296a827abf8c47804d7

我做了另外一個文件名爲classroom.php這頭重定向到。在那裏我有教室嵌入代碼。這裏僅僅是文件中的PHP:

<?php 
session_start(); 

// Variable with the md5() hash code 
$instance = $_GET['instance']; 

if (isset($_SESSION['id'])) { 
    $uid = $_SESSION['id']; 
    $usname = "Test variables: <br> Username: ".$usname. "<br> Id: ".$uid; 
} else { 
    echo 'Please login'; 
    die(); 
} 

?> 

正如你可以看到我已經定義的變量「$實例」再次爲$例如= $ _GET [「實例」]; (我不太清楚這是什麼一樣,但仍然不無它的工作!)

所以我知道$ _GET [「實例」] = $實例= 8b1a9953c4611296a827abf8c47804d7

現在我只需更換的Javascript「 var object'與PHP標記中的變量$實例在Groupworlds服務器上即時生成教室!

// The object to load and instance name. To create a different "session", 
 
// just copy the html page and change the instance name. 
 
var object = 'new_conference:<?php echo $instance ?>';

現在,當我看到教室裏源代碼的實例是MD5()哈希!

sourcecode

這似乎這樣的伎倆......那麼,這似乎是解決這個編碼問題的合理方法?我很高興能在此基礎上進一步完善工作。

非常感謝你們幫助到目前爲止。

Jethro。