Laravel 5.5 und Angular 4 Set Cookie

Question

Ich habe Laravel als Backend (das bei Homestead - Mydomain.test implementiert) und eckigen 4 als Frontend (das bei http://localhost:4200 implementiert), jetzt möchte ich einen Cookie vom Backend zu Frontend-Browser setzen .

Backend Controller:

return response(['access_token'=>$response['access_token'], 'expires_in' => $response['expires_in']]) 
      ->withCookie($cookie); 

und Antwort ist:

Access-Control-Allow-Origin:* 
Cache-Control:no-cache, private 
Connection:keep-alive 
Content-Type:application/json 
Date:Sat, 30 Dec 2017 09:01:11 GMT 
Server:nginx/1.11.9 
Set-Cookie:refreshToken=def50200b16fb4563dfa726245a813985f300394fcce058b32138d85d62791e53869049c4dc71358e5789fb267457313e295f43b4f8dc8a5c4a22b03577ef77fb114f71fe17dbad637fc07105cbc67f58adbc905008fb870eae6b238047c9037fdbcf2710909538b36f8432f9528d52c9afd8774fe68ebfb11d125f0951b69ede08e164a1b0f1fe1510906a30858cb1946868a7d89d2d289b27140155b4fca33bee35ce9560696e023a484412bbbf26751ca81d96c88879c6a885b0ed72cc0b0c63639df38b3f7170561c559570cd5fa8faeec89ce06ddaf073a4634dcd5d49c0c5500dc63aeec5d5ffa99c2bad4c817f454c3bfa228397f18162e6fce64790da2f138a506bc906ae944a9aee29f1aa2b49bf2189d703706b2f475588f819985ad6942312070f5c887eec3deaa0761157f3cd86f0a016f3b19a311223c9b703a89efdfd96a878330b4e7dc86b0759c91be9bd7905ed6b94fec3587528402b7; expires=Thu, 22-Aug-2019 09:01:11 GMT; Max-Age=51840000; path=/; HttpOnly 
Transfer-Encoding:chunked 
Vary:Origin 
X-RateLimit-Limit:60 
X-RateLimit-Remaining:59 

aber wenn ich das Cookie vom Frontend-Backend gesendet werden soll, funktioniert es nicht! Ich benutzte Winkel 4:

refreshToken(){ 

const headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded', '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.json()); 
     return response.json() 
    }, 
) 
} 

und Back-End-Seite:

$refreshToken = $request->cookie(self::REFRESH_TOKEN); 
var_dump($refreshToken); // to be null always 

Können Sie mir helfen, diese Probleme zu lösen?

Answer 1

Ich löste dieses Problem von: Create proxy.conf.json im Stamm der Angular App. Setzen Sie ein Objekt mit Routen innen:

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

ich nur haben/api hier definiert, weil alle meine Backend-URIs innerhalb api.php sind. Alle Anrufe, die wie http://localhost:4200/api/someitems/1 aussehen, werden an http://mydomian.test/api/someitems/1 weitergeleitet. Bearbeiten Sie dann package.json und ändern Sie den Wert von start in scripts in ng serve --proxy-config proxy.conf.json. Jetzt startet npm run start mit Proxy. Das Problem, das ich mit diesem Proxy hatte, ist, dass es Ihre URL (http://mydomian.test/) zu einer IP auflöst. Wenn es Laravel mit nur einer IP aufruft, weiß der nginx-Server nicht, was zu tun ist, weil er einen Domain-Namen erhalten muss. nginx erlaubt mehrere Websites auf derselben IP-Adresse, so dass es einen Domänennamen oder eine Standardwebsite erhalten muss, an die alle Anrufe weitergeleitet werden, die keinen Domänennamen haben. Sollte dies in Angulars Proxy noch nicht behoben sein, gehen Sie zu/etc/nginx/sites-available auf dem Laravel-Rechner, dort haben Sie eine mydomian.test-Konfigurationsdatei. Es hat 80 zuhören; Linie dort, ändere es, um 80 Standard zu hören ;.

Jetzt können Sie die Variable API_DOMAIN in http://localhost:4200 ändern (oder entfernen Sie alle zusammen) und deaktivieren Sie die CORS.