『壹』 前端網頁是怎麼跟後台進行數據交互的
MVC全名是Model View Controller，是模型(model)－視圖(view)－控制器(controller)的縮寫，一種軟體設計典範，用一種業務邏輯、數據、界面顯示分離的方法組織代碼，將業務邏輯聚集到一個部件裡面，在改進和個性化定製界面及用戶交互的同時，不需要重新編寫業務邏輯。MVC被獨特的發展起來用於映射傳統的輸入、處理和輸出功能在一個邏輯的圖形化用戶界面的結構中。
構建網站的主要思路參考，簡單說就是有網站頁面，有數據存儲的資料庫，有資料庫和頁面銜接的程序（程序一般有PHP,ASP,JAVA,.NET等）
『貳』 web前端和後端怎麼進行數據交互
總結有以下幾種方式：
1. HTML賦值
2. JS賦值
3. script填充JSON
4. AJAX獲取JSON
5. WebSocket實時傳輸數據
詳細了解，去搜索下，我相信你會更明白。
『叄』 spring mvc 前端怎麼獲取後端數據
方式一 通過 URL 傳參
通過 URL 掛接參數，如 /auth/getUser?userid='6'
伺服器端方法可編寫為： getUser(String userid) ，也可新增其他參數如HttpSession, HttpServletRequest,HttpServletResponse,Mode,ModelAndView等。
方式二 單值傳參
前台調用如：
ajaxPost( "/base/user/exchangeSort" ,{ "id" :rid, "otherid" :otherid}, function(data,status){
xxxxxx
xxxxxx
});
伺服器端為：
public String exchangeSort(String id, String otherid)
方式三 對象傳參
前台調用如：
var org={id:id};
ajaxPost("/base/org/getOrgById", org,function(data,textStatus){
xxxx
xxxx
});
伺服器端為 ：
public Org getOrgById(Org org)
方式四 對象序列化傳參
前台調用如：
var ueser={id:rowId};
var data=ajaxPost("/base/user/findById",{"userObj":JSON.stringify(user)},null);
或者
var ueser={ };// 創建對象
user["id"]=id;
user["name"]=$("#name").val();
user["dept"]={};// 外鍵對象
user["dept"]["id"]=$("#deptid").val();
ajaxPost("/base/user/addUser",{"userObj":JSON.stringify(user)},function(data){xxxx;xxxxx;});
伺服器端為：
@RequestMapping ( "/findById" )
@ResponseBody
public UserInfo findById(String userObj) {
// 使用 fastJSON
UserInfo user = JSON.parseObject (userObj, UserInfo. class );
user = (UserInfo) userService . findById (UserInfo. class , user.getId());
return user;
}
方式五 列表傳參
前台代碼如：
var objList = new Array();
grid.forEachRow( function (rId) {
var index = grid.getRowIndex(rId);
var obj = {};
obj[ "id" ] = rId;
obj[ "user" ] = {};
obj[ "user" ][ "id" ] = $( "#userId" ).val();
// 不推薦這樣的寫法
//obj["kinShip"] = grid.cells(rId, 1).getValue();
//obj["name"] = grid.cells(rId, 2).getValue();
obj["kinShip"]=grid.cells(rId,grid. getColIndexById ("columnName")).getValue();
obj["name"]=grid.cells(rId,grid.getColIndexById("name")).getValue();
if (grid.cells(rId, 3).getValue()!= null && grid.cells(rId, 3).getValue()!= "" ) {
var str = grid.cells(rId, 3).getValue().split( "-" );
var day = parseFloat(str[2]);
var month = parseFloat(str[1])-1;
var year = parseInt(str[0]);
var date= new Date();
date.setFullYear(year, month, day);
obj[ "birth" ] = date;
} else {
obj[ "birth" ] = "" ;
}
obj[ "politicalStatus" ] = grid.cells(rId, 4).getValue();
obj[ "workUnit" ] = grid.cells(rId, 5).getValue();
if (grid.cells(rId, 6).isChecked())
obj[ "isContact" ] = "1" ;
else
obj[ "isContact" ] = "0" ;
obj[ "phone" ] = grid.cells(rId, 7).getValue();
obj[ "remark" ] = grid.cells(rId, 8).getValue();
obj[ "sort" ] = index;
objList.push(obj);
});
ajaxPost( "/base/user/addUpdateUserHomeList" , {
"userHomeList" : JSON.stringify(objList),
"userId" : $( "#userId" ).val()
}, function (data, status) {
xxxxx
});
伺服器端：
@RequestMapping("/addUpdateUserHomeList")
@ResponseBody
public String addUpdateUserHomeList(String userHomeList, String userId) {
List<UserHome> userHomes = JSON
.parseArray(userHomeList, UserHome.class); //fastJSON
if (userHomes != null && userHomes.size() > 0) {
try {
userService.addUpdateUserHomeList(userHomes, userId);
} catch (Exception e) {
e.printStackTrace();
}
}
return "200";
}
附上ajaxPost代碼：
function ajaxPost(url,dataParam,callback){
var retData=null;
$.ajax({
type: "post",
url: url,
data: dataParam,
dataType: "json",
success: function (data,status) {
// alert(data);
retData=data;
if(callback!=null&&callback!=""&&callback!=undefined)
callback(data,status);
},
error: function (err,err1,err2) {
alertMsg.error("調用方法發生異常:"+JSON.stringify(err)+"err1"+ JSON.stringify(err1)+"err2:"+JSON.stringify(err2));
}
});
return retData;
}
『肆』 如何將前端網頁與後台資料庫連接
1、您需要掌握的第一件事是資料庫查詢語句。這是最簡單的資料庫查詢語句：SELECT * FROM sys_role，這意味著從角色表中查詢所有信息。以下顯示了查詢結果。此結果需要顯示在首頁上。需要代碼來調用這個sql語句。
『伍』 前端怎麼接收別人調用到的介面數據
ajax，想要接收數據，那麼你需要先請求數據，一般使用Ajax。
你的開發文檔上面會詳細寫明，前端js請求後端那個介面，傳參類型、格式，然後返回什麼數據類型、格式。
『陸』 前端後端怎麼連接起來
前端調用後端介面無外乎六種方法，如下：
1、打開vs，創建空的asp.net mvc演示項目【WebMVC】
（1）依次點擊【文件】->【新建】->【項目】；
（2）在【新建項目】界面選擇【Web】->【ASP.NET Web 應用程序(.NET Framework)】，輸入名稱，選擇框架至少4.5版本，點擊【確定】按鈕；
（3）選擇【空】->【MVC】->【確定】 ；
（4）創建好了項目。
2、在項目中
（1）在Controllers文件夾上點擊滑鼠右鍵，依次選擇【添加】->【控制器】，即可完成HomeController的創建；
（2）在Controller的Index方法內，點擊滑鼠右鍵，選擇【添加視圖】；
（3）在項目中添加文件夾【Content】並添加jquery源文件；
（4）在Index頁面添加jquery的引用。
3、在Index頁面中添加一個輸入文本框，一個按鈕，以及顯示結果的dom。
4、在HomeController中添加新的方法，用於接收前台傳入的參數，組裝後返回。
5、在Index頁面，添加Jquery的ajax方式，調用後台介面，返回結果的處理代碼。
6、在vs中，按F5調試運行結果，如下：
（1）在文本框中輸入內容；
（2）點擊按鈕，調用介面，並將返回值顯示在界面；
（3）如果要提交大量數據，或者敏感數據，請修改ajax的type方式，這樣參數就不會在url地址欄中顯示了。
『柒』 前端與後端有哪幾種ajax交互方法
首先，關於前後端 的數據交互方法，ajax自己算一種。
如果是想問ajax的交互屬性，那麼 有四種：
GET，POST，PUT，DELETE
被提倡使用的是GET和POST。
然後，如果是想問前後端的數據交互方法的話，那有至少5種
1. HTML賦值（輸出到 Element 的 value 或 data-name）
2. JS賦值（將數據填充到 `<script>` 的 JavaScript 變數聲明中。）
3. script填充JSON （填充 JSON 數據到 `<script>` 標簽中，前端通過 DOM 獲取 JSON字元串並解析成對象。）
4. AJAX獲取JSON
5. WebSocket實時傳輸數據（如果將 AJAX請求和響應比喻成給伺服器發簡訊和等待伺服器回復簡訊，而 WebSocket 就如同和伺服器打電話）
『捌』 前端如何做與後台數據的對接
現在在前端獲取後台數據的主流方式是使用Ajax非同步載入0。前端頁面通過Ajax向後台請求數據，後台在放回給前端頁面如果你有前端js基礎和後台動態頁面基礎的話只需要學習Ajax就可以，個把小時就能學會用了。初學的話你要先了解下B/S架構的原理，雖然簡單，但是很重要，這個原理貫穿在整個動態網站的設計製作之中。具體學習的話你可以上W3school網站上學，上面相關的web設計製作資料都比較全，也淺顯易懂。建議學習的順序為HTML-》CSS-》Javascript-》XML-》PHP（或asp或.Net）。
希望對你有幫助。
『玖』 前端調用後端的介面有幾種方式了
一般不存在前端給後端介面的情況，幾乎都是後端給前端介面，所謂介面就是可以通過服務端部署的機器提供出來的URL地址進行動態的數據交互。通常的工作流是後端跟前端協商定義數據介面格式（一般就是JSON格式）形成文檔，後端實現介面，前端做靜態的mock（可以是直接在頁面的JS拼假數據或者通過JSON server按照真實調用服務的方式集成），後端實現服務介面，兩邊都完成後集成聯調。現在有swagger 或者 apiairy 等工具可以更簡化這個過程