ionic项目之上传下载数据

一,首先是上传数据

记得在angularjs的controller中注入$http依赖

var data = {id: $scope.task_id,
         	groupId: $scope.task_groupid,
         	importance: $scope.priority_level,
         	classname:$scope.classname,
         	title: $scope.task_title,
         	date: $scope.todo_date,
         	detail: $scope.task_detail,
         	images:$scope.images_list,
         	name:$scope.name,
         	record:$scope.recordPath,
         	donedate:$scope.done_date}

         $http({
         	method: 'POST',
         	url: 'http://localhost:3000',
         	params:{
         		'require': data
         	}

         }).success(function(data,status,headers,config){

         }).error(function(data,status,headers,config){

         });

$http方法中的data参数,服务端没有接收成功

$http方法中的params参数,服务端接收成功

服务端接收方法是 url.parse(req.url, true).query.params

(params即是加在url?后的参数)

二,然后是下载数据

    //刷新
    $scope.refresh = function(){
    	$http.get("http://localhost:3000/refresh")
    	.success(function(data, status, headers, config) {
        // this callback will be called asynchronously
        // when the response is available

        alert("success");
        alert("["+data.substring(0,data.lastIndexOf(","))+"]");
        TodoListService.deleteAndAddTask(JSON.parse("["+data.substring(0,data.lastIndexOf(","))+"]"));
        TodoListService.findByGroupId($stateParams.groupId).then(function(todolists) {

			$scope.todolists = todolists; //对应类别的所有数据list
		});

        })
    	.error(function(data, status, headers, config) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
        alert("error "+data);

        });

//      .success(function(response) {
//
//          console.log(response);
//          alert(response);
//      });

    }

回调的success方法中返回的data数据,即为服务器response给客户端的数据

注意:返回的json字符串要保证符合json格式(一开始最外层没加中括号就会报错)

三,服务端代码

var http = require('http');
var url = require('url');
var util = require('util');
var fs = require('fs'); 

http.createServer(function(req, res){
	var urldata = req.url+"";
    var require;
	console.log('connet');
	if(urldata.substring(1) == "refresh")
	{
       console.log("refresh");
	   require = "";
	   fs.readFile('writefile.txt','utf8', function(err, data) {
	    if (err) {
		  console.error(err);
	    } else {
		  console.log(data); 

          res.end(data+"");
	    }
       });

	}
	else
	{
	   console.log("add");
       require = url.parse(req.url, true).query.require+",";
	   fs.open('writefile.txt', 'a', function opend(err, fd) {
	   if(err) {
		   console.error(err);
		   return;
	   }
	   var writeBuffer = new Buffer(require),
		   bufferPosition = 0,
		   bufferLength = writeBuffer.length,
		   filePosition = null;
	   fs.write(fd,
		     writeBuffer,
		     bufferPosition,
		     bufferLength,
		     filePosition,
		     function wrote(err,written){
	           if(err){throw err;}
			   //console.log(err);
			 });
       });
	}

}).listen(3000);

还有个问题

由于ionic有自己的服务用于启动项目,它启动了http://localhost:8100 的服务,而ionic项目访问服务器需要另外的端口

所以在电脑浏览器调试时会报错

 XMLHttpRequest cannot load http://localhost:3000/refresh. No ‘Access-Control-Allow-Origin‘ header is present on the requested resource. Origin ‘http://localhost:8100‘ is therefore not allowed
access.

需要让浏览器忽略跨域问题就行了,可以干脆关闭所有安全策略,当然浏览器会提示你稳定性和安全性降低

如果不想每次启动都用命令行,也可以把启动参数添加到浏览器快捷方式里:右键点击Chrome图标,在“快捷方法”标签页的“目标”一栏添加启动参数到末尾即可(先留一个空格)

项目地址(包括ionic项目和简易node服务器代码,服务器代码只用到了server.js和writefile.txt)

http://download.csdn.net/detail/superjunjin/8487079

原项目来自于http://rensanning.iteye.com/blog/2072034

时间: 2024-11-04 03:31:47

ionic项目之上传下载数据的相关文章

