目录
启动项目
配置Nginx
测试项目
结语
首页 微信小程序 小程序开发 手把手教你怎么部署微信小程序并上线

手把手教你怎么部署微信小程序并上线

Dec 03, 2021 am 10:18 AM
微信小程序

怎么部署微信小程序并上线?下面本篇文章分享一个部署微信小程序的过程并上线微信小程序,希望对大家有所帮助!

手把手教你怎么部署微信小程序并上线

今天将简单介绍将项目部署到服务器中,并将前端代码提交到微信待审核。下面直接开始正题。 

启动项目

  后端基于SpringBoot的微信小程序服务的所有接口已经开发完成,那么现在开始将服务部署到云服务器中,登录服务器。

1.png

使用Maven将项目打包完成,

2.png

将项目的文件打包上传到服务器中

3.png

  通过命令 ls 可以看到已经将文件上传到服务器了。使用命令:java -jar BootWxTool-0.0.1-SNAPSHOT.jar 启动Spring Boot项目。启动过程如下图。

java -jar BootWxTool-0.0.1-SNAPSHOT.jar

4.png

  项目启动完成之后,无法访问服务,可能是安全组没有配置,到服务器一看,没有配置安全组,将项目中使用到的端口在服务器安全组中进行配置。

5.png

配置Nginx

将安全组配置之后,还需要配置Nginx进行转发,本次使用的端口不是80端口。找到Nginx配置文件所在位置:

/www/server/nginx/conf

通过命令vim nginx.conf查看配置文件的路径为:因此需要到这个路径下对服务进行配置。

