MEAN应用中res.redirect()跨域失效问题求助（Angular 5）

嘿，我一眼就看出问题出在哪了——你用错方式啦！

错误根源分析 #

你现在是用this.http.get()去请求https://www.google.com.ar/，这是在尝试获取这个外部网站的内容，而不是做页面跳转。浏览器的同源策略会阻止这种跨域请求，除非目标服务器（也就是谷歌）主动配置了Access-Control-Allow-Origin头允许你的http://localhost:3000访问，但显然谷歌不会给个人本地站点开这个权限，所以必然会报CORS错误。

而且你配置的CORS是针对自己的MEAN后端API的（比如你代码里的/api/producto），这个配置只能让浏览器允许你的前端请求自己的后端接口，和请求第三方外部网站完全没关系哦。

正确的外部URL重定向方法 #

你要的是页面跳转，根本不需要用Angular的HttpClient，直接用下面这些方法就行：

方法1：原生JavaScript最直接

在你需要跳转的地方（比如/api/producto请求成功的回调里）写：

window.location.href = 'https://www.google.com.ar/';

方法2：Angular风格的方式（注入Document服务）

如果你想更贴合Angular的最佳实践，可以用DOCUMENT服务：

1. 先在组件里导入依赖：

import { Inject } from '@angular/core';
import { DOCUMENT } from '@angular/common';

2. 在构造函数注入：

constructor(@Inject(DOCUMENT) private document: Document) {}

3. 执行跳转：

this.document.location.href = 'https://www.google.com.ar/';

结合你的现有代码示例 #

比如你原本的/api/producto请求，想在拿到数据后跳转到外部URL，正确的代码应该是这样：

this.http.get('/api/producto').subscribe(
  data => {
    // 拿到产品数据后执行外部跳转
    window.location.href = 'https://www.google.com.ar/';
  },
  error => {
    console.error('请求产品API失败:', error);
  }
);

这样就完全不会触发CORS错误啦，因为你不是在请求外部网站的内容，只是让浏览器跳转到那个URL而已。

内容的提问来源于stack exchange，提问作者NGOD