资讯专栏INFORMATION COLUMN

Angular4 反向代理Details

用户84 / 2713人阅读

摘要:设置文件这里是前台调用后端接口时做的代理标识注意部分的配置,如果没有这部分的配置,那在发送请求的时候,实际请求的地址将会是。设置的这里的表示代理标识实际的访问应该是设置文件再重新启动一下项目,应该就能启用反向代理了。

1. 设置proxy.config.json文件
{
  "/api": {    //这里是前台调用后端接口时做的代理标识
    "target": "localhost:3100",
    "logLevel": "debug",
    "secure": false,
    "changeOrigin": true,
    "pathRewrite": {
      "^/api": ""
    }
  }
}

注意:pathRewrite 部分的配置,"pathRewrite": {"^/api": ""} 如果没有这部分的配置,那在发送请求的时候,实际请求的地址将会是http://localhost:3100/api/actionapi/。相较于真实url,会多出/api这一部分。

2. 设置service的url
//这里的api表示代理标识
//实际的访问url应该是:http://localhost:3100/actionapi/
const wcfPath = "/api/actionapi/";
3. 设置package.json文件
"scripts": {
    "ng": "ng",
    "build": "ng build --prod --aot --build-optimizer",
    "start:dev": "ng serve --proxy-config proxy.conf.json --open",
    "start:aot": "ng serve --prod --aot --proxy-config proxy.conf.json --open",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  }

再重新npm run start:dev启动一下项目,应该就能启用angular反向代理了。

**顺便再补充一下webpackangularproxy地址:
https://webpack.js.org/configuration/dev-server/#devserver-proxy
https://github.com/angular/angular-cli/wiki/stories-proxy**

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107783.html

相关文章

  • Nginx配置和switchhosts工具的使用

    摘要:注意后端服务器地址也要带上端口号。后面同样可以配置多个域名,需要在配置,如下为配置后端服务自定义域名这里我附上我参考的博文地址 首先,了解一下,如果不采用nginx配置代理,需要在config目录下的index.js文件中配置代理服务,配置如下,以某个项目为例: proxyTable : { /gateway: { ...

    Magicer 评论0 收藏0
  • 004. 前端跨域资源请求: JSONP/CORS/反向代理

    摘要:同源策略浏览器的一个安全功能,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源。不受同源策略限制的跨域资源的引入是允许的页面中的链接,重定向以及表单提交是不会受到同源策略限制的。1.什么是跨域资源请求? https://www.cnblogs.com/niuli1987/p/10252214.html 同源: 如果两个页面的协议,端口(如果有指定)和域名都相同,则两个页面具有相...

    番茄西红柿 评论0 收藏0
  • 使用Angular4动画为页面添彩

    摘要:使用组件将根据视口放置,并滑过页面。这意味着我们不能使用状态来对路由组件进行样式,因为这样可以将样式应用于父结点我们的示例中的主元素,而不是路由组件。 原文:Angular — Supercharge your Router transitions using new animation features (v4.3+) 首先我们看一下效果展示的demo Basic Variation...

    jay_tian 评论0 收藏0

发表评论

0条评论

用户84

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<