如何在没有进行域名备案的情况下部署微信小程序的服务

由于作者在上学期间帮老师做微信小程序,但是因为自己的域名没有备案,同时又是因为在五一假期,政府部门不上班的情况下,需要在假期之后就用到,因此便到处寻找解决方案,最后在微信文档中云服务的部分找到了答案。

注册并打开微信云托管

首先先新建MySQL数据库并将名称用户名和密码设置为后端接口中对应的部分。

然后新建服务写好名称后打开

在这里我们选择好自己对应的部分,在这里作者选择手动上传代码包,在这里上传代码包时一定要做好dockerfile的文件,否则可能会一直出现上传服务失败的情况。

当然在这里如果你没有Dockerfile文件的话也可以填无然后选择语言与进程启动命令,如果时nodejs那么一般是node xxx.js这个是你自己需要知道的。

如果你不会写Dockerfile的文件的话也可以查看作者的另一篇文章如何写dockerfile文件-CSDN博客

发布成功后便会出现以下页面。

修改前端代码

接下来便是修改前端代码,由于微信小程序同样是微信服务器的,一般情况下可以视为同一台服务器,可以理解为本地调试不需要域名访问,同样也不需要https和备案要求了。

开发指引 / 调用云托管服务 / 微信小程序

上面是官方文档,在这里我会举一些例子,比如nodejs

首先在app.vue中的js部分加上如下代码,或者直接就是app.js里加

<script>
	export default {
		onLaunch: function() {
			console.log('App Launch')
			// 初始化云开发
			wx.cloud.init({
				env: 'xxx', // 云环境ID
			});
			
			// 初始化云托管调用
			this.initCloudContainer();
			
			// 测试云托管接口调用
			this.testCloudCall();
		},
		onShow: function() {
			console.log('App Show')
		},
		onHide: function() {
			console.log('App Hide')
		},
		methods: {
			async initCloudContainer() {
				const cloud = new wx.cloud.Cloud({
					resourceAppid: 'xxx', // 云托管环境所属账号的appid
					resourceEnv: 'xxx', // 云环境ID
				});
				this.cloud = cloud;
				await this.cloud.init();
			},
			
			/**
			 * 封装的微信云托管调用方法
			 * @param {Object} obj 业务请求信息
			 * @param {number} number 请求等待次数,默认0
			 */
			async call(obj, number = 0) {
				if (!this.cloud) {
					await this.initCloudContainer();
				}
				
				try {
					const result = await this.cloud.callContainer({
						config: {
							env: 'xxx'
						},
						path: obj.path,
						method: obj.method || 'GET',
						data: obj.data,
						header: {
							'X-WX-SERVICE': 'xxx', // 服务名称
							...obj.header
						}
					});
					
					console.log(`微信云托管调用结果${result.errMsg} | callid:${result.callID}`);
					return result.data;
				} catch (e) {
					const error = e.toString();
					// 如果错误信息为未初始化,则等待300ms再次尝试
					if (error.indexOf("Cloud API isn't enabled") != -1 && number < 3) {
						return new Promise((resolve) => {
							setTimeout(() => {
								resolve(this.call(obj, number + 1));
							}, 300);
						});
					} else {
						throw new Error(`微信云托管调用失败${error}`);
					}
				}
			}
		}
	}
</script>

随后在前端页面中的js里调用后端接口的时候将原本的request部分修改为下面的样式。

const response = await getApp().call({
        path: 'xxx',服务的路径,在这里对应后端接口中的路径。
        method: 'POST',
        data: {
          
        }
      })

然后便可以在前端代码中调用托管在微信云托管的服务中的后端接口了,同时在微信小程序中也不需要担心https和域名没备案的问题了

### 如何在本地服务器上部署微信小程序 要在本地服务器上部署微信小程序,需要完成以下几个方面的配置和操作: #### 1. 准备工作 确保已经完成了以下准备工作: - 安装并熟悉微信小程序开发者工具[^1]。 - 注册微信小程序账号,并获取 `AppID` 和其他必要参数[^3]。 #### 2. 配置本地服务器 为了使微信小程序能够访问本地服务器上的数据或接口,需满足以下条件: - **开启 CORS 支持**:如果前端请求的是跨域资源,则需要在本地服务器端启用跨源资源共享 (CORS)[^2]。可以通过修改 Web 服务框架的响应头来实现这一功能。例如,在 Node.js 中可以这样设置: ```javascript const express = require('express'); const app = express(); // 设置允许跨域 app.use((req, res, next) => { res.header('Access-Control-Allow-Origin', '*'); // 允许所有域名访问 res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization'); res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE'); next(); }); app.get('/api/data', (req, res) => { res.json({ message: '这是来自本地服务器的数据' }); }); app.listen(8080, () => console.log('Server is running on port 8080')); ``` - **绑定测试域名**:由于微信小程序的安全机制,默认情况下无法直接调用未备案的 IP 地址作为 API 接口地址。因此,建议使用一个合法的顶级域名指向本地服务器(可通过 ngrok 或类似的工具临时暴露本地网络)。 #### 3. 修改项目配置文件 编辑项目的 `project.config.json` 文件,添加调试基础库版本以及自定义编译选项等内容。同时确认 `app.json` 的路由表已正确声明页面路径。 #### 4. 测试与验证 利用微信开发者工具中的「真机调试」模式连接手机设备进行实际运行效果检验。注意观察控制台日志输出是否有异常提示信息,并调整相应逻辑直至完全正常为止。 --- ### 注意事项 - 如果仅用于学习目的而不涉及正式上线的话,那么可以选择忽略部分严格规定比如 HTTPS 加密传输等;但如果计划提交审核则务必遵循官方文档给出的标准流程执行每一步骤。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值