從 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 一起工作正常。

現在在角度 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。