【问题标题】:HttpHeaders.applyUpdate 'Cannot read property 'length' of undefined' Angular Universal serverHttpHeaders.applyUpdate'无法读取未定义'Angular Universal服务器的属性'长度'
【发布时间】:2019-01-18 14:09:05
【问题描述】:

我正在尝试将 Angular Universal 与我的项目集成。 在修复了很多错误之后,我很难找到这个。不胜感激。

构建运行良好,但在运行服务器时出现此错误。

收听:http://localhost:8080 错误类型错误:无法读取未定义的属性“长度” 在 HttpHeaders.module.exports.HttpHeaders.applyUpdate (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:127015:27) 在 C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:126986:74 在 Array.forEach () 在 HttpHeaders.module.exports.HttpHeaders.init (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:126986:33) 在 HttpHeaders.module.exports.HttpHeaders.forEach (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:127051:14) 在 Observable._subscribe (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:128261:25) 在 Observable.module.exports.Observable._trySubscribe (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:59642:25) 在 Observable.module.exports.Observable.subscribe (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:59628:22) 在 scheduleTask (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:168196:32) 在 Observable._subscribe (C:\Users\Frederico\Documents\Projects\beatstars-marketplace-v2\dist\server.js:168234:13)

我正在使用最新版本的 Angular 6。这是我的 package.json。

npm run build:prod - 用于构建 npm run server - 服务

 {
   "name": "project-name",
   "version": "0.1.105",
   "license": "MIT",
   "scripts": {
     "ng": "ng",
     "start": "ng serve --host 0.0.0.0 --port 8888 --disable-host-check",
     "dev": "ng serve",
     "hmr": "ng serve --hmr -e=hmr",
     "local": "ng serve --environment=local",
     "mock-api-dev": "concurrently \"ng serve\" \"node api/api.js\"",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e",
     "build:server:prod": "ng run beatstars-marketplace-v2.1:server && webpack --config webpack.server.config.js --progress --colors",
     "build:browser:prod": "ng build --prod",
     "build:prod": "npm run build:server:prod && npm run build:browser:prod",
     "server": "node local.js"
   },
  "private": true,
  "dependencies": {
     "@angular/animations": "6.1.2",
     "@angular/cdk": "^6.4.2",
     "@angular/common": "6.1.2",
     "@angular/compiler": "6.1.2",
     "@angular/core": "6.1.2",
     "@angular/forms": "6.1.2",
     "@angular/http": "6.1.2",
     "@angular/material": "^6.4.2",
     "@angular/platform-browser": "^6.1.2",
     "@angular/platform-browser-dynamic": "6.1.2",
     "@angular/platform-server": "^6.1.2",
     "@angular/router": "6.1.2",
     "@ng-toolkit/universal": "^1.1.41-beta.110",
     "@ngrx/effects": "^6.0.1",
     "@ngrx/store": "^6.0.1",
     "@nguniversal/express-engine": "^6.0.0",
     "@nguniversal/module-map-ngfactory-loader": "^6.0.0",
     "@ngx-share/core": "^6.0.1",
     "@swimlane/ngx-charts": "^9.0.0",
     "@types/algoliasearch": "^3.27.5",
     "algoliasearch": "^3.29.0",
     "body-parser": "latest",
     "canvas-toBlob": "^1.0.0",
     "compression": "latest",
     "core-js": "^2.4.1",
     "cors": "~2.8.4",
     "cropperjs": "^1.0.0-rc",
     "d3": "^4.10.2",
     "dom-autoscroller": "^2.3.3",
     "font-awesome": "^4.7.0",
     "hammerjs": "^2.0.8",
     "lodash": "^4.17.5",
     "ng-lazyload-image": "^4.0.0",
     "ng-pick-datetime": "^5.2.6",
     "ng2-dnd": "^5.0.2",
     "ng2-dragula": "^2.0.2",
     "ng2-file-upload": "^1.2.1",
     "ngrx-store-freeze": "^0.2.0",
     "ngx-clipboard": "^11.1.1",
     "ngx-color-picker": "^6.6.0",
     "ngx-cookie": "^4.0.1",
     "ngx-editor": "3.2.1",
     "ngx-infinite-scroll": "^6.0.1",
     "ngx-page-scroll": "^5.0.0",
     "ngx-slick": "^0.2.0",
     "reselect": "^3.0.0",
     "rxjs": "^6.2.2",
     "rxjs-compat": "^6.2.2",
     "ts-loader": "4.2.0",
     "webpack-cli": "^2.1.4",
     "zone.js": "^0.8.26"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "~0.7.2",
     "@angular/cli": "6.1.2",
     "@angular/compiler-cli": "6.1.2",
     "@angularclass/hmr": "^2.1.3",
     "@types/compression": "^0.0.36",
     "@types/cors": "^2.8.4",
     "@types/cropperjs": "^1.1.1",
     "@types/d3": "^4.10.1",
     "@types/hammerjs": "^2.0.34",
     "@types/jasmine": "^2.5.47",
     "@types/lodash": "^4.14.104",
     "@types/node": "^7.0.12",
     "@types/uuid": "^3.4.3",
     "@types/youtube": "^0.0.30",
     "codelyzer": "^4.0.1",
     "concurrently": "^3.5.0",
     "express": "^4.15.4",
     "jasmine-core": "~2.5.2",
     "jasmine-spec-reporter": "~3.2.0",
     "karma": "~1.4.1",
     "karma-chrome-launcher": "~2.0.0",
     "karma-cli": "~1.0.1",
     "karma-coverage-istanbul-reporter": "^0.2.0",
     "karma-jasmine": "~1.1.0",
     "karma-jasmine-html-reporter": "^0.2.2",
     "prettier": "^1.14.2",
     "protractor": "~5.1.0",
     "ts-node": "^3.0.2",
     "tslint": "^5.7.0",
     "tslint-eslint-rules": "^4.1.1",
     "typescript": "2.9.2"
   }
}

