WeChat 애플릿에 대한 http 요청을 설정하는 단계 정보

이 글에서는 WeChat 미니 프로그램에서 http 요청을 수행하는 방법에 대한 자세한 단계를 소개합니다. 도움이 필요한 친구라면 누구나 WeChat 미니 프로그램에서 네트워크 요청을 배우는 데 도움이 될 것입니다.

http 요청 소개

HTTP(HyperText Transfer Protocol)는 컴퓨터가 네트워크를 통해 통신하는 일련의 규칙입니다. 컴퓨터 전문가들은 HTTP 클라이언트(웹 브라우저 등)가 HTTP 서버(웹 서버)로부터 정보와 서비스를 요청할 수 있도록 HTTP를 설계했습니다. HTTP 프로토콜의 현재 버전은 1.1이며, Stateless는 웹을 의미합니다. 브라우저와 웹 서버 사이에 지속적인 연결을 설정할 필요가 없습니다. 즉, 클라이언트가 서버에 요청하고 웹 서버가 응답을 반환하면 연결이 닫히고 연결에 대한 정보가 서버에 유지되지 않습니다. Information.HTTP는 요청/응답 모델을 따릅니다. 웹 브라우저는 웹 서버에 요청을 보내고, 웹 서버는 요청을 처리하고 적절한 응답을 반환합니다. 모든 HTTP 연결은 요청과 응답의 집합으로 구성됩니다.

WeChat 애플릿은 http 요청을 설정합니다

WeChat 애플릿의 네트워크 통신은 지정된 도메인 이름과만 통신할 수 있습니다. WeChat 애플릿에는 네 가지 유형의 네트워크 요청이 포함됩니다.

1. 일반 HTTPS 요청(wx.request) wx.request)

     2、上传文件(wx.uploadFile)

     3、下载文件(wx.downloadFile)

     4、WebSocket通信(wx.connectSocket)

这里以介绍wx.request,wx.uploadFile,wx.dowloadFile三种网络请求为主

设置域名

要微信小程序进行网络通信，必须先设置域名，不然会出现错误:

URL 域名不合法，请在 mp 后台配置后重试

需要在微信公众平台的小程序中设置域名。

在微信小程序的设置界面可以看到设置选项：

设置
选择开发设置：

开发设置

可以看到服务器设置:

服务器设置

在这里可以设置对应四种网络访问的域名，每一种类型的网络请求需要设置一个域名，注意如果在这里设置域名为https://example.com/api/,那么https://example.com/api是无法调用的，必须加上后面/。

http请求

使用wx.request可以发起一个http请求，一个微信小程序被限制为同时只有5个网络请求。

function queryRequest(data){ 
 wx.request({
 url:"https://example.com/api/",
 data:data,
 header:{
 // "Content-Type":"application/json"
 },
 success:function(res){
 console.log(res.data)
 },
 fail:function(err){
 console.log(err)
 }

 })

}

上面的代码会发送一个http get请求，然后打印出返回的结果。其中的参数也比较容易理解。

    url 服务器的url地址

    data 请求的参数可以采用String data:"xxx=xxx&xxx=xxx"的形式或者Object data:{"userId":1}的形式

    header 设置请求的header

    success 接口成功的回调

    fail 接口失败的回调

另外还有两个参数没有在代码里:

     method http的方法,默认为GET请求

     complete 调用接口结束之后的回调，无论成功或者失败该接口都会被调用

上传文件

上传文件的api为wx.uploadFile，该api会发起一个http post请求，其中的Content-type为multipart/form-data。服务器端需要按照该Content-type类型接收文件,示例代码：

function uploadFile(file,data) {
 wx.uploadFile({
 url: 'http://example.com/upload',
 filePath: file,
 name: 'file',
 formData:data,
 success:function(res){
 console.log(res.data)
 },
 fail:function(err){
 console.log(err)
 }

 })

}

其中的url，header，success，fail以及complete和普通的http请求是一样的。

这里有区别的参数是:

     name文件对应的key，服务器端需要通过name参数获取文件

     formData http

2. 파일 업로드(wx.uploadFile) 3. 파일 다운로드(wx .downloadFile)<p><span style="color: #ff0000"><strong> 4. WebSocket 통신 (<code>wx.connectSocket)
여기에서는 wx.request, wx.uploadFile을 소개합니다. , <code>wx.dowloadFile 네트워크 요청에는 세 가지 주요 유형이 있습니다

🎜🎜🎜도메인 이름 설정🎜🎜🎜🎜🎜WeChat 애플릿이 네트워크를 통해 통신하도록 하려면 도메인 이름을 설정해야 합니다. 먼저 그렇지 않으면 오류가 발생합니다.🎜 🎜🎜URL 도메인 이름이 불법입니다. mp 배경 구성 후 다시 시도하세요🎜🎜🎜🎜미니에서 도메인 이름을 설정해야 합니다. WeChat 공개 플랫폼 프로그램. 🎜🎜WeChat 애플릿의 설정 인터페이스에서 설정 옵션을 볼 수 있습니다: 🎜

