Shulou(Shulou.com)06/01 Report--

This article mainly explains "how Mini Program interacts with the back-end Java interface to achieve HelloWorld", interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Now let the editor take you to learn "how Mini Program interacts with the back-end Java interface to achieve HelloWorld".

Step 1: simply create a SpringBoot project at the back end to provide a helloWorld interface

2.2.6.RELEASE is selected for version.

Package com.java1234.controller;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RestController;/** * @ author java1234_ Xiaofeng * @ site www.java1234.com * @ company Nantong Xiaofeng Network Technology Co., Ltd * @ create 2021-07-04 17:43 * / @ RestControllerpublic class HelloWorldController {@ GetMapping ("/ helloWorld") public String helloWorld (Integer id) {return "helloWorld" + id;}}

Application.yml

Server: port: 80 servlet: context-path: / tomcat: uri-encoding: utf-8

Browser access: http://localhost/helloWorld?id=1

The page shows:

HelloWorld 1

Step 2: create a new helloWorld WeChat Mini Programs and request the backend

HelloWorld.js

Call the back-end interface through WeChat Mini Programs API wx.request

/ / pages/helloWorld.jsPage (initial data of {/ * page * / data: {result: "request backend..."}, / * Lifecycle function-listen page load * / onLoad: function (options) {var that=this; this.getData (that) }, getData (that) {wx.request ({url: "http://localhost/helloWorld", method:" GET ", data: {id:100}, header: {" content-type ":" application/json "/ / default}, success (res) {console.log (res.data) Console.log (that) that.setData ({result:res.data})})}, / * Lifecycle function-first rendering of listening page completed * / onReady: function () {}, / * Lifecycle function-listening page display * / onShow: function () {} / * Lifecycle function-- listening to Page Hidden * / onHide: function () {}, / * Lifecycle function-listening to Page unloading * / onUnload: function () {}, / * Page related event handling function-listening for user drop-down actions * / onPullDownRefresh: function () {} / * Handler function for pull bottoming event on the page * / onReachBottom: function () {}, / * users click on the upper right corner to share * / onShareAppMessage: function () {}})

HelloWorld.wxml

Return value: {{result}}

The operation reported an error:

VM8 asdebug.js:1 Cannot send network request to localhost. (env: Windows,mp,1.05.2105170; lib: 2.18.0)

Here we need to set the following:

Details-> Local Settings-> check "do not verify legal domain name, web-view (business domain name), TLS version and HITPS certificate"

When checked, recompile and run OK

Under the extension, if it is called by a domain name, for example, change http://localhost to http://www.java1234.com

Error report:

If you have updated the domain name configuration in the administrative background, please refresh the project configuration and recompile the project. Operation path: "details-Domain name Information"

VM8 asdebug.js:1 http://www.java1234.com is not in the following list of legitimate domain names for request

WeChat Mini Programs has some restrictions on the calling of domain names, which need to be configured, for example, only https is supported, and domain names cannot use IP addresses (except the local area network IP of Mini Program) or localhost

Please configure the server domain name in "Mini Program backend-Development-Development Settings-Server Domain name":

At this point, I believe you have a deeper understanding of "how Mini Program interacts with the back-end Java interface to implement HelloWorld". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.