Inhaltsverzeichnis
Hintergrund
Prozess
Heim WeChat-Applet Mini-Programmentwicklung Informationen zur Anforderungskapselung von Miniprogrammen (mit detailliertem Prozess)

Informationen zur Anforderungskapselung von Miniprogrammen (mit detailliertem Prozess)

Sep 11, 2021 pm 05:07 PM
request

Hintergrund

Der vorherige Applet-Code war verwirrend, daher planten wir zu Beginn des neuen Projekts, die Anforderung des WeChat-Applets zu kapseln

Prozess

Lassen Sie uns zunächst über den gesamten Prozess sprechen:

1 Rufen Sie nach der Eingabe von .appjs die Benutzerinformationen ab. Wenn Sie nicht angemeldet sind, erfolgt hier standardmäßig keine Fehlerbehandlung.

2 Der Benutzer muss der Autorisierung zustimmen, bevor der Vorgang ausgeführt werden kann . Wenn er der Autorisierung nicht zustimmt, springt er immer zur Autorisierungsseite. Rufen Sie nach dem Klicken auf die Autorisierungsseite die Anmeldeschnittstelle auf Benutzerinformationen in

app.js

onLaunch

appSelf = this;
        // 应用程序第一次进入,获取用户信息,不做任何错误处理
        userInfo().then( (res)=>{
            console.log(res);// 打印结果
            if (!res.code) {
                appSelf.globalData.userInfo = res
            }
        }).catch( (errMsg)=>{
            console.log(errMsg);// 错误提示信息
        });
Nach dem Login kopieren
httpUtils.js

request encapsulation

const request = function (path, method, data, header) {
    let user_id = "";
    let token = "";
    try {
        user_id = wx.getStorageSync(USER_ID_KEY);
        token = wx.getStorageSync(TOKEN_KEY);
    } catch (e) {}
    header = header || {};
    let cookie = [];
    cookie.push("USERID=" + user_id);
    cookie.push("TOKEN=" + token);
    cookie.push("device=" + 1);
    cookie.push("app_name=" + 1);
    cookie.push("app_version=" + ENV_VERSION);
    cookie.push("channel=" + 1);
    header.cookie = cookie.join("; ");
    return new Promise((resolve, reject) => {
        wx.request({//后台请求
            url: API_BASE_URL + path,
            header: header,
            method: method,
            data: data,
            success: function (res) {
                if (res.statusCode !== 200) {
                    reject(res.data)
                } else {
                    if (res.data.code === 20006) {
                        login().then( (res)=>{
                            resolve(res)
                        }).catch( (errMsg)=>{
                            reject(errMsg);
                        })
                    }
                    resolve(res.data)
                }
            },
            fail: function (res) {
                reject("not data");
            }
        });
    });
}
Nach dem Login kopieren

login

const login = function () {
    try {
        wx.removeStorageSync(USER_ID_KEY)
        wx.removeStorageSync(TOKEN_KEY)
    } catch (e) {}
    return new Promise((resolve, reject) => {
        wx.login({
            success: res => {
                let code = res.code;
                // 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
                wx.getUserInfo({
                    withCredentials: true,
                    success: res => {
                        let userInfo = res.userInfo;
                        let name = userInfo.nickName;
                        let avatar = userInfo.avatarUrl;
                        let sex = userInfo.gender;
                        let data = {
                            code: code,
                            encryptedData: res.encryptedData,
                            iv: res.iv,
                            name: name,
                            avatar: avatar,
                            sex: sex,
                            from: FROM,
                        };
                        request("/api/user/login/byWeChatApplet", "POST", data).then( (res)=>{
                            if (!res.code) {
                                try {
                                    wx.setStorageSync(USER_ID_KEY, res.user_id);
                                    wx.setStorageSync(TOKEN_KEY, res.token)
                                } catch (e) {
                                    reject(JSON.stringify(e));
                                }
                            }
                            resolve(res)
                        }).catch( (errMsg)=>{
                            reject(errMsg)
                        });
                    },
                    fail: function (res) {
                        console.log(res);

                        if (res.errMsg && res.errMsg.startsWith("getUserInfo:fail") && res.errMsg.search("unauthorized") != -1) {
                            // 跳转授权页面
                            wx.navigateTo({
                                url: '/pages/auth/auth'
                            })
                            return;
                        }
                        wx.getSetting({
                            success: (res) => {
                                if (!res.authSetting["scope.userInfo"]) {
                                    // 跳转授权页面
                                    wx.navigateTo({
                                        url: '/pages/auth/auth'
                                    })
                                }
                            }
                        });
                    }
                })
            }
        })
    });
};
Nach dem Login kopieren

