get方式请求数据:

   var theurl = "http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html";

myUrl = encodeURIComponent(theurl);

url = "http://127.0.0.1:3000?myUrl=" + myUrl;

$http({

url: url,

method: "get"

}).then(function(res) {

console.log(res);

}, function(err) {

console.log(err);

});

 

通过jsonp请求数据,通过动态创建script标签来访问服务器,把回调函数名作为参数传递给服务器 服务器请求得到数据以后,把数据放回到回调函数中 前端通过回调函数的实现部分,得到数据。

var script = document.createElement("script");

url = url + "&callback=xxx";

script.src = url;

document.documentElement.appendChild(script);

angular的$http服务中,callback参数必须写成JSON_CALLBACK,意思是告诉angular自己去创建一个回调函数

var myUrl = "http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html";

$http({

  method: "jsonp",

  url: "http://localhost:3000?myUrl=" + myUrl + "&callback=JSON_CALLBACK"

})

.then(function(res) {

console.log(res);

},

      function(err) {

console.log(err);

}

  );

$http的post请求

$http({

method: "post",

url: "http://localhost:3000",

    //post请求需要加这个请求头设置类型

headers: {

"Content-Type": "application/x-www-form-urlencoded"

},

data: {

myUrl: "http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html"

}

})

.then(function(res) {

console.log(res);

},

function(err) {

console.log(err);

});

promise请求

var promise = $http({

method: "post",

url: "http://localhost:3000",

headers: {

"Content-Type": "application/x-www-form-urlencoded"

},

data: {

myUrl: "http://c.m.163.com/nc/article/headline/T1348647853363/0-140.html"}

});

promise.success(function(res) {

console.log(res);

});

promise.error(function(err) {

console.log(err);

});

//或者

promise.then(function(res) {

console.log(res);

}, function(err) {

console.log(err);

})

NodeJS服务器代码:

get请求对应的服务器代码:

var http = require("http");
var url = require("url");
var qs = require("querystring");http.createServer(function(req, res) {res.setHeader("Access-Control-Allow-Origin", "*");//        console.log(req.url);//        对请求对象的url进行解析,拿到查询参数字符串var query = url.parse(req.url).query;//        console.log(query);//把key=value字符串转变成对象的方式 方便获取var queryObj = qs.parse(query);//用来接收数据的变量var result = "";//        console.log(queryObj.myUrl);http.get(queryObj.myUrl, function(request) {request.on("data", function(data) {result += data;});request.on("end", function() {if(queryObj.callback) {var fn = queryObj.callback;var resultStr = JSON.stringify(result);var str = fn + "(" + resultStr + ")";res.end(str);} elseres.end(result);});}).on("error", function(err) {res.end(err);})//        res.end("hello sb");
    }).listen(3000, function() {console.log("服务器启动成功,监听3000...");});

View Code

post请求对应的服务器代码:

