通过AngularJS 6和Node验证UBER API

Question

我正在开发一个应用程序，在此应用程序中，我们使用UBER API。我使用NODE作为后端，使用AngularJS 6作为前端。

工作流程

在NODE部分中，我具有访问身份验证和其他UBER API。我已经通过JQuery进行了测试。运行良好。但是，当我尝试使用AngularJS 6访问时，出现以下错误。

SyntaxError: Unexpected token h in JSON at position 0 at JSON.parse (<anonymous>) at XMLHttpRequest.onLoad (http://localhost:4200/vendor.js:11697:51) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2743:31) at Object.onInvokeTask (http://localhost:4200/vendor.js:41155:33) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (http://localhost:4200/polyfills.js:2742:36) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (http://localhost:4200/polyfills.js:2510:47) at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (http://localhost:4200/polyfills.js:2818:34) at invokeTask (http://localhost:4200/polyfills.js:3862:14) at XMLHttpRequest.globalZoneAwareCallback (http://localhost:4200/polyfills.js:3888:17)
text: "https://login.uber.com/oauth/v2/authorize?response_type=code&redirect_uri=http%3A%2F%2Flocalhost%3A4200%2Flogin&scope=profile%20history%20places%20request&client_id=XXXXXXXXXXXXXXXXXXXXXXXXX"
__proto__: Object
headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit: ƒ}
message: "Http failure during parsing for http://localhost:1455/api/login"
name: "HttpErrorResponse"
ok: false
status: 200
statusText: "OK"
url: "http://localhost:1455/api/login"
__proto__: HttpResponseBase

这是我的代码 结点

app.get('/api/login', function(request, response) {
    response.header('Access-Control-Allow-Origin', '*');
    response.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    response.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');    
    response.setHeader('Access-Control-Allow-Credentials', true);
    var authURL=uber.getAuthorizeUrl(config.uber.scopes);
    response.redirect(authURL);
});

AngularJS 6

data.service.ts

 UberAuthenticate(){
    return this.http.get('http://localhost:1455/api/login');      
  }

login.components.ts

export class LoginComponent implements OnInit {
  constructor(private dataService: DataService) {
   }

  ngOnInit() {
    this.dataService.UberAuthenticate().subscribe((response)=>{
      console.log('response is ', response)
    },(error) => {
      console.log('error is ', error)
  })
  }
}

我的Node应用程序正在 PORT：1455 ，AngularJS PORT：4200 和回调URL http://localhost:1455/api/callback上运行。 我还在 proxy.config.json

中设置了一些配置

{
    "/api/*": {
      "target": "http://localhost:1455",
      "secure": false,
      "changeOrigin": false,
      "pathRewrite": {"^/api" : ""}
    }
  }

我没有使用NODE和AngularJS 6的经验。我不知道我在哪里做错了吗？

Answer 1

由于授权端点返回的是纯文本链接，因此您需要像这样在服务中将其指定为有角度的：

UberAuthenticate(){
    return this.http.get('http://localhost:1455/api/login', { responseType: 'text' });      
}

在NodeJS部分中，您将必须返回授权URL，重定向必须在前端进行。