Set a cookie from website A on website B

Support
, , ,
1

I would like Website A to set a cookie on Website B using a Netlify function.
Both websites are hosted by Netlify.

Website A is https://gippea.com.

Website B is https://gippea.app.



Running the following curl command displays the response set-cookie

curl -v https://gippea.com/.netlify/functions/set-cookie




The output from running the above curl command is:

*   Trying 165.22.65.139...
* TCP_NODELAY set
* Connected to gippea.com (165.22.65.139) port 443 (#0)
* ALPN, offering h2
* ALPN, offering http/1.1
* successfully set certificate verify locations:
*   CAfile: /etc/ssl/cert.pem
  CApath: none
* TLSv1.2 (OUT), TLS handshake, Client hello (1):
* TLSv1.2 (IN), TLS handshake, Server hello (2):
* TLSv1.2 (IN), TLS handshake, Certificate (11):
* TLSv1.2 (IN), TLS handshake, Server key exchange (12):
* TLSv1.2 (IN), TLS handshake, Server finished (14):
* TLSv1.2 (OUT), TLS handshake, Client key exchange (16):
* TLSv1.2 (OUT), TLS change cipher, Change cipher spec (1):
* TLSv1.2 (OUT), TLS handshake, Finished (20):
* TLSv1.2 (IN), TLS change cipher, Change cipher spec (1):
* TLSv1.2 (IN), TLS handshake, Finished (20):
* SSL connection using TLSv1.2 / ECDHE-RSA-AES256-GCM-SHA384
* ALPN, server accepted to use h2
* Server certificate:
*  subject: CN=*.gippea.com
*  start date: Aug 25 13:41:48 2020 GMT
*  expire date: Nov 23 13:41:48 2020 GMT
*  subjectAltName: host "gippea.com" matched cert's "gippea.com"
*  issuer: C=US; O=Let's Encrypt; CN=Let's Encrypt Authority X3
*  SSL certificate verify ok.
* Using HTTP2, server supports multi-use
* Connection state changed (HTTP/2 confirmed)
* Copying HTTP/2 data in stream buffer to connection buffer after upgrade: len=0
* Using Stream ID: 1 (easy handle 0x7f895d808800)
> GET /.netlify/functions/set-cookie HTTP/2
> Host: gippea.com
> User-Agent: curl/7.64.1
> Accept: */*
> 
* Connection state changed (MAX_CONCURRENT_STREAMS == 150)!
< HTTP/2 200 
< access-control-allow-origin: *
< cache-control: no-cache
< content-type: text/html
< set-cookie: gippea-third-party=true; Max-Age=5000; Domain=https://gippea.com; Path=/; Secure; SameSite=None
< date: Mon, 12 Oct 2020 09:26:09 GMT
< content-length: 334
< age: 1
< server: Netlify
< x-nf-request-id: f76eb69d-adea-42a3-9f6a-c89fec87cd3e-37349410
< 

  <html lang="en">
    <head>
      <meta charset="utf-8">
    </head>
    <body>
      <noscript>
        <meta http-equiv="refresh" content="0; url=https://gippea.app" />
      </noscript>
    </body>
    <script>
      setTimeout(function() {
        window.location.href = "https://gippea.app"
      }, 0)
    </script>
* Connection #0 to host gippea.com left intact
  </html>* Closing connection 0




The netlify function which handles the curl command is:

const cookie = require("cookie");

exports.handler = async (event, context) => {
  const myCookie = cookie.serialize("gippea-third-party", "true", {
    secure: true,
    httpOnly: false,
    path: "/",
    maxAge: 5000,
    domain: "https://gippea.com",
    sameSite: "none",
  });
  const redirectUrl = "https://gippea.app";
  // Do redirects via html
  const html = `
  <html lang="en">
    <head>
      <meta charset="utf-8">
    </head>
    <body>
      <noscript>
        <meta http-equiv="refresh" content="0; url=${redirectUrl}" />
      </noscript>
    </body>
    <script>
      setTimeout(function() {
        window.location.href = ${JSON.stringify(redirectUrl)}
      }, 0)
    </script>
  </html>`;

  return {
    statusCode: 200,
    headers: {
      "Set-Cookie": myCookie,
      "Cache-Control": "no-cache",
      "Content-Type": "text/html",
      "Access-Control-Allow-Origin": "*",
    },
    body: html,
  };
};




But the cookie is not displayed or set by calling the Netlify function.

Screenshot 2020-10-12 at 10.31.37
Screenshot 2020-10-12 at 10.31.371017×287 36.9 KB




How can I set the third party cookie? And access it’s contents using JavaScript?


Thanks,
Berni

@fool, @perry, @futuregerald, @Dennis, @jen and idea why this is not working?

3

Hey @berni,

Sorry for the hold-up. I’m no cookie connoisseur however I didn’t want to leave you without an answer!

Rather than Site A setting the cookie for Site B, can’t Site B get the cookie from Site A? :thinking:

4

Hi,

It needs to be a cookie set by a third party website. It relates to cross site tracking. Any ideas?

:deciduous_tree:

5

As far as I know, CURL cannot set the cookie in your browser. If you want the cookie to be placed on gippea.app, you need to make a request to the Netlify Function from gippea.app. For example, you could load it as a script in the <head> or <body> on gippea.app:
<script src="https://gippea.com/.netlify/functions/set-cookie"></script>

Cookies won’t be set if the cookie-domain does not match the domain that the request originated from (for security reasons). So you need to remove the domain option from your cookies.serialize code. In fact, to get started, the best way might be to just use a plain string instead and verify that the cookie appears on gippea.app:

exports.handler = async (event, context) => {
  return {
    statusCode: 200,
    headers: {
      "Set-Cookie": "gippea-third-party=true",
      "Cache-Control": "no-cache",
      "Content-Type": "text/html",
      "Access-Control-Allow-Origin": "*",
    },
    body: "alert('cookie set!');",
  };
};
2 Likes
6

Thanks for getting back to me. The CURL example was intended to convey that a Set-Cookie attribute was included in the response HTTP header. Apologies if that was misleading.

This resolved my issue! Thanks @finn.woelm & Team Netlify.

:smile:

1 Like