`
flex_莫冲
  • 浏览: 1092324 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

backbone与php交互

 
阅读更多
backbone通过save保存数据到服务器端,通过fetch从服务器端获取数据。两者执行时都会调用sync函数,而不会执行服务器端操作。因此,除非是自定义的sync操作(如采用websocket等非ajax方式提交),否则不需要覆盖sync函数。
问题1:php不能通过$_POST获取参数
save默认提交的是post方式,application/json的content-type,但是php的$_post只能接收Content-Type: application/x-www-form-urlencoded提交的数据,因此不能使用该方式获取参数。而采用file_get_contents("php://input")来获取
看了源码,设置Backbone.emulateJSON=true可更改contentType。但是我设置过依然没变。

问题:fetch可以传递参数吗?
当然可以。在fetch的options参数中设置data属性,传入jsonString参数。还可以通过type设置ajax的类型。默认是get。

if (Backbone.emulateJSON) {
      params.contentType = 'application/x-www-form-urlencoded';
      params.data = params.data ? {model: params.data} : {};
    }


html代码
<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script src="lib/jquery-1.7.2.min.js" type="text/javascript"></script>
		<script src="lib/underscore-min.js" type="text/javascript"></script>
		<script src="lib/backbone-min.js" type="text/javascript"></script>
	</head>
	<body>
		
	</body>
	
	<script>
		(function ($){
			//model 默认name
			Man = Backbone.Model.extend({
				//构造函数
				initialize :function(){
					//alert("you create me");
					//监听属性更改事件
					this.bind("change:name",function(){
						var name = this.get("name");
						alert("you change name to " + name);
					})
					this.bind("error",function(model,error){
						//alert(error);
					})
				},
				url:"save.php",
				//Backbone 每次向服务器读取或保存模型时都要调用执行的函数 默认是jquery.ajax方式。
				
				// sync:function(method, model) {
					// //method会更具save的不同而改变,create,update,delete,read
				  // alert(method + ": " + JSON.stringify(model));
				  // model.id = 1;
				// },

				//默认属性
				defaults:{
					name:'david',
					age:30
				},
				aboutMe:function(){
					return "my name is " + this.get("name") + "今年" + this.get("age") + "岁";
				},
				validate:function(attributes){
					if(attributes.name == "fuck"){
						return "name is error!";
					}
				}
			});
			
			var man = new Man;
			//实例更改属性
			man.set({name:"andy"});
			//save会执行Backbone.sync 若model定义了sync则不会执行服务器请求
			man.save({success:function(model,response){
				console.log(response);
			}},{error:function(err){
				console.log("err");
			}});

			// man.save({name: "luky"});
			
			//从php服务器端获取返回数据 若model定义了sync则不会执行服务器请求
			//从php服务器端获取返回数据
			var man1 = new Man();
			man1.fetch({
				url:"fetch.php",
				type:"POST",
				data:"name=John&location=Boston",
				success:function(model,response){
					alert(response.name);
				},
				error:function(err){
					console.log("err");
				}
			});


		})(jQuery);
	</script>
</html>



save.php
<?php
	header('Content-Type: application/json; charset=utf-8');  
	//不能通过$_POST获取。因为$_POST['paramName'] 只能接收Content-Type: application/x-www-form-urlencoded提交的数据
	$man = json_decode(file_get_contents("php://input"));
	file_put_contents("data.txt", $man->name);
	echo true;  
?>


fetch.php

<?php
	header('Content-Type: application/json; charset=utf-8');  
	file_put_contents("data.txt", $_POST["name"]);
	die(json_encode(array('name'=>'tom')));  
?>
分享到:
评论
2 楼 flex_莫冲 2015-02-16  
a2631500 写道
"看了源码,设置Backbone.emulateJSON=true可更改contentType。但是我设置过依然没变。 "

实际上是有效的,详见:http://dfhuo.com/wordpress/?p=756


多谢分享。
1 楼 a2631500 2015-02-13  
"看了源码,设置Backbone.emulateJSON=true可更改contentType。但是我设置过依然没变。 "

实际上是有效的,详见:http://dfhuo.com/wordpress/?p=756

相关推荐

    Backbone.js的Hello World程序实例.docx

    在这个实例中,我们将看到如何整合Backbone.js与其他辅助库如jQuery、Underscore和Mustache来实现与后端数据的交互。 首先,我们需要创建一个后端PHP文件`api.php`,用于返回JSON格式的数据。在这个例子中,`api....

    backbone:学习 Backbone.js

    Model可以与后端PHP交互,通过AJAX请求获取或保存JSON格式的数据。在描述中提到的"服务器动态Json内容"就是指的这一部分,Model能够监听数据变化,并自动同步更新到视图。 View是Backbone.js中负责UI展示的部分。它...

    Bents:BackBone PHP框架

    5. **控制器(Controllers)**:虽然BackBone.js没有明确的控制器概念,但在PHP框架中,控制器是处理用户请求、协调模型和视图之间交互的部分。Bents可能有一个类似的概念,负责处理HTTP请求,更新模型,然后将结果...

    Laravel开发-backbone-module-command

    4. **整合到Laravel**:将前端模块与后端API接口进行交互,通常通过Ajax请求。Laravel的路由和控制器应提供相应的API端点供前端调用。 5. **测试和部署**:完成开发后,进行测试,确保所有模块正常工作。在生产环境...

    srm.loc:启动backbone_srm - 添加文件

    项目描述中的"我的第一个项目使用 Laravel + Backbone"表明这是一个初学者或开发者用于学习和实践Laravel与Backbone结合使用的项目。这种组合允许开发者将后端逻辑处理交给Laravel,而将前端交互和界面更新交由...

    backbone-wp:使用前端路由的 Backbone 构建的 WordPress 主题

    **标题解析:**"backbone-wp"是一个基于前端框架Backbone.js开发的WordPress主题,它引入了前端路由的概念,使WordPress网站的交互性和用户体验有了显著提升。 **描述解析:**"骨干-wp"项目是将Backbone.js的灵活性...

    laravel-backbone-presentation:Laravel 和 Backbone 工作流

    Laravel 是一个基于PHP的优雅且强大的Web应用框架,而Backbone.js 是一个轻量级的JavaScript库,用于构建客户端的MVC(模型-视图-控制器)结构。将两者结合,可以实现高效、结构化的前后端分离开发模式。 **Laravel...

    Directus采用backbonejs编写的CMS

    3. RESTful API:Directus的核心是其强大的RESTful API,它允许应用程序通过HTTP请求直接与数据库交互。这使得Directus可以轻松集成到现有的Web应用或者移动应用中,提供数据服务。 4. 权限管理:Directus支持用户...

    Backbone.js的Hello World程序实例

    它为开发者提供了一套模型(Model)、视图(View)、集合(Collection)和路由器(Router)的框架,帮助组织代码结构,并与后端数据进行交互。本文详细描述了如何创建一个简单的Backbone.js的Hello World程序实例,包括前后...

    backboneOnSymfony:一个在 Symfony 后端运行的简单 Backbone 应用程序的 HelloWorld

    模型代表了应用的数据,视图负责渲染UI并与模型交互,而路由器则管理导航和URL。在"HelloWorld"示例中,可能有一个简单的模型表示"消息",一个视图用于显示这些消息,以及一个路由器来处理页面的加载和导航。 为了...

    软件工程师_经典收藏50个jQueryMobile开发技巧集萃.docx

    7. **集成Google Analytics**:学习如何将Google Analytics与jQuery Mobile整合,追踪和分析用户行为。 8. **AJAX和PHP表单提交**:通过AJAX和PHP处理jQuery Mobile表单提交,实现无刷新的数据交互。 9. **移动...

    BackbonePhpRequire:使用主干和 Require.js 的基本 php 模型

    Backbone模型可以通过Ajax请求与PHP接口进行通信。以下是一个简单的例子: ```javascript // model/User.js define(['backbone'], function(Backbone) { var User = Backbone.Model.extend({ urlRoot: 'api/users...

    php 输入输出流详解及示例代码

    在PHP编程中,输入输出流(Input/Output Stream)是一个重要的概念,特别是在处理网络通信,如HTTP协议交互时。本文将深入探讨PHP的输入输出流,特别是如何在PHP中接收和发送数据,以及如何处理POST请求和不同类型的...

    软件工程师-经典收藏50个jQueryMobile开发技巧集萃.docx

    8. **AJAX与PHP表单提交**:了解如何通过AJAX和PHP处理jQuery Mobile表单的提交,实现无刷新的数据交互。 9. **移动WordPress主题开发**:使用jQuery Mobile创建针对移动设备优化的WordPress主题,提升移动端用户的...

    前端todomvc框架

    - **php中文网免费下载站.txt、php中文网下载站.url**: 这两个文件可能是提供下载资源的站点信息,与TodoMVC框架本身关系不大,但可能表明这个项目是从php中文网获取的。 - **bower_components**: Bower是前端包...

    21、前端开发工程师【10年】简历模版.docx

    - **Node.js与PHP**: 虽然不是主要工作内容,但简历中提到对这些后端技术有所了解,可能在某些项目中进行了前后端交互或服务器端脚本的编写。 - **PLC工程师经历**:在早期的职业生涯中,他还担任过PLC工程师,对...

    JQUERY后台框架/后台界面

    例如,Backbone.js、AngularJS(现在是Angular)或Vue.js都是基于jQuery的前端框架,它们在jQuery的基础上提供了更强大的状态管理和组件化能力。 至于"dwz-demo",它可能是DWZ(Dynamic Web Zone)框架的一个演示。...

    50个最值得收藏的jQuery Mobile开发技巧

    这里提到的例子是将Google Analytics与jQuery Mobile整合,这可以帮助开发者理解用户如何与应用交互,并对应用进行优化。 在表单提交方面,学习如何通过AJAX和PHP进行表单数据的提交而不离开当前页面,对于提高用户...

Global site tag (gtag.js) - Google Analytics