var http = require("http");
var url = require("url");
var qs = require("querystring");http.createServer(function(req, res) {res.setHeader("Access-Control-Allow-Origin", "*");//设置编码格式req.setEncoding("utf8");//用来接收数据var postData = "";//监听:如果前端有数据发送过来req.addListener("data", function(data) {postData += data;});//前端数据传输完毕req.addListener("end", function() {//把接收到的data数据转换成对象方式var postDataObj = JSON.parse(postData);var myUrl = postDataObj.myUrl;//用来接收网易数据的变量var resultData = "";http.get(myUrl, function(request) {request.on("data", function(data) {resultData += data;});request.on("end", function() {res.end(resultData);})}).on("error", function(err) {console.log(err);});});}).listen(3000, function() {console.log("3000端口正在监听中...")});

View Code

转载于:https://www.cnblogs.com/xf110/p/6759499.html

get和post方式请求数据,jsonp相关推荐

  1. get 和post 方式请求数据

    get 和post 方式请求数据的时候,只想说一句话,别忘了对NSMutableData *a 也就是用来接受数据的中间实例进行初始化........ get 异步请求网络数据的步骤 NSURL *u ...

  2. HTTP Get POST方式请求数据

    /// <summary>/// HTTP GET方式请求数据./// </summary>/// <param name="url">URL. ...

  3. GET方式请求参数中文乱码问题 [JavaWeb][Servlet]

    请求参数中文乱码问题(GET) 同样的我们要解决GET方式下的请求参数中文乱码问题,那么我们首先要知道GET请求方式之下为什么中文数据就会出现乱码? 因为我们GET方式之下的请求参数是在请求行中,是紧 ...

  4. ajax背景、ajax对象、ajax状态、ajax与http、ajax请求数据接口、同步与异步、ajax请求XML数据、封装ajax函数、artTemplate简介、同源策略和跨域请求、JSONP

    AJAX简介: ajax背景: 1.AJAX(Asynchronous JavaScript And Xml)异步的 JavaScript 和 XML:ajax是浏览器提供的一套API,最早出现在谷歌 ...

  5. vue三种ajax请求方式,vue请求数据的三种方式

    请求数据的方式: vue-resource 官方提供的 vue的一个插件 axios fetch-jsonp 一,vue-resource请求数据 介绍:vue-resource请求数据方式是官方提供 ...

  6. C++通过HTTP请求Get或Post方式请求Json数据

    转载:C++通过HTTP请求Get或Post方式请求Json数据 最近在工作中,由于合作商只提供uRL,我这边需要通过HTTP请求Get或Post方式请求Json数据,然后解析JSON格式,解析jso ...

  7. vue 请求数据方式

    vue 请求数据方式 Vue 请求数据方式有:vue-resource.axios.fetchJsonp三种.其中,vue-resource 是 Vue官方提供的插件,axios 与 fetchJso ...

  8. Controller中请求数据的方式

    1.路径变量 url中定义(变量名)作为占位符,使用@PathVariable对应变量 2.@RequestParam 可以获取url中的请求数据 请求数据类型为x-www-from-urlencod ...

  9. [JAVA EE]ajax 方式提交数据

    前端界面:Form表单 前端数据提交:使用 ajax 方式 ( 基于jquery ) 后台代码: TestController.java @Controller public class TestCo ...

最新文章

  1. docker安装kafka消息队列
  2. SAP Cloud for Customer(C4C)和微软Outlook的集成
  3. Val编程-文本操作
  4. Java 产生随机数:Java 中产生随机数的方法及应用汇总
  5. 将SublimeText加入右键菜单
  6. idea启动tomcat出现‘D:\Programfiles‘ 不是内部或外部命令,也不是可运行的程序
  7. 汇编语言 王爽 第四版 第二章 检测点2.1
  8. Java实现简单的文本编辑器
  9. 实现计算机考试和vb交换的,2012江苏省计算机二级VB试题库及答案
  10. python谐音梗_谐音梗生成器
  11. “今日校园” App 用户体验分析
  12. 有线网络、无线网络、蜂窝网络、移动网络到底是啥?
  13. web开发中实现页面记忆的几种方式
  14. 如何正确、高效地进行论文阅读和批判性思考
  15. 【Java学习】Clone 分析
  16. FOJ 1921 栀子花开 线段树裸题
  17. 持续集成在Hexo自动化部署上的实践
  18. 7.28 C幸运数字
  19. TWS耳机OVP芯片,过压保护电路芯片
  20. 2022.12.29

热门文章

  1. Thinkphp 实现上一篇与下一篇的方法
  2. 学java教程之面向对象(四)
  3. nagios   IO监控 Error executing iostat command
  4. awk学习笔记八-Actions
  5. 《Solution-Centric Organization》解决方案导向型组织 节选 IV
  6. 用Python编写干净 可测试 高质量的代码
  7. Linux下发生段错误时如何产生core文件-转
  8. 一步一步手绘Spring IOC运行时序图二(基于XML的IOC容器初始化)
  9. 蓝桥杯 ADV-72 算法提高 一元一次方程
  10. 锁定Mac的键盘:连击5次option键