實作 "線上共同編輯"

ajax php html css mysql jquery database

sunry81914 2013-03-17 20:50:22 ‧ 11725 瀏覽

之前友發問過但沒有適當的解答，再求問一次希望有知道的大大能指點我一下!

現在很多網站都有提供在網頁上多人共同編輯但始終沒相關技術教學
我因專題需要，網頁上需要提供類似允許部分會員可以進入同一頁面進行共同編輯一份筆記
請問這個功能該如何實作?邏輯怎麼想比較恰當?

從A頁面進入到B頁面，會員會因組別的不同的網頁
這想法又該怎麼做呢?

我對程式沒很厲害，所以希望能有更清楚的說明><
我是用PHP...這方向的語言~

看更多先前的討論...收起先前的討論...

海綿寶寶 iT邦大神 1 級 ‧ 2013-03-18 09:07:17 檢舉

sunry81914提到：
現在很多網站都有提供在網頁上多人共同編輯但始終沒相關技術教學

因為這不是個簡單的功能

我對程式沒很厲害

如果是這樣
建議你放棄這個題目
再換別的

如果非得這個題目
就去找 open source php chat room 之類的關鍵字
線上聊天室
應該比共同編輯容易多了

老鷹(eagle) iT邦高手 1 級 ‧ 2013-03-18 09:10:52 檢舉

說到線上聊天室
俺上次前輩有丟給俺看一個聊天室
Node.js技術
真的是隨時資料更新~~!
厲害~~!

海綿寶寶 iT邦大神 1 級 ‧ 2013-03-18 09:35:36 檢舉

chingfeng提到：
Node.js技術

其實我有找到線上共同編輯的open source版本
就是用Node.js寫的
檔案有多大？
不大，不過27MB而已
source code？壓縮過「只有」27MB？
我連下載都懶得下載了

老鷹(eagle) iT邦高手 1 級 ‧ 2013-03-18 09:37:41 檢舉

antijava提到：
我連下載都懶得下載了

俺是沒需求

fillano iT邦超人 1 級 ‧ 2013-03-18 11:49:57 檢舉

參考資料的話...在google學術搜尋下「realtime collaborative editor」關鍵字，可以看到很多。這些論文註解也要看一看，說不定可以從引用中找到更適合的文章。

不過複雜度視你的需求而定，如果要做到google doc那個程度...建議改個方向，那是最困難的。我印象中有人提出過不需要「鎖定」的作法...

我記得Cloud9 IDE有共同編輯的功能，也有open source，可以參考一下。不過我記得他是用「行」為單位做鎖定，某人在編輯某行時，這一行會加註某人在編輯。看你們的需求，不過還是可以參考。

版本管理的實作是可以參考，不過如果是即時共享，底層不太可能用這些工具。

fillano iT邦超人 1 級 ‧ 2013-03-18 12:04:28 檢舉

http://ace.ajax.org/#nav=about ...這是Cloud9使用的編輯器，也許可以考慮一下怎麼用它來實作編輯器的部份，然後自己來解決「衝突」的問題，這樣至少不會那麼複雜

sunry81914 iT邦新手 5 級 ‧ 2013-03-20 21:54:17 檢舉

我是真的得實作出來想到頭痛也得弄出來ˊ口ˋ!
謝謝大大給我的建議!我會去看看那個技術的~

sunry81914 iT邦新手 5 級 ‧ 2013-03-20 23:14:57 檢舉

fillano 大大，真是謝謝你的意見，我先自己消化
目前看起來還蠻實用! 但需要研究研究
非常謝謝你

fillano iT邦超人 1 級 ‧ 2013-04-09 11:10:40 檢舉

之前忘記了一個重要的關鍵字：「Operational Transformation」

用這個關鍵字查查，會找到許多這方面主題的文章與教學，建議從wikipedia的開始看一看。除了wiki，我看到一些不錯的介紹：

Google Wave Operational Transformation
Understanding and Applying Operational Transformation
Operational Transformation: An Introduction
Operational Transformation （這是一個簡報）

雖然有點晚，如果對這個議題有興趣，不妨繼續深入。

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

4 個回答

fillano

iT邦超人 1 級 ‧ 2013-03-20 11:29:38

最佳解答

http://googleappsdeveloper.blogspot.tw/2013/03/build-collaborative-apps-with-google.html

剛剛看到，google也有提供realtime collaboration api...這也許是個方向。如果你想自己刻，也是可以參照他的想法跟實作範例。

回應 1
分享
檢舉

sunry81914 iT邦新手 5 級 ‧ 2013-03-20 23:16:43 檢舉

YAP! 剛去了解一下這新的API ，我會拿來參考謝謝你提供這新消息 ><

登入發表回應

老鷹(eagle)

iT邦高手 1 級 ‧ 2013-03-17 23:14:34

版本控制??
給你關鍵字"SVN" or Google文件
俺好久沒搞這個了~~!
現在處於對以前的code不滿推倒重建中~~!
至於你說的什麼組別到什麼頁面我先問問一下有幾組??

俺有個簡單的想法
創建帳號時多一個欄位作判別
A-Z or 1-MAX

&lt;pre class="c" name="code">
&lt;?php
//$x=資料庫欄位取出(A-Z or 1-MAX)
switch ($x)
{
case 1:
  導向某頁面
  break;
case 2:
  導向某頁面
  break;
case 3:
  導向某頁面
  break;
.......
default:
  導向登入畫面
}
?>

希望有幫到您的忙~~!

回應 2
分享
檢舉

sunry81914 iT邦新手 5 級 ‧ 2013-03-20 09:34:20 檢舉

組別是會隨之後老師新增，所以會越來越多耶!
那要動態新增網頁的話要怎麼做呢?

老鷹(eagle) iT邦高手 1 級 ‧ 2013-03-20 10:06:54 檢舉

俺一般來說假如是會新增的話~!
俺會把老師做成一個資料表
id,name,group,link
學生做成一個資料表
id,account,password,group_id
登入時
登入撈出group_id 在用group_id 取得link(網址),再轉跳~~!
至於同步更新俺是有看過一個技術可以使用 Node.js
不過俺沒碰過如果非同時編輯就使用"SVN" or Google