🎜Settings🎜개발 설정 선택:🎜

🎜개발 설정🎜🎜서버 설정을 볼 수 있습니다:🎜

🎜서버 설정🎜🎜여기에서 다음에 해당하는 도메인 이름을 설정할 수 있습니다. 네 가지 유형의 네트워크 액세스. 각 유형의 네트워크 요청에는 도메인 이름을 설정해야 합니다. 도메인 이름이 https://example.com/api/로 설정된 경우 https://example.com/api를 설정할 수 없습니다. 호출됩니다. 뒤에 /🎜가 와야 합니다. 🎜🎜🎜🎜http 요청🎜🎜🎜🎜🎜wx.request를 사용하여 http 요청을 시작하세요. WeChat 애플릿은 동시에 5개의 네트워크 요청으로 제한됩니다. 🎜

🎜

function downloadFile(url,typ,success){
 wx.downloadFile({
 url:url,
 type:typ,
 success:function(res){
 if(success){
 success(res.tempFilePath)
 }
 },
 fail:function(err){
 console.log(err)
 }
 })
}

🎜🎜🎜위 코드는 http get 요청을 보낸 다음 반환된 결과를 인쇄합니다. 매개변수도 비교적 이해하기 쉽습니다. 🎜🎜 url 서버의 URL 주소🎜🎜🎜 data 요청된 매개변수는 문자열 데이터 형식일 수 있습니다: "xxx=xxx&xxx=xxx" 또는 <code>객체 데이터:{"userId":1} 형식의 🎜🎜🎜 header 요청 헤더 설정🎜🎜🎜 success 인터페이스 성공 콜백🎜 F <code> 실패 인터페이스 실패 복구 🎜🎜🎜 다른 두 매개변수는 코드에 없습니다: 🎜🎜 메소드 http code>complete 는 인터페이스 호출 후의 콜백입니다. 인터페이스는 🎜🎜🎜🎜Upload files🎜🎜🎜🎜🎜파일 업로드용 API는 wx.uploadFile입니다. API는 Content-type이 multipart/form-data인 http post 요청을 시작합니다. 서버는 Content-type 유형에 따라 파일을 수신해야 합니다. 샘플 코드: 🎜

🎜

function svaeFile(tempFile,success){
 wx.saveFile({
 tempFilePath:tempFile,
 success:function(res){
 var svaedFile=res.savedFilePath
 if(success){
 success(svaeFile)
 }
 }
 })
}

🎜🎜🎜where url, 헤더, 성공, 실패 및 완료는 일반 http 요청과 동일합니다. 🎜🎜🎜여기서 다른 매개변수는 다음과 같습니다: 🎜🎜 key는 name 파일에 해당합니다. 서버는 name을 통해 파일을 얻어야 합니다. > 매개변수🎜🎜🎜 formData http요청에 사용할 수 있는 기타 매개변수🎜🎜🎜🎜🎜파일 다운로드🎜🎜🎜🎜

下载文件的api为wx.downloadFile,该api会发起一个http get请求，并在下载成功之后返回文件的临时路径，示例代码：

function downloadFile(url,typ,success){
 wx.downloadFile({
 url:url,
 type:typ,
 success:function(res){
 if(success){
 success(res.tempFilePath)
 }
 },
 fail:function(err){
 console.log(err)
 }
 })
}

其中的url,header,fail,complete和wx.uploadFile的参数使用是一致的，其中有区别的参数是:

     type:下载资源的类型，用于客户端自动识别，可以使用的参数image/audio/video<br>

     success：下载成功之后的回调，以tempFilePath的参数返回文件的临时目录：res={tempFilePath:'文件路径'}<br>

下载成功后的是临时文件，只会在程序本次运行期间可以使用，如果需要持久的保存，需要调用方法wx.saveFile主动持久化文件，实例代码:

function svaeFile(tempFile,success){
 wx.saveFile({
 tempFilePath:tempFile,
 success:function(res){
 var svaedFile=res.savedFilePath
 if(success){
 success(svaeFile)
 }
 }
 })
}

使用wx.saveFile保存临时文件到本地，提供给小程序下次启动时使用，其中的参数：

tempFilePath 需要被保存文件的路径

success 保存成功的回调，返回保存成功的路径，使用res.savedFilePath可以获取保存成功的路径

fail 失败的回调

complete结束的回调

超时的设置

可以在app.js中设置networkTimeout可以设置四种类型网络访问的超时时间：

"networkTimeout":{
 "request": 10000,
 "connectSocket": 10000,
 "uploadFile": 10000,
 "downloadFile": 10000
}

这里设置的超时时间对应着四种类型的网络请求。

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！

相关推荐：

微信小程序开发教程之增加mixin扩展

微信小程序的MINA文件结构的介绍

微信小程序要怎么选择SSL证书类型

위 내용은 WeChat 애플릿에 대한 http 요청을 설정하는 단계 정보의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!