响应中的“Access-Control-Allow-Credentials”标头为“”,必须为“true”

2024-04-27

我在后端使用 Node、Express,在客户端使用 Angular4,这给了我以下错误:

XMLHttpRequest 无法加载http://localhost:4876/登录/检查 http://localhost:4876/login/check。对预检请求的响应未通过访问控制检查:响应中“Access-Control-Allow-Credentials”标头的值为“”,当请求的凭据模式为“include”时,该值必须为“true”。起源 'http://本地主机:4200 http://localhost:4200' 因此不允许访问。 XMLHttpRequest 发起的请求的凭据模式由 withCredentials 属性控制。

登录/查询API实现如下:

router.get('/login/check', (req: any, res: any) => {
        let api = new ApiConnection(req, res);
        let accessCard: IAccessCard = api.getContent(Auth.ACCESS_CARD_KEY);
        if(!Auth.isValid(accessCard))
            return api.response.error();

        ChatBox.auth.isExpired(accessCard, function (err:any, isExpired: boolean) {
            if (err) return api.response.error();
            if(!isExpired) {
                api.cookie("AccessCard", accessCard);
                api.response.success(accessCard);
            }
            else {
                api.response.error();
            }
        })
    });

路由器定义在哪里const router = require('express').Router()

header和cors的中间件设置如下:

export class Application {
    private app:any = express();
    constructor() {
        this.setCors();
        this.setHeaders();
    }

    public getApp():any {
        return this.app;
    }

    private setCors(){
        let whitelist = ['http://localhost:4200','http://localhost:80'];
        let corsOptions = {
            origin: (origin:any, callback:any)=>{
                if (whitelist.indexOf(origin) !== -1) {
                    callback(null, true)
                } else {
                    callback(new Error('Not allowed by CORS'))
                }
            }
        }
        this.app.use(cors(corsOptions));
    }



    private setHeaders() {
        this.app.use(function (req:any, res:any, next: any) {

            // Website you wish to allow to connect
            //res.setHeader('Access-Control-Allow-Origin', Config.WEB_APP_HOST);
            res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');

            // Request methods you wish to allow
            res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');

            // Request headers you wish to allow
            res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With, content-type');

            // Set to true if you need the website to include cookies in the requests sent
            // to the API (e.g. in case you use sessions)
            res.setHeader('Access-Control-Allow-Credentials', true);

            // Pass to next layer of middleware
            next();
        });
    }
}

在客户端,我使用 Api 如下:

public startSession(callback: (status: boolean, result: any) => void ) {
    let self: ChatBox = this;
    /**
     * @res.result: IAccessCard
     */
    this.mApiConnection.get(Api.root+'/login/check', (res: any) => {
      if (res.status == ResponseStatus.SUCCESS) {
        self.mStorage.storeAccessCard(res.result);
        self.loadAccount(res.result);
      }
      callback(res.status, res.result);
    })
  }

在 corsOptions 中设置 cors 时,我添加了值凭证 true ,其工作原理如下:

private setCors(){
        let whitelist = ['http://localhost:4200','http://localhost:80'];
        let corsOptions = {
            origin: (origin:any, callback:any)=>{
                if (whitelist.indexOf(origin) !== -1) {
                    callback(null, true)
                } else {
                    callback(new Error('Not allowed by CORS'))
                }
            },credentials: true
        }
        this.app.use(cors(corsOptions));
    }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