auth.js

Autorisierungsseite. js

Page({
    data: {
    },
    onLoad: function () {
        self = this;
    },

    auth: function (e) {
        console.log(app.globalData.userInfo);
        if (e.detail.userInfo) {
            login().then( (res)=>{
                console.log(res);// 打印结果
                if (res.code) {
                    // 接口错误
                    return
                }
                // 跳转回上一个页面
                wx.navigateBack()
            }).catch( (errMsg)=>{
                console.log(errMsg);// 错误提示信息
            });
        }
    },

});
Nach dem Login kopieren
Project Adresse

https://github.com/ lmxdawn/wx...

Backend-Management erstellt mit Vue + thinkphp5.1: https://github.com/ lmxdawn/vu...

Demo:

<br>Informationen zur Anforderungskapselung von Miniprogrammen (mit detailliertem Prozess)

<br>
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonInformationen zur Anforderungskapselung von Miniprogrammen (mit detailliertem Prozess). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Was bedeutet PHP-Anfrage? Was bedeutet PHP-Anfrage? Jul 07, 2021 pm 01:49 PM

Die chinesische Bedeutung von request ist „request“. Es ist eine globale Variable in PHP und ein Array, das „$_POST“, „$_GET“ und „$_COOKIE“ enthält. Die Variable „$_REQUEST“ kann per POST oder GET übermittelte Daten und COOKIE-Informationen abrufen.

So verwenden Sie die Funktion urllib.request.urlopen() zum Senden einer GET-Anfrage in Python 3.x So verwenden Sie die Funktion urllib.request.urlopen() zum Senden einer GET-Anfrage in Python 3.x Jul 30, 2023 am 11:28 AM

So verwenden Sie die Funktion urllib.request.urlopen() in Python3.x, um eine GET-Anfrage zu senden. Bei der Netzwerkprogrammierung müssen wir häufig Daten von einem Remote-Server erhalten, indem wir eine HTTP-Anfrage senden. In Python können wir die Funktion urllib.request.urlopen() im Modul urllib verwenden, um eine HTTP-Anfrage zu senden und die vom Server zurückgegebene Antwort zu erhalten. In diesem Artikel wird die Verwendung vorgestellt

So kapseln Sie den Vue3 Axios-Interceptor in eine Anforderungsdatei So kapseln Sie den Vue3 Axios-Interceptor in eine Anforderungsdatei May 19, 2023 am 11:49 AM

