从Angular 5到Lumen REST API的HTTP请求

Question

我在将http请求从Angular 5前端应用发送到Lumen后端RESTFUL API时遇到了问题。

好吧，我只是想注册用户。

这是我用于处理用户创建的管腔后端代码：

public function create(Request $request)
{
    $this->validate($request, [
      'screen_name' => 'required',
      'email' => 'required',
      'password' => 'required'
    ]);
    $request['api_token'] = app('hash')->make(str_random(60));
    $request['password'] = app('hash')->make($request->password);
    $user = User::create($request->all());
    return response()->json($user, 201);
}

我已经检查了后端，并且与Postman一起工作。

现在在Angular 5中：

registerUser(value){
var Indata={
  screen_name: value.scrname,
  email: value.email,
  password: value.password
}

return this.http.post(window.location.hostname+':1000/api/v1/users/',Indata);
}

也可以使用测试的公共假API检查此角请求。

所以，首先，我遇到了CORS问题，因为Lumen API服务器和我的Angular服务器正在本地服务器下工作。然后我添加：

window.location.hostname

而不是：

http://localhost

它解决了CORS问题，但现在我遇到了一个问题，我不了解问题在哪里？

error: error { target: XMLHttpRequest, isTrusted: true, lengthComputable: 
false, … }
headers: Object { normalizedNames: Map, lazyUpdate: null, headers: Map }
message: "Http failure response for (unknown url): 0 Unknown Error"
name: "HttpErrorResponse"
ok: false
status: 0
statusText: "Unknown Error"
url: null

我也发现了有关此问题的角度代理配置，但它不起作用。

因此，任何帮助都将不胜感激。谢谢。

Answer 1

您是否尝试过： this.http.post('/api/v1/users/',Indata)？

您的src文件夹中是否有一个proxy.conf.json？

proxy.conf.json：

{
  "/api/*": {
    "target": "http://localhost:8000",
    "secure": false,
    "logLevel": "debug"
  }
}

在"服务"下的Angular.json中是这样的：

"serve": {
 "builder": "@angular-devkit/build-angular:dev-server",
 "options": {
   "browserTarget": "frontend:build",
   "proxyConfig": "src/proxy.conf.json"
}

，您也必须在管腔中设置Corsmiddleware。