javascript - 如何将 Angular 2 Frontend Express JS 变量导出到 Angular 2 组件?
问题描述
根据我的研究,我正在使用我的代码执行以下操作。目前我在控制台中收到以下错误,我不明白为什么。我逐行遵循教程。
任何帮助将不胜感激。我正在尝试从我的 routes.js 文件中导出 nameid 变量以在 Angular 组件中使用。
angular-master/express/config/routes.js
var xmldoc = require('xmldoc');
var DOMParser = require('dom-parser');
module.exports = function (app, config, passport) {
app.get('/', function (req, res) {
res.redirect('/home')
});
app.get('/login',
passport.authenticate(config.passport.strategy,
{
successRedirect: '/',
failureRedirect: '/login'
})
);
app.post('/', function(req, res) {
console.log('body saml:', req.body.SAMLResponse);
const body = req.body.SAMLResponse;
var b = new Buffer(body, 'base64');
let text = b.toString('ascii');
//var inflated = pako.inflateRaw(b, {to:'string'});
console.log('formmatted saml',text);
var document = new xmldoc.XmlDocument(text);
console.log('formmatted document',document);
var status = document.descendantWithPath("samlp:Status").firstChild.attr;
var attr = text.includes("AttributeStatement");
var nameid = text.substring(text.lastIndexOf("<NameID>") + 8,text.lastIndexOf("</NameID>"));
module.exports.nameid = nameid;
console.log("status id:", status['Value']);
console.log(attr);
console.log('LDAP DB username: ' + nameid);
};
angular-master/src/app/site/user-history/user-history.component.ts
import { Component, OnInit } from '@angular/core';
import { RouterLink } from '@angular/router';
import { FormArray, FormControl, FormGroup, Validators } from '@angular/forms';
import { Observable } from 'rxjs';
import { HttpClient } from '@angular/common/http';
import { element } from 'protractor';
import { ActivatedRoute } from '@angular/router';
import { Router } from '@angular/router';
var routes = require('./../../../../express/config/routes.js');
@Component({
selector: 'app-user-history',
templateUrl: './user-history.component.html',
styleUrls: ['../style.css']
})
export class UserHistoryComponent implements OnInit {
constructor(
private route: ActivatedRoute,
private router: Router
) {}
ngOnInit() {
console.log(routes.nameid);
}
我的控制台显示以下错误:
xmldoc.js:5 Uncaught ReferenceError: global is not defined
at xmldoc.js:5
at Object../node_modules/xmldoc/lib/xmldoc.js (xmldoc.js:339)
at __webpack_require__ (bootstrap:76)
at Object../node_modules/xmldoc/index.js (index.js:3)
at __webpack_require__ (bootstrap:76)
at Object../express/config/routes.js (routes.js:1)
at __webpack_require__ (bootstrap:76)
at Object../src/app/site/user-history/user-history.component.ts (user-history.component.ts:23)
at __webpack_require__ (bootstrap:76)
at Object../src/app/site/site.module.ts (main.js:8001)
(anonymous) @ xmldoc.js:5
./node_modules/xmldoc/lib/xmldoc.js @ xmldoc.js:339
__webpack_require__ @ bootstrap:76
./node_modules/xmldoc/index.js @ index.js:3
__webpack_require__ @ bootstrap:76
./express/config/routes.js @ routes.js:1
__webpack_require__ @ bootstrap:76
./src/app/site/user-history/user-history.component.ts @ user-history.component.ts:23
__webpack_require__ @ bootstrap:76
./src/app/site/site.module.ts @ main.js:8001
__webpack_require__ @ bootstrap:76
./src/app/app.module.ts @ app.component.ts:13
__webpack_require__ @ bootstrap:76
./src/main.ts @ environmentLoader.ts:21
__webpack_require__ @ bootstrap:76
0 @ main.ts:16
__webpack_require__ @ bootstrap:76
checkDeferredModules @ bootstrap:43
webpackJsonpCallback @ bootstrap:30
(anonymous) @ main.js:1
解决方案
糟糕,您必须使用 import 而不是 require。
import * as routes from './../../../../express/config/routes.js';
ngOnInit() {
console.log(routes.nameid);
}
但是为什么要在前端调用后端变量呢?它们是独立的服务器
推荐阅读
- android - 如何从自定义视图中扩展 onItemSelectedListener?
- php - 如何根据mysql中的if else条件选择数据
- flutter - Flutter Web 调试正常,但构建 Web 显示空白页面
- csv - 如何从头开始读取 CSV?
- knex.js - MemSQL Distributed 不支持“重新调整单例选择”
- python - 我不知道为什么会发生 UnboundLocalError
- python - 无法创建表
- laravel - Laravel 一种用于存储和更新的验证功能
- docker - 特雷菲克路线 404
- c# - De-serialize JSON into a List using a runtime Class