1. Erstellen Sie eine neue Datei namens request.js und importieren Sie Axios: importaxiosfrom'axios'; 2. Erstellen Sie eine Funktion namens request und exportieren Sie sie: Dadurch wird eine Funktion namens request erstellt und exportiert. Richten Sie eine neue Axios-Instanz mit einer Basis-URL ein . Um Timeout-Einstellungen in einer umschlossenen Axios-Instanz hinzuzufügen, können Sie beim Erstellen der Axios-Instanz die Timeout-Option übergeben. exportconstrequest=axios.create({baseURL:'https://example.

Was ist das Request-Objekt in PHP? Was ist das Request-Objekt in PHP? Feb 27, 2024 pm 09:06 PM

Das Request-Objekt in PHP ist ein Objekt, das zur Verarbeitung von HTTP-Anfragen verwendet wird, die vom Client an den Server gesendet werden. Über das Request-Objekt können wir die Anforderungsinformationen des Clients abrufen, z. B. die Anforderungsmethode, die Anforderungsheaderinformationen, die Anforderungsparameter usw., um die Anforderung zu verarbeiten und zu beantworten. In PHP können Sie globale Variablen wie $_REQUEST, $_GET, $_POST usw. verwenden, um angeforderte Informationen zu erhalten, aber diese Variablen sind keine Objekte, sondern Arrays. Um Anfrageinformationen flexibler und bequemer bearbeiten zu können, können Sie dies tun

Was ist eine Anfrage in PHP? Was ist eine Anfrage in PHP? Jun 01, 2023 am 10:12 AM

Request in PHP ist eine super globale Variable in PHP. Sie wird zum Sammeln von Daten verwendet, die von HTML-Formularen und Parametern in URLs übermittelt werden. Sie kann Daten aus GET- und POST-Anfragen abrufen ein assoziatives Array, wobei die Schlüssel die Namen der Formularfelder und die Werte die Werte der Formularfelder sind. Bei Verwendung der Variablen $_request sollten vom Benutzer eingegebene Daten immer validiert und gefiltert werden, um Sicherheitsprobleme zu vermeiden.

Die Rolle und Bedeutung von Request in PHP Die Rolle und Bedeutung von Request in PHP Feb 27, 2024 pm 12:54 PM

Die Rolle und Bedeutung von Request in PHP In der PHP-Programmierung ist Request ein Mechanismus zum Senden von Anfragen an den Webserver. Er spielt eine wichtige Rolle bei der Webentwicklung. Request wird hauptsächlich verwendet, um vom Client gesendete Daten abzurufen, z. B. Formularübermittlung, GET- oder POST-Anfrage usw. Über Request können die vom Benutzer eingegebenen Daten abgerufen und die Daten verarbeitet und beantwortet werden. In diesem Artikel werden die Rolle und Bedeutung von Request in PHP vorgestellt und spezifische Codebeispiele gegeben.

So verwenden Sie den Kontext, um die Überprüfung von Anforderungsparametern in Go zu implementieren So verwenden Sie den Kontext, um die Überprüfung von Anforderungsparametern in Go zu implementieren Jul 22, 2023 am 08:23 AM

So verwenden Sie den Kontext, um die Überprüfung von Anforderungsparametern in Go zu implementieren. Einführung: Während des Back-End-Entwicklungsprozesses müssen wir häufig die Anforderungsparameter überprüfen, um die Rechtmäßigkeit der Parameter sicherzustellen. Die Go-Sprache stellt das Kontextpaket zur Verarbeitung von Anforderungskontextinformationen bereit. Ihr elegantes Design und ihre einfache Verwendung machen sie zu einem häufig verwendeten Werkzeug. In diesem Artikel wird erläutert, wie das Kontextpaket von Go zum Implementieren der Überprüfung von Anforderungsparametern verwendet wird, und es werden entsprechende Codebeispiele angegeben. Einführung in das Kontextpaket In Go wird das Kontextpaket zur Bereitstellung verwendet

So verwenden Sie das Modul urllib.request zum Senden von HTTP-Anfragen in Python 3.x So verwenden Sie das Modul urllib.request zum Senden von HTTP-Anfragen in Python 3.x Jul 30, 2023 am 11:21 AM

So verwenden Sie das Modul urllib.request zum Senden von HTTP-Anfragen in Python3.x. Im eigentlichen Entwicklungsprozess müssen wir häufig HTTP-Anfragen senden, um mit dem Server zu interagieren. Python stellt das Modul urllib.request bereit, eines der Module in der Python-Standardbibliothek zur Verarbeitung von URL-Anfragen. In diesem Artikel erfahren Sie, wie Sie HTTP-Anfragen mit dem Modul urllib.request senden

See all articles