关于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的IE和Firefox兼容性汇编
Jul 01 Javascript
jquery 选择器部分整理
Oct 28 Javascript
js导出txt示例代码
Jan 14 Javascript
简单的ajax连接库分享(不用jquery的ajax)
Jan 19 Javascript
Bootstrap每天必学之日期控制
Mar 07 Javascript
Javascript中字符串replace方法的第二个参数探究
Dec 05 Javascript
如何在AngularJs中调用第三方插件库
May 21 Javascript
React Native 环境搭建的教程
Aug 19 Javascript
微信小程序带动画弹窗组件使用方法详解
Nov 27 Javascript
JavaScript创建、读取和删除cookie
Sep 03 Javascript
vue 项目中当访问路由不存在的时候默认访问404页面操作
Aug 31 Javascript
vue element-ui中table合计指定列求和实例
Nov 02 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自动反斜杠的函数代码
2010/01/05 PHP
php下使用curl模拟用户登陆的代码
2010/09/10 PHP
PHP加密解密函数详解
2015/10/28 PHP
JavaScript的单例模式 (singleton in Javascript)
2010/06/11 Javascript
40款非常棒的jQuery 插件和制作教程(系列二)
2011/11/02 Javascript
基于jQuery的简单九宫格实现代码
2012/08/09 Javascript
JavaScript实现的经典文件树菜单效果
2015/09/08 Javascript
JS组件系列之Bootstrap Icon图标选择组件
2016/01/28 Javascript
jQuery模拟淘宝购物车功能
2017/02/27 Javascript
javascript中toFixed()四舍五入使用方法详解
2018/09/28 Javascript
Vertx基于EventBus发送接受自定义对象
2020/11/16 Javascript
Javascript实现关闭广告效果
2021/01/29 Javascript
编写Python脚本批量下载DesktopNexus壁纸的教程
2015/05/06 Python
python批量提取word内信息
2015/08/09 Python
Python使用dis模块把Python反编译为字节码的用法详解
2016/06/14 Python
Python日志模块logging基本用法分析
2018/08/23 Python
python使用numpy读取、保存txt数据的实例
2018/10/14 Python
Pandas之Fillna填充缺失数据的方法
2019/06/25 Python
python for循环remove同一个list过程解析
2019/08/14 Python
python如何调用java类
2020/07/05 Python
openCV提取图像中的矩形区域
2020/07/21 Python
python代码能做成软件吗
2020/07/24 Python
如何使用 Python 读取文件和照片的创建日期
2020/09/05 Python
Python绘制组合图的示例
2020/09/18 Python
J.Crew官网:美国知名休闲服装品牌
2017/05/19 全球购物
奥地利网上现代灯具和灯饰店:Lampenwelt.at
2018/01/29 全球购物
Expedia韩国官网:亚洲发展最快的在线旅游门户网站
2018/02/26 全球购物
大学自我鉴定范文
2013/12/26 职场文书
会议活动邀请函
2014/01/27 职场文书
公司经理聘任书
2014/03/29 职场文书
说明书范文
2014/05/07 职场文书
信访维稳工作汇报
2014/10/27 职场文书
2016新教师岗前培训心得体会
2016/01/08 职场文书
Python如何导出导入所有依赖包详解
2021/06/08 Python
CentOS下安装Jenkins的完整步骤
2022/04/07 Servers
MySQL 数据表操作
2022/05/04 MySQL