不知道可能是什么问题。

也许还有更多信息。这是 server.js 中发生错误的地方(如果(value.length === 0)):

HttpHeaders.prototype.applyUpdate = function (update) {
    var key = update.name.toLowerCase();
    switch (update.op) {
        case 'a':
        case 's':
            var value = update.value;
            if (typeof value === 'string') {
                value = [value];
            }
            if (value.length === 0) {
                return;
            }
            this.maybeSetNormalizedName(update.name, key);
            var base = (update.op === 'a' ? this.headers.get(key) : undefined) || [];
            base.push.apply(base, Object(tslib__WEBPACK_IMPORTED_MODULE_0__[/* __spread */ "d"])(value));
            this.headers.set(key, base);
            break;
        case 'd':
            var toDelete_1 = update.value;
            if (!toDelete_1) {
                this.headers.delete(key);
                this.normalizedNames.delete(key);
            }
            else {
                var existing = this.headers.get(key);
                if (!existing) {
                    return;
                }
                existing = existing.filter(function (value) { return toDelete_1.indexOf(value) === -1; });
                if (existing.length === 0) {
                    this.headers.delete(key);
                    this.normalizedNames.delete(key);
                }
                else {
                    this.headers.set(key, existing);
                }
            }
            break;
    }
};

有什么帮助吗?

【问题讨论】:

    标签: angular webpack angular-cli angular6 angular-universal


    【解决方案1】:

    我遇到了类似的问题,因为我试图将 null 设置为标头的值。

    你应该看看说明

    this.headers.set(key, existing);
    ...
    this.headers.set(key, base);
    

    并确保existingbase 不为空。

    【讨论】:

    • 在这里遇到了同样的问题。我正在从 AngularJS 升级代码,它可以很好地接受空头值,我花了一段时间才发现 Angular 不能很好地处理它们。
    猜你喜欢
    • 1970-01-01
    • 2018-03-16
    • 2022-11-12
    • 1970-01-01
    • 2016-09-25
    • 2020-07-05
    • 1970-01-01
    • 2019-02-22
    • 1970-01-01
    相关资源
    最近更新 更多