How to set server return cookies in UniApp

With the continuous development of mobile applications, front-end technology is also constantly updated and upgraded. Among them, UniApp is a cross-platform front-end framework that supports multiple operating systems and platforms, such as iOS, Android, H5, and applets. In UniApp, we can use the same language for development, which is based on Vue.js.

However, in UniApp, if you need to use the server to return cookie information to the client, you need to make some settings. So, how to set the server to return cookies in UniApp? Let me introduce it to you in detail below.

1. Setting cookies on the server side

To set cookies on the server side, we need to use Node.js. Specifically, we need to use the express framework. First, after installing Node.js and the express framework on the server side, we can write the following code:

const express = require('express');
const app = express();

app.get('/setCookie', function (req, res) {
  res.cookie('name', 'uniapp', {
    domain: 'localhost',
    maxAge: 1000 * 60 * 60 * 24,
    httpOnly: true,
    secure: false
  });
  res.send('Cookie is set');
});

app.listen(8080, function () {
  console.log('App is listening on port 8080');
});

In the above code, we use the express framework to create a virtual server, in which we define GET request "/setCookie" was made. In this request, we used the res.cookie() method to set the cookie:

• The first parameter is the name of the cookie;
• The second parameter is the value of the cookie ;
• The third parameter is an object used to set some attributes of the cookie. Among them, domain represents the domain name of the cookie, maxAge represents the validity period of the cookie, httpOnly represents whether the cookie can only be accessed through the http protocol, and secure represents whether the cookie can only be accessed through the https protocol.

2. Get the cookie in UniApp

After setting the cookie on the server side, we need to get the cookie in UniApp. Specifically, we can write the following code:

export default {
  methods: {
    getCookie() {
      var cookies = document.cookie.split(';');
      var obj = {};
      for (var i = 0; i < cookies.length; i++) {
        var arr = cookies[i].trim().split('=');
        obj[arr[0]] = arr[1];
      }
      console.log(obj);
    }
  }
}

In the above code, we define a getCookie() method. This method first uses document.cookie to obtain all cookie information saved by the client and separates it with semicolons. We then use a loop to go through all the cookie information and use the trim() and split() methods to separate the individual attributes and save them into an object.

3. Set cookies in UniApp

Finally, we can use the following code to set cookies in UniApp:

export default {
  methods: {
    setCookie() {
      document.cookie = 'name=uniapp';
    }
  }
}

In the above code, We define a setCookie() method. This method first uses document.cookie to set the cookie's name and value.

Summary

The above is how to set the server to return cookies in UniApp. It should be noted that if we are using a mini program platform in UniApp, then when setting a cookie, a request must be sent through the interface wx.request() before the cookie can be returned to the client. In addition, no matter which platform is used, when setting cookies, we need to ensure the security of cookies to avoid loopholes that may lead to client information leakage.

The above is the detailed content of How to set server return cookies in UniApp. For more information, please follow other related articles on the PHP Chinese website!