微信小程序搭载node.js服务器的简单教程

我们来详细讲解如何搭载一个微信小程序，使其能够与一个node.js服务器进行交互。

前置条件

在开始创建微信小程序之前，请确保准备好以下工具：

微信开发者工具
node.js安装包
npm管理工具

创建微信小程序

首先，我们需要在微信开发者工具中创建一个新的微信小程序项目。在创建项目时，需要设置好项目的appid，并选择一个模板来快速创建项目结构。

创建完毕后，在开始写代码之前，我们需要在微信小程序后台中添加白名单，允许小程序访问自己的服务器。在小程序后台中点击”开发”->“开发设置”->“服务器域名”，添加我们的服务器地址。

创建node.js服务器

接下来，我们需要创建一个简单的node.js服务器，让微信小程序能够访问并返回数据。

首先，在本地电脑上安装node.js环境和npm包管理器。安装完毕后，使用npm初始化一个项目，创建一个index.js文件，并在其中添加以下代码：

const http = require('http');

const hostname = '127.0.0.1';
const port = 8080;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

这是一个最基本的http服务器，监听8080端口。我们运行该文件，就可以在浏览器中使用 localhost:8080 访问到这个服务器并返回“Hello World”字符串。

微信小程序调用node.js服务器

接下来，我们需要在微信小程序中调用该node.js服务器，并获取响应数据。

在微信小程序中，我们使用wx.request方法进行网络请求。在小程序的某个页面中，添加如下代码：

wx.request({
  url: 'http://localhost:8080',
  success: function(res) {
    console.log(res.data)
  }
})

当我们访问该页面时，控制台会输出“Hello World”字符串，这表明小程序已经成功调用了我们的node.js服务器。

示例1: 使用node.js服务器获取天气数据

下面，我们来举一个使用node.js服务器获取天气数据的实际示例。

在node.js项目根目录中执行 npm install request 来安装request库。
在index.js文件中添加以下代码：

const http = require('http');
const request = require('request');

const hostname = '127.0.0.1';
const port = 8080;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'application/json');

  request('https://free-api.heweather.com/v5/weather?city=beijing&key=YOUR_KEY', function (error, response, body) {
    if (!error && response.statusCode == 200) {
      res.end(body)
    }
  })
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

在 request 方法中，我们向和风天气API中请求了北京天气的数据，将其返回到小程序页面中。

在小程序中添加js代码：

wx.request({
  url: 'http://localhost:8080',
  success: function(res) {
    console.log(res.data)
  }
})

在小程序中访问该页面，控制台会输出请求到的数据，包含北京天气的信息。这样，我们就成功地使用node.js服务器获取了天气数据。

示例2: 使用node.js服务器存储数据

我们也可以通过node.js服务器来存储数据。例如，我们可以结合使用node.js和MySQL来存储小程序的用户信息。

在node.js项目根目录中执行 npm install mysql 来安装mysql库。
创建一个db.js文件，用于数据库连接和操作：

const mysql = require('mysql');

const pool = mysql.createPool({
  connectionLimit: 10,
  host: 'localhost',
  user: 'root',
  password: 'YOUR_PASSWORD',
  database: 'YOUR_DATABASE_NAME'
});

const query = function(sql, callback) {
  pool.getConnection(function(err, connection) {
    if (err) {
      callback(err, null);
    } else {
      connection.query(sql, function(err, rows) {
        if (err) {
          callback(err, null);
        } else {
          callback(null, rows);
        }
        connection.release();
      });
    }
  });
};

module.exports = {
  query: query
};

这是一个简单的MySQL连接池，用于连接数据库和执行SQL语句。

在index.js中添加以下代码：

const http = require('http');
const db = require('./db');

const hostname = '127.0.0.1';
const port = 8080;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'application/json');

  db.query('SELECT * FROM user', function(err, rows) {
    if (!err) {
      res.end(JSON.stringify(rows));
    }
  });
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

在这个例子中，我们查询了名为user的MySQL表，并将结果返回到小程序页面中。

在小程序中添加js代码：

wx.request({
  url: 'http://localhost:8080',
  success: function(res) {
    console.log(res.data)
  }
})

在小程序中访问该页面，控制台会输出查询到的用户信息。这样，我们就成功地集成了一个MySQL数据库，并通过node.js服务器向小程序返回数据。

希望本文能对初学者提供一些参考和指导。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：微信小程序搭载node.js服务器的简单教程 - Python技术站