[转]ionic项目之上传下载数据

本文转自:http://blog.csdn.net/superjunjin/article/details/44158567 一,首先是上传数据 记得在angularjs的controller中注入$http依赖 [javascript] view plaincopyprint? var data = {id: $scope.task_id, groupId: $scope.task_groupid, importance: $scope.priority_level, classname:$s

使用cmd命令行方式登录ftp上传下载数据

部分用户在使用ftp工具登录空间上传下载过程中经常会遇到各种问题,如主动模式,被动模式,以及其他导致无法登陆ftp .上传数据.下载数据的问题,这时候不妨使用一下命令行方式.命令行下可以避免很多由于ftp工具配置导致的问题,而且这种方式下下载数据的速率明显比使用ftp工具更快.下面就来看一下如何使用ftp 命令进行简单的上传下载数据.1.登录ftp在“开始”->”运行”中输入“cmd”,进入cmd命令行模式,接下来输入:ftp 118.193.22.151输入自己的网站ip地址,接下来会提示输入

20160421javaweb之上传下载小案例---网盘

一.建立数据库: CREATE TABLE IF NOT EXISTS `netdisk` ( `id` int(10) NOT NULL AUTO_INCREMENT, `uuidname` varchar(255) NOT NULL, `realname` varchar(255) NOT NULL, `savepath` varchar(255) NOT NULL, `uploadtime` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON U

SecureCRT上传下载数据的方法

转自http://blog.sina.com.cn/s/blog_4af3b94f0101kfw5.html ———————————————————————————————————————————————————— SecureCRT这款SSH客户端软件同时具备了终端仿真器和文件传输功能.比ftp命令方便多了,而且服务器不用再开FTP服务了.rz,sz是便是Linux/Unix同Windows进行ZModem文件传输的命令行工具. windows端需要支持ZModem的telnet/ssh客户端

微信小程序之上传下载交互api

wx.request(OBJECT) OBJECT参数说明: 参数名 类型 必填 说明 url String 是 开发者服务器接口地址 data Object.String 否 请求的参数 header Object 否 设置请求的 header , header 中不能设置 Referer method String 否 默认为 GET,有效值:OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT dataType String 否 默认为

Struts2之上传下载

单文件上传 上传页面 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd&qu

开源项目OkHttpPlus——支持GET、POST、UI线程回调、JSON格式解析、链式调用、文件上传下载

OkHttpPlus介绍 项目地址:https://github.com/ZhaoKaiQiang/OkHttpPlus 主要功能:OkHttp封装,支持GET.POST.UI线程回调.JSON格式解析.链式调用.小文件上传下载及进度监听等功能 为什么要写这么一个库呢? 首先,是因为OkHttp在4.4之后已经作为底层的Http实现了,所以OkHttp这个库很强大,值得我们学习. 其次,在我看来,OkHttp使用起来不如Volley方便,OkHttp的回调都是在工作线程,所以如果在回调里面操作V

ionic项目之图片的选择与上传

由于ionic框架是基于angularJS的,开发hybrid app混合应用的,但angularJS本身没有太多对移动设备硬件的支持,所以找到两种方法解决这个问题! 一,ngCordova插件:ngCordova是在Cordova Api基础上封装的一系列开源的AngularJs服务和扩展,让开发者可以方便的在HybridApp开发中调用移动设备的功能,即可以在AngularJs代码中访问设备的Api 二,html5plus:最近比较火的一个东西,也是为了解决有关html5移动app去调用移动

重新想象 Windows 8.1 Store Apps (89) - 通信的新特性: 下载数据, 上传数据, 上传文件

原文:重新想象 Windows 8.1 Store Apps (89) - 通信的新特性: 下载数据, 上传数据, 上传文件 [源码下载] 作者:webabcd 介绍重新想象 Windows 8.1 Store Apps 之通信的新特性 下载数据(显示下载进度,将下载数据保存到本地) 上传数据(显示上传进度) 上传文件 示例HTTP 服务端WebServer/HttpDemo.aspx.cs /* * 用于响应 http 请求 */ using System; using System.IO;