响应中的“Access-Control-Allow-Credentials”标头为“”,必须为“true” 的相关文章

  • 处理量角器中的未知错误

    我有一个protractor通过配置多个浏览器进行设置multiCapabilities 在 browserstack 上运行测试 我的主要量角器规格 测试之一包含以下内容afterEach block afterEach function
  • (无限?)JavaScript 代码中的循环

    我有以下 JavaScript 代码来在网站上 显示 XML function createChild node tabindex var child node childNodes var r var tabs for i 0 i
  • 未捕获的类型错误:属性...不是函数 - 页面加载后

    我正在使用对外部 API 的跨域 Ajax 请求 有时它会失败 并显示控制台消息 Uncaught TypeError Property photos of object object DOMWindow is not a function
  • 在高图表中突出显示一系列条形图中的一个条形图?

    我有一个图表 显示堆叠和分组的条形图 类似于这个演示 http www highcharts com demo column stacked and grouped 有没有办法从 JavaScript 代码中使系列之一中的其中一个栏突出显示
  • jquery javascript 在 codeigniter 中不起作用

    大家好 感恩节快乐 我在将此脚本包含在 codeigniter 中时遇到一些问题
  • JavaScript 中最大长度的正则表达式

    如何限制与正则表达式匹配的字符串的长度 我假设var sixCharsRegEx 6 7 只匹配长度为 6 或 7 的字符串 but no http jsfiddle net FEXbB http jsfiddle net FEXbB 我缺
  • 如何在 Node.js 中将 HTML 转换为图像

    我需要在 Node 服务器上将 HTML 模板转换为图像 服务器将以字符串形式接收 HTML 我尝试过 PhantomJS 使用一个名为 Webshot 的库 但它不能很好地与 Flex 框和现代 CSS 配合使用 我尝试使用 Chrome
  • 创建地图后向 Google 地图 v3 添加标记

    我对使用 Google Maps API 比较陌生 现在我正在开发一个项目 用户可以选择各种搜索过滤器并查看结果自动显示在地图上 而无需重新加载页面 到目前为止 我的方法是创建一个控制地图的 Javascript 对象 以便我可以按照我的意
  • Angular 7 将文件内容发布为 multipart/form-data

    我在字符串变量中提供了要发布的内容 我想使用 import HttpClient from angular common http 为了达到与以下相同的效果 curl F email protected cdn cgi l email pr
  • 规则和夏令时

    我在用着rrule https github com jakubroztocil rrule在我的数据库中创建和存储事件 一切正常 直到我发现我的重复事件与 3 月 31 日之后有一个小时的差异 在法国 这一天我们进行夏令时更改 实际上 我
  • jQuery:评估 ajax 响应中的脚本

    来自我的 web 应用程序的 XML 响应既有要添加到页面的 HTML 也有要运行的脚本 我正在尝试从我的网络应用程序发回 XML 例如
  • Firefox:按下鼠标按钮时鼠标悬停不起作用

    这是我想做的 https gfycat com ValidEmbarrassedHochstettersfrog https gfycat com ValidEmbarrassedHochstettersfrog 我想强调一些 td 对象在
  • 更改 jQuery 中链接的标题

    我有一个 id 为 helpTopicAnchorId 的链接 我想在 jQuery 中更改其文本 我该怎么做呢 helpTopicAnchorId text newText P S the jQuery 文档 http docs jque
  • 现已弃用使用 Google Places API 获取多种类型

    谷歌最近宣布 自 2016 年 2 月 16 日起 types 参数已被弃用 取而代之的是新的类型参数 每个搜索请求仅支持一种类型 我的问题是 现在有什么方法 不使用已弃用的参数 从单个 API 调用中获取多个地点类型吗 谢谢 None
  • 具有异步管道多个条件的 Angular *ngIf 变量

    有一个关于在 Angular 中使用 ngIf 的很好的文档 https angular io api common NgIf https angular io api common NgIf但是 是否可以有 ngIf 异步变量并对其进行多
  • ASP.NET 中的 JavaScript 事件处理程序

    我有以下 iframe 控件 旨在成为类似 facebook 的按钮 iframe gt 我在上面定义了 javascript 函数 如下所示
  • 让 hashchange 事件在所有浏览器(包括 IE7)中工作

    我有一些代码 由另一位开发人员编写 在 WordPress 内部进行 AJAX 页面加载 例如 没有页面重新加载 当您单击导航项时 AJAX 会刷新主要内容区域 我的问题是它在 IE7 中被破坏了 我不知道从哪里开始调试 最初的开场白是 v
  • 用圆形雷达数学方法表示点

    我正在编写一个简单的应用程序 它可以向您显示您周围的朋友 但不是在法线地图中 而是在像 UI 这样的真正圆形雷达上 https i stack imgur com Au3IP png https i stack imgur com Au3I
  • vuejs2复制剪贴板问题

    我正在尝试使用https alligator io vuejs vue clipboard copy https alligator io vuejs vue clipboard copy 对于 Vue js 中的复制剪贴板功能 它对于字符
  • 使用node.js/Express从HTTP重定向到HTTPS

    有什么方法可以更改我的 Web 应用程序以侦听 HTTPS 而不是 HTTP 我正在使用node js express 我需要它来侦听 HTTPS 因为我正在使用地理定位 而 Chrome 不再支持地理定位 除非从 HTTPS 等安全上下文

随机推荐