include /www/server/panel/vhost/nginx/*.conf;

6.png

进入到配置文件所在的文件夹

cd /www/server/panel/vhost/nginx/

新建一个文件

mkdir wxtool.conf

  输入如下信息,listen后面是需要监听的端口信息,server_name是需要配置的域名信息。root后面跟着的是项目所在的路径信息。需要注意的是要加入代理信息。否则可能无法访问到项目路径。proxy_***之后的信息就是需要配置的代理信息了。ssl_certificate和ssl_certificate_key是申请的SSL文件的路径信息。

server
{
    listen 80;
    listen 443 ssl http2;
    server_name weixin.******.com;
    index index.php index.html index.htm default.php default.htm default.html;
    root /java/springboot;
    if ($server_port !~ 443){
        rewrite ^(/.*)$ https://$host$1 permanent;
    }
	
	location / {
    proxy_pass http://127.0.0.1:8080;
    proxy_set_header Host $host:80;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	}
    #HTTP_TO_HTTPS_END
    ssl_certificate    /etc/letsencrypt/live/weixin/6199589_weixin.ruankaoti.com.pem;
    ssl_certificate_key    /etc/letsencrypt/live/weixin/6199589_weixin.ruankaoti.com.key;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 10m;
    error_page 497  https://$host$request_uri;

    #SSL-END
    
  
    error_page 404 /404.html;
    error_page 502 /502.html;
    #ERROR-PAGE-END
    
    
    #禁止访问的文件或目录
    location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md)
    {
        return 404;
    }
 
    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
    {
        expires      30d;
        error_log off;
        access_log off;
    }
    
    location ~ .*\.(js|css)?$
    {
        expires      12h;
        error_log off;
        access_log off; 
    }
    access_log  /www/wwwlogs/weixin.*****.com.log;
    error_log  /www/wwwlogs/weixin.*****.com.error.log;
}

当配置文件和申请的SSL证书都配置完成之后,在宝塔页面Nginx管理台中点击重载配置即可。

7.png

测试项目

在浏览器中输入我们配置的域名信息https://weixin.****.com  可以看到已经可以正常访问网页了。

8.png

打开微信开发者工具,将域名信息配置到文件中,进行测试可以正常访问,截图如下:

9.png

  然后将前端的代码上传到测试版本,然后递交审核之后就可以正常发布了。整个审核流程预计一天左右。审核完成之后,需要管理人员登录到微信公众平台得后台进行上线,上线以后,大家就可以在小程序中访问项目了。给大家上一张已经发布上线的项目截图。

10.png

结语

  好了,以上就是记录一次部署微信小程序的过程并上线微信小程序,感谢您的阅读,希望您喜欢,如对您有帮助,欢迎点赞收藏。如有不足之处,欢迎评论指正。下次见。

【相关学习推荐:小程序开发教程

以上是手把手教你怎么部署微信小程序并上线的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

闲鱼微信小程序正式上线 闲鱼微信小程序正式上线 Feb 10, 2024 pm 10:39 PM

闲鱼官方微信小程序悄然上线,在小程序中可以发布闲置与买家/卖家私信交流、查看个人资料及订单、搜索物品等,有用好奇闲鱼微信小程序叫什么,现在快来看一下。闲鱼微信小程序叫什么答案:闲鱼,闲置交易二手买卖估价回收。1、在小程序中可以发布闲置、与买家/卖家私信交流、查看个人资料及订单、搜索指定物品等功能;2、在小程序的页面中有首页、附近、发闲置、消息、我的5项功能;3、想要使用的话必要要开通微信支付才可以购买;

实现微信小程序中的图片滤镜效果 实现微信小程序中的图片滤镜效果 Nov 21, 2023 pm 06:22 PM

实现微信小程序中的图片滤镜效果随着社交媒体应用的流行,人们越来越喜欢在照片中应用滤镜效果,以增强照片的艺术效果和吸引力。在微信小程序中也可以实现图片滤镜效果,为用户提供更多有趣和创造性的照片编辑功能。本文将介绍如何在微信小程序中实现图片滤镜效果,并提供具体的代码示例。首先,我们需要在微信小程序中使用canvas组件来加载和编辑图片。canvas组件可以在页面

实现微信小程序中的下拉菜单效果 实现微信小程序中的下拉菜单效果 Nov 21, 2023 pm 03:03 PM

实现微信小程序中的下拉菜单效果,需要具体代码示例随着移动互联网的普及,微信小程序成为了互联网开发的重要一环,越来越多的人开始关注和使用微信小程序。微信小程序的开发相比传统的APP开发更加简便快捷,但也需要掌握一定的开发技巧。在微信小程序的开发中,下拉菜单是一个常见的UI组件,实现了更好的用户操作体验。本文将详细介绍如何在微信小程序中实现下拉菜单效果,并提供具

闲鱼微信小程序叫什么 闲鱼微信小程序叫什么 Feb 27, 2024 pm 01:11 PM

闲鱼官方微信小程序已经悄然上线,它为用户提供了一个便捷的平台,让你可以轻松地发布和交易闲置物品。在小程序中,你可以与买家或卖家进行私信交流,查看个人资料和订单,以及搜索你想要的物品。那么闲鱼在微信小程序中究竟叫什么呢,这篇教程攻略将为您详细介绍,想要了解的用户们快来跟着本文继续阅读吧!闲鱼微信小程序叫什么答案:闲鱼,闲置交易二手买卖估价回收。1、在小程序中可以发布闲置、与买家/卖家私信交流、查看个人资料及订单、搜索指定物品等功能;2、在小程序的页面中有首页、附近、发闲置、消息、我的5项功能;3、

微信小程序实现图片上传功能 微信小程序实现图片上传功能 Nov 21, 2023 am 09:08 AM

微信小程序实现图片上传功能随着移动互联网的发展,微信小程序已经成为了人们生活中不可或缺的一部分。微信小程序不仅提供了丰富的应用场景,还支持开发者自定义功能,其中包括图片上传功能。本文将介绍如何在微信小程序中实现图片上传功能,并提供具体的代码示例。一、前期准备工作在开始编写代码之前,我们需要先下载并安装微信开发者工具,并注册成为微信开发者。同时,还需要了解微信

使用微信小程序实现轮播图切换效果 使用微信小程序实现轮播图切换效果 Nov 21, 2023 pm 05:59 PM

使用微信小程序实现轮播图切换效果微信小程序是一种轻量级的应用程序,具有简单、高效的开发和使用特点。在微信小程序中,实现轮播图切换效果是常见的需求。本文将介绍如何使用微信小程序实现轮播图切换效果,并给出具体的代码示例。首先,在微信小程序的页面文件中,添加一个轮播图组件。例如,可以使用<swiper>标签来实现轮播图的切换效果。在该组件中,可以通过b

实现微信小程序中的图片旋转效果 实现微信小程序中的图片旋转效果 Nov 21, 2023 am 08:26 AM

实现微信小程序中的图片旋转效果,需要具体代码示例微信小程序是一种轻量级的应用程序,为用户提供了丰富的功能和良好的用户体验。在小程序中,开发者可以利用各种组件和API来实现各种效果。其中,图片旋转效果是一种常见的动画效果,可以为小程序增添趣味性和视觉效果。在微信小程序中实现图片旋转效果,需要使用小程序提供的动画API。下面是一个具体的代码示例,展示了如何在小程

实现微信小程序中的滑动删除功能 实现微信小程序中的滑动删除功能 Nov 21, 2023 pm 06:22 PM

实现微信小程序中的滑动删除功能,需要具体代码示例随着微信小程序的流行,开发者们在开发过程中经常会遇到一些常见功能的实现问题。其中,滑动删除功能是一个常见、常用的功能需求。本文将为大家详细介绍如何在微信小程序中实现滑动删除功能,并给出具体的代码示例。一、需求分析在微信小程序中,滑动删除功能的实现涉及到以下要点:列表展示:要显示可滑动删除的列表,每个列表项需要包

See all articles