关于Angular2 + node接口调试的解决方案


Posted in Javascript onMay 28, 2017

事情的起因

由于最近在使用Angular + node开发,采取的办法一直都是约定好接口,然后node实现,再编写前端。但是这样有一个很麻烦的问题:编写前端的时候无法调用接口,不能很好地测试,只能一口气写完再编译后放到后端来测试。

经常会因为解决一些小的问题而反复的编译、调试,浪费很多不必要的时间。

解决方案

偶然发现webpack-dev-server可以实现代理请求(把指定的url规则转发到其他地址),所以就试了一下。由于项目使用了Angular-cli构建,并没有webpack配置文件,悲伤。于是又去google上搜索了一圈Angular-cli,找到了Angular-cli实现代理的解决方案。

在项目目录下创建文件proxy.conf.json:

{
 "/api": {

  "target": "http://localhost:3000",

  "secure": false
 }
}

 1、/api为代理规则,因为我接口都是以api开头的,大家可以根据自己的实际情况设置

 2、target为目标服务地址,比如一个get请求的地址为http://localhost:4200/api/cards/all会被代理为

       http://localhost:3000/api/cards/all

       secure为是否开启ssl验证,在这里设置为false

接下来只需要启动node服务,再使用ng serve --proxy-config proxy.conf.json来启动自己的Angular项目就可以完美实现代理了,简直不要太好用,以前的方法简直是蠢爆了!

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家三水点靠木的支持。

Javascript 相关文章推荐
JavaScript中的property和attribute介绍
Dec 26 Javascript
JavaScript高级程序设计 阅读笔记(十七) js事件
Aug 14 Javascript
js闭包实现按秒计数
Apr 23 Javascript
JavaScript实现模仿桌面窗口的方法
Jul 18 Javascript
jQuery实现的左右移动焦点图效果
Jan 14 Javascript
JS三目运算(三元运算)方法详解
Mar 01 Javascript
详解node服务器中打开html文件的两种方法
Sep 18 Javascript
新年快乐! javascript实现超级炫酷的3D烟花特效
Jan 30 Javascript
微信小程序用户授权,以及判断登录是否过期的方法
May 10 Javascript
layui下拉列表select实现可输入查找的方法
Sep 28 Javascript
Element Badge标记的使用方法
Jul 27 Javascript
浅谈javascript如何获取文件后缀名
Aug 07 Javascript
对象不支持indexOf属性或方法的解决方法(必看)
May 28 #Javascript
设置cookie指定时间失效(实例代码)
May 28 #Javascript
Mac系统下Webstorm快捷键整理大全
May 28 #Javascript
获取url中用&隔开的参数实例(分享)
May 28 #Javascript
Javarscript中模块(module)、加载(load)与捆绑(bundle)详解
May 28 #Javascript
js每隔两秒输出数组中的一项(实例)
May 28 #Javascript
javascript 封装Date日期类实例详解
May 28 #Javascript
You might like
php去除换行符的方法小结(PHP_EOL变量的使用)
2013/02/16 PHP
PHP实现把文本中的URL转换为链接的auolink()函数分享
2014/07/29 PHP
WebQQ最新登陆协议的用法
2014/12/22 PHP
php实现无限级分类(递归方法)
2015/08/06 PHP
关于jquery append() html时的小问题的解决方法
2010/12/16 Javascript
js arguments对象应用介绍
2012/11/28 Javascript
javascript实现div的显示和隐藏的小例子
2013/06/25 Javascript
java中String类型变量的赋值问题介绍
2016/03/23 Javascript
javascript的document中的动态添加标签实现方法
2016/10/24 Javascript
详解Vue 实例中的生命周期钩子
2017/03/21 Javascript
javascript实现圣旨卷轴展开效果(代码分享)
2017/03/23 Javascript
angularJS利用ng-repeat遍历二维数组的实例代码
2017/06/03 Javascript
史上最全JavaScript数组去重的十种方法(推荐)
2017/08/17 Javascript
详解React native全局变量的使用(跨组件的通信)
2017/09/07 Javascript
JS实现的计数排序与基数排序算法示例
2017/12/04 Javascript
解决vue-router进行build无法正常显示路由页面的问题
2018/03/06 Javascript
jsonp跨域获取数据的基础教程
2018/07/01 Javascript
基于VUE实现判断设备是PC还是移动端
2020/07/03 Javascript
Python2.x利用commands模块执行Linux shell命令
2016/03/11 Python
AI人工智能 Python实现人机对话
2017/11/13 Python
Python数据结构之图的应用示例
2018/05/11 Python
python正则表达式之对号入座篇
2018/07/24 Python
python使用Plotly绘图工具绘制气泡图
2019/04/01 Python
python正则过滤字母、中文、数字及特殊字符方法详解
2020/02/11 Python
Python实现自动访问网页的例子
2020/02/21 Python
Python SQLAlchemy库的使用方法
2020/10/13 Python
Python paramiko使用方法代码汇总
2020/11/20 Python
用python批量移动文件
2021/01/14 Python
h5实现获取用户地理定位的实例代码
2017/07/17 HTML / CSS
计算机软件个人的自荐信范文
2013/12/01 职场文书
送货司机岗位职责
2013/12/11 职场文书
个人求职信格式范文
2015/03/20 职场文书
2016年母亲节广告语
2016/01/28 职场文书
导游词之山东八仙过海景区
2019/11/11 职场文书
Python3 如何开启自带http服务
2021/05/18 Python
python 对图片进行简单的处理
2021/06/23 Python