Javascript angular 4不向服务器发送cookie

当我使用withCredentials时，我可以看到Cookie被发送到服务器。但是我们会向服务器发送任何东西。我使用laravel作为后端，angular 4作为前端。 另外，chrome开发者工具上没有显示cookie，我无法使用它访问它们

此外，我在laravel中使用了Cors中间件，如：

<?php

namespace App\Http\Middleware;

use Closure;

class Cors
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
      $response = $next($request);
      $response->headers->set('Access-Control-Allow-Origin', 'http://localhost:4200');
      $response->headers->set('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
      $response->headers->set('Access-Control-Allow-Headers', 'Content-Type, Accept, Authorization, X-Request-With');
      $response->headers->set('Access-Control-Expose-Headers', 'Content-Disposition, x-total-count, x-filename');
      $response->headers->set('Access-Control-Allow-Credentials', 'true');

      return $response;

    }
}

当我从前端请求时：

refreshToken(){

const headers = new Headers({ 'Content-Type': 'application/json', 'Authorization': 'Bearer ' + this.getToken()})
let options = new RequestOptions({ headers: headers, withCredentials: true });
return this.http.post(API_DOMAIN + 'refresh', JSON.stringify({}), options)
  .map(
    (response) => {
      console.log(response);
      return response.json()
    },
  )
  .do(
    tokenData =>{
      localStorage.setItem('token', tokenData.access_token)
      localStorage.setItem('expires_in', tokenData.expires_in)
    }
  )
}

chrome develope：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:Content-Type, Accept, Authorization, X-Request-With
Access-Control-Allow-Methods:GET, POST, OPTIONS, PUT, PATCH, DELETE
Access-Control-Allow-Origin:http://localhost:4200
Access-Control-Expose-Headers:Content-Disposition, x-total-count, x-filename
Cache-Control:no-cache, private
Connection:keep-alive
Content-Type:application/json
Date:Tue, 02 Jan 2018 08:57:28 GMT
Server:nginx/1.11.9
Transfer-Encoding:chunked
X-RateLimit-Limit:60
X-RateLimit-Remaining:59

---

前端和后端服务器使用不同的端口。

您无法保存cookie，因为您的development node.js服务器和Laravel Vagrant box位于不同的域上。您可以做的是代理从node.js到Laravel服务器的调用

在Angular app的根目录中创建

proxy.conf.json

。将包含路由的对象放置在内部：

{
  "/api": {
    "target": "http://mydomian.test/",
    "secure": false
  }
}

我只是在这里定义了

/api

，因为我所有的后端URI都在

api.php

中。所有看起来像

http://localhost:4200/api/someitems/1

将被代理到

http://mydomian.test/api/someitems/1

然后编辑

package.json

并将

scripts

中的

start

值更改为

ng-serve--proxy-config-proxy.conf.json

。现在，

npm run start

将从proxy开始。这个代理的问题是它解析您的URL（

http://mydomian.test/

）连接到IP。当nginx服务器仅使用IP调用Laravel时，它不知道该做什么，因为它必须接收域名。nginx允许在同一IP上有多个网站，因此它必须接收一个域名或有一个默认网站，它将所有没有域名的呼叫重定向到该网站。如果Angular的代理中仍然没有修复此问题，请转到Laravel机器上可用的

/etc/nginx/sites

，那里将有一个

mydomian.test

配置文件。它有

listen80行，将其更改为
默认值

现在您可以将
API\u域
变量更改为
http://localhost:4200
（或将其全部删除）并禁用CORS。
您的Laravel服务器是否也运行
localhost
？你为什么需要CORS？@Dmitry no.我的laravel服务器运行在homestead和domian上，类似于：mydomian.test你不能向另一个域发送/接收Cookie。您需要代理到Laravel服务器（可以在angular中配置），或者使用其他身份验证方法，如JWT或其他基于令牌的身份验证。@Dmitry我使用Laravel passport进行身份验证，并在Laravel服务器中编写中间件！啊，所以它们不是认证cookies。但无论如何，您不能将任何cookie发送到另一个域。您可以使用代理，然后禁用CORS，因为它将在同一个域上工作。您只需要使用代理进行开发，因为当您发布整个应用程序时，它将位于Laravel的
public
目录中。要我发布如何配置代理吗？
{
  "/api": {
    "target": "http://mydomian.test/",
    "secure": false
  }
}