相关疑难解决方法(0)

如何在任何地方使用Cors来反向代理并添加CORS头

我已经读了两个小时这个反向代理的文档来添加CORS头文件,我无法使用.能否请您帮助一个简单的例子如何使用它.

CORS任何地方

我在javascript中尝试过这个例子

(function() {
var cors_api_host = 'cors-anywhere.herokuapp.com';
var cors_api_url = 'https://' + cors_api_host + '/';
var slice = [].slice;
var origin = window.location.protocol + '//' + window.location.host;
var open = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function() {
    var args = slice.call(arguments);
    var targetOrigin = /^https?:\/\/([^\/]+)/i.exec(args[1]);
    if (targetOrigin && targetOrigin[0].toLowerCase() !== origin &&
        targetOrigin[1] !== cors_api_host) {
        args[1] = cors_api_url + args[1];
    }
    return open.apply(this, args);
};
})();
Run Code Online (Sandbox Code Playgroud)

我真的不明白我是否需要node.js或究竟是什么

javascript cors cors-anywhere

9
推荐指数
3
解决办法
3万
查看次数

在 NestJs 中启用 Cors

我想使用 NestJs api,但在每个 api 中都收到相同的错误消息fetch

Access to fetch at 'http://localhost:3000/articles' from origin 'http://localhost:4200' has been blocked by CORS policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.
If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Run Code Online (Sandbox Code Playgroud)

我的前端是一个 Angular,我有一个简单的fetch

fetch('http://localhost:3000/articles')
    .then((res) => {
      console.log(res);
    });
Run Code Online (Sandbox Code Playgroud)

我在 NestJs 中尝试了这些选项 - 但它们似乎都不起作用:

尝试 A

async function bootstrap() {
  const app = await NestFactory.create(AppModule);
  app.enableCors({
    origin: true,
    methods: …
Run Code Online (Sandbox Code Playgroud)

cors nestjs

6
推荐指数
1
解决办法
6522
查看次数

CORS 以某种方式阻止我的 Angular 和 Nestjs 应用程序进行通信

我正在使用 Angular 和 NestJS 构建一个应用程序,并使用 NGXS 进行状态管理。我完成了所有设置并为我的应用程序提供服务,并在控制台中收到此错误。

从源“ http://localhost:4200 ”访问“localhost:333/api/product-index”处的 XMLHttpRequest已被 CORS 策略阻止:跨源请求仅支持协议方案:http、data、chrome、chrome - 扩展名,https。

经过一番研究后,我发现这篇文章解释了如何在我们的 Angular 应用程序中处理 CORS,在检查了它告诉我们要修改的文件后,我发现这些设置已经存在。我对它告诉我们要更新的文件感到困惑server.js,在研究了文件中通常执行的操作后,server.js我得出的结论是,在 Angular 中它一定是该main.ts文件,但我不知道是否需要对文件进行main.ts修改在我的 Nest 应用程序或我的 Angular 应用程序中。nrwl nx我也在我的应用程序中使用monorepo。

这是proxy.conf.json我的角度应用程序中的文件

{
    "/cre8or-maker-backend": {
      "target": "http://localhost:3333",
      "secure": false,
      "logLevel": "debug"
    }
  }
Run Code Online (Sandbox Code Playgroud)

这是我文件中对象serve的对象。architectangular.json

"serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "cre8or-maker:build",
            "proxyConfig": "apps/cre8or-maker/proxy.conf.json"
          }
Run Code Online (Sandbox Code Playgroud)

正如我之前所说,这些设置已经存在于这些文件中,对我来说唯一新鲜的是关于修改文件的部分server.js,我假设是main.tsAngular 世界中的文件。这是我的main.ts文件的样子

nest main.ts

import { …
Run Code Online (Sandbox Code Playgroud)

typescript angular nestjs ngxs

6
推荐指数
2
解决办法
7958
查看次数

标签 统计

cors ×2

nestjs ×2

angular ×1

cors-anywhere ×1

javascript ×1

ngxs ×1

typescript ×1