微信小程序——访问服务器媒体文件的实现步骤

embedded/2025/2/23 0:53:40/

在这里插入图片描述

✅作者简介:2022年博客新星 第八。热爱国学的Java后端开发者,修心和技术同步精进。
🍎个人主页:趣享先生的博客
🍊个人信条:不迁怒,不贰过。小知识,大智慧。
💞当前专栏:小程序>微信小程序学习分享
✨特色专栏:国学周更-心性养成之路
🥭本文内容:小程序>微信小程序——访问服务器媒体文件的实现步骤

文章目录

  • 引言
    • 1. 确保服务器可访问
      • 1.1 选择合适的服务器
      • 1.2 配置正确的域名和协议
      • 1.3 服务器端点的可访问性
      • 1.4 处理防火墙和安全组设置
      • 1.5 监控服务器状态
      • 1.6 处理错误和异常
      • 1.7 文档和API说明
      • 1.8 测试和调试
    • 2. 直接在小程序中使用 `<image>` 和 `<video>` 标签
      • 2.1 使用 `<image>` 标签展示图片
      • 2.2 使用 `<video>` 标签展示视频
      • 2.3 结合使用 `<image>` 和 `<video>` 标签
      • 2.4 处理动态数据
    • 3. 使用 `wx.request` 获取媒体文件列表
      • 3.1 `wx.request` 方法概述
      • 3.2 示例:获取媒体文件列表
      • 3.3 代码解析
      • 3.4 错误处理
    • 4. 显示动态获取的媒体文件
      • 4.1 获取媒体文件列表
      • 4.2 小程序端代码
      • 4.3 代码解析
      • 4.4 处理动态展示
      • 4.5 错误处理
    • 5. 处理跨域问题
      • 5.1 跨域问题的成因
      • 5.2 解决跨域问题的方法
        • 1. CORS(跨域资源共享)
        • 2. JSONP(JSON with Padding)
        • 3. 代理服务器
      • 5.3 测试和验证
      • 5.4 注意事项
    • 6. 测试和调试
      • 6.1 测试的重要性
      • 6.2 测试类型
        • 1. 单元测试
        • 2. 集成测试
        • 3. 功能测试
        • 4. 性能测试
      • 6.3 调试工具
        • 1. 微信开发者工具
        • 2. 使用断点调试
      • 6.4 常见调试技巧
      • 6.5 测试和调试的最佳实践
    • 总结

在这里插入图片描述

引言

  随着移动互联网的迅猛发展,小程序>微信小程序作为一种新兴的应用形态,凭借其轻量级和便捷性,迅速吸引了大量用户和开发者的关注。小程序不仅可以实现丰富的功能,还能与服务器进行高效的数据交互,展示多媒体内容。尤其是在社交、购物、教育等领域,图片和视频的展示成为提升用户体验的重要环节。

  在本篇博文中,我们将深入探讨如何在小程序>微信小程序中访问和展示来自服务器的图片和视频文件。通过具体的实现步骤,开发者将能够轻松地将媒体资源整合到小程序中,提升应用的互动性和吸引力。无论你是刚入门的小程序开发者,还是希望优化现有项目的资深开发者,这篇文章都将为你提供实用的指导和灵感。让我们一起探索这一过程,开启小程序开发的新篇章!

1. 确保服务器可访问

  在开发小程序>微信小程序时,确保服务器能够正常访问是至关重要的一步。这不仅关系到小程序的功能实现,也直接影响到用户的使用体验。以下是确保服务器可访问的几个关键要点:

1.1 选择合适的服务器

  首先,选择一个稳定且可靠的服务器是基础。可以选择云服务提供商(如阿里云、腾讯云、AWS等)来托管你的服务器。这些服务通常提供高可用性和良好的技术支持,能够满足大多数应用的需求。

  • 服务器:云服务提供商通常提供弹性计算资源,可以根据需求进行扩展,适合各种规模的应用。
  • 自建服务器:如果你有足够的技术能力和资源,也可以选择自建服务器,但需要考虑维护和安全性。

1.2 配置正确的域名和协议

  确保你的服务器有一个有效的域名,并且能够通过HTTP或HTTPS协议访问。小程序>微信小程序要求所有请求必须使用HTTPS协议,以确保数据传输的安全性。因此,获取并配置SSL证书是必不可少的步骤。

  • 获取SSL证书:可以通过云服务商或第三方证书颁发机构(如Let’s Encrypt)获取SSL证书。
  • 配置HTTPS:在服务器上配置SSL证书,使得服务器能够通过HTTPS协议提供服务。

1.3 服务器端点的可访问性

确保服务器的API端点可以被外部访问。可以通过以下方式进行测试:

  • 使用浏览器访问:在浏览器中输入API的URL,查看是否能够正常访问并返回预期的结果。
  • 使用Postman等工具:通过Postman等API测试工具发送请求,检查服务器的响应状态和数据格式。

1.4 处理防火墙和安全组设置

如果你的服务器部署在云平台上,可能会有防火墙或安全组的设置。确保相关端口(如80和443)是开放的,以允许外部请求访问。

  • 检查安全组规则:在云服务控制台中检查安全组规则,确保允许来自小程序的请求。
  • 配置防火墙:如果使用自建服务器,确保防火墙设置允许HTTP和HTTPS流量。

1.5 监控服务器状态

定期监控服务器的状态和性能,确保其始终在线并能够处理请求。可以使用监控工具(如Zabbix、Prometheus等)来实时监控服务器的健康状况。

  • 监控工具:使用监控工具可以实时获取服务器的CPU、内存、网络流量等信息,及时发现并解决问题。
  • 日志管理:记录服务器的访问日志和错误日志,帮助分析和排查问题。

1.6 处理错误和异常

在开发过程中,确保服务器能够处理各种错误情况,并返回适当的错误信息。例如,当请求的资源不存在时,返回404状态码;当服务器内部出现错误时,返回500状态码。这有助于开发者在调试时快速定位问题。

  • 标准化错误响应:设计统一的错误响应格式,方便前端处理和用户提示。
  • 异常处理机制:在服务器代码中实现异常处理机制,确保即使出现错误也不会导致服务器崩溃。

1.7 文档和API说明

为你的API编写详细的文档,说明各个接口的功能、请求参数、返回值等信息。这不仅有助于自己后续的维护,也方便其他开发者理解和使用你的API。

  • API文档工具:可以使用Swagger、Postman等工具生成API文档,方便团队协作和接口测试。
  • 示例代码:在文档中提供示例代码,帮助开发者快速上手。

1.8 测试和调试

在开发过程中,确保对服务器的访问进行充分的测试和调试。可以使用微信开发者工具进行调试,查看请求的返回结果和状态码,确保一切正常。

  • 调试工具:使用微信开发者工具的网络面板,查看请求的详细信息,包括请求头、响应头和返回数据。
  • 模拟环境:在开发和测试阶段,可以使用模拟服务器或本地环境进行测试,确保功能的正确性。

2. 直接在小程序中使用 <image><video> 标签

  在小程序>微信小程序中,使用 <image><video> 标签可以方便地展示图片和视频内容。这不仅能够提升用户体验,还能使应用更加生动和互动。以下将详细阐述如何使用这些标签,并结合示例代码进行说明。

2.1 使用 <image> 标签展示图片

<image> 标签用于在小程序中展示图片。其基本用法如下:

<image src="https://your-server.com/path/to/image.jpg" mode="aspectFit" />

属性说明:

  • src:图片的URL地址,必须是HTTPS协议的链接。
  • mode:图片的显示模式,支持多种模式,如:
    • scaleToFill:不保持纵横比缩放图片,使图片完全填充。
    • aspectFit:保持纵横比缩放图片,使图片的长边能完全显示出来。
    • aspectFill:保持纵横比缩放图片,只显示图片的一部分。
    • widthFix:宽度不变,高度自动变化。
    • heightFix:高度不变,宽度自动变化。

示例:展示单张图片

以下是一个简单的示例,展示如何在小程序中使用 <image> 标签展示一张图片:

<view><image src="https://your-server.com/path/to/image.jpg" mode="aspectFit" />
</view>

2.2 使用 <video> 标签展示视频

<video> 标签用于在小程序中展示视频。其基本用法如下:

<video src="https://your-server.com/path/to/video.mp4" controls></video>

属性说明:

  • src:视频的URL地址,必须是HTTPS协议的链接。
  • controls:是否显示视频控制器,设置为 controls 时会显示播放、暂停等控制按钮。
  • autoplay:是否自动播放视频,设置为 autoplay 时视频会在加载完成后自动播放。
  • loop:是否循环播放视频,设置为 loop 时视频播放完毕后会重新开始。
  • muted:是否静音播放,设置为 muted 时视频将以静音方式播放。

示例:展示视频

以下是一个简单的示例,展示如何在小程序中使用 <video> 标签展示一段视频:

<view><video src="https://your-server.com/path/to/video.mp4" controls autoplay loop></video>
</view>

2.3 结合使用 <image><video> 标签

  在实际应用中,可能需要同时展示图片和视频。以下是一个示例,展示如何在同一页面中结合使用这两个标签:

<view><text>欢迎观看我们的媒体内容</text><image src="https://your-server.com/path/to/image.jpg" mode="aspectFit" /><video src="https://your-server.com/path/to/video.mp4" controls autoplay loop></video>
</view>

2.4 处理动态数据

  如果需要动态加载图片和视频的URL,可以结合小程序的JavaScript逻辑来实现。以下是一个示例,展示如何从服务器获取媒体文件列表并动态展示:

示例代码(JavaScript):

// pages/index/index.js
Page({data: {mediaList: []},onLoad: function() {this.fetchMediaList();},fetchMediaList: function() {const that = this;wx.request({url: 'https://your-server.com/api/media', // 替换为你的API地址method: 'GET',success(res) {if (res.statusCode === 200) {that.setData({mediaList: res.data // 假设返回的是文件名数组});} else {console.error('请求失败:', res);}},fail(err) {console.error('请求错误:', err);}});}
});

示例代码(WXML):

<view><block wx:for="{{mediaList}}" wx:key="index"><image src="{{'https://your-server.com/path/to/' + item}}" mode="aspectFit" /><video src="{{'https://your-server.com/path/to/' + item}}" controls></video></block>
</view>

3. 使用 wx.request 获取媒体文件列表

  在小程序>微信小程序中,使用 wx.request 方法可以方便地向服务器发送请求,以获取动态数据。例如,当你需要从服务器获取媒体文件列表(如图片和视频的URL)时,可以使用 wx.request 来实现。以下将详细阐述如何使用 wx.request 获取媒体文件列表,并结合示例代码进行说明。

3.1 wx.request 方法概述

  wx.request小程序>微信小程序提供的网络请求API,允许开发者向服务器发送HTTP请求。其基本用法如下:

wx.request({url: 'https://your-server.com/api/media', // 请求的URLmethod: 'GET', // 请求方法success(res) { // 请求成功的回调// 处理返回的数据},fail(err) { // 请求失败的回调// 处理错误}
});

3.2 示例:获取媒体文件列表

  以下是一个完整的示例,展示如何在小程序中使用 wx.request 获取媒体文件列表,并将其展示在页面上。

1. 服务器端API示例

  首先,确保你的服务器有一个API接口可以返回媒体文件列表。以下是一个使用Node.js和Express框架实现的简单API示例:

const express = require('express');
const cors = require('cors');const app = express();
const PORT = 3000;// 使用CORS中间件
app.use(cors());// 示例API接口
app.get('/api/media', (req, res) => {// 返回媒体文件列表const mediaList = ['image1.jpg','video1.mp4','image2.jpg','video2.mp4'];res.json(mediaList);
});// 启动服务器
app.listen(PORT, () => {console.log(`Server is running on http://localhost:${PORT}`);
});
2. 小程序端代码示例

  在小程序中,你可以使用 wx.request 方法来请求上述API接口,并将返回的媒体文件列表展示在页面上。

JavaScript 代码(index.js):

// pages/index/index.js
Page({data: {mediaList: [] // 存储媒体文件列表},onLoad: function() {this.fetchMediaList(); // 页面加载时获取媒体文件列表},fetchMediaList: function() {const that = this;wx.request({url: 'https://your-server.com/api/media', // 替换为你的API地址method: 'GET',success(res) {if (res.statusCode === 200) {that.setData({mediaList: res.data // 假设返回的是文件名数组});} else {console.error('请求失败:', res);}},fail(err) {console.error('请求错误:', err);}});}
});

WXML 代码(index.wxml):

<view><text>媒体文件列表</text><block wx:for="{{mediaList}}" wx:key="index"><view><image src="{{'https://your-server.com/path/to/' + item}}" mode="aspectFit" /><video src="{{'https://your-server.com/path/to/' + item}}" controls></video></view></block>
</view>

3.3 代码解析

  1. 服务器端API

    • 使用Express框架创建一个简单的HTTP服务器,提供 /api/media 接口,返回一个包含媒体文件名的数组。
    • 使用CORS中间件,确保小程序能够跨域访问该API。
  2. 小程序

    • onLoad 生命周期函数中调用 fetchMediaList 方法,页面加载时自动获取媒体文件列表。
    • fetchMediaList 方法使用 wx.request服务器发送GET请求,获取媒体文件列表。
    • 在请求成功的回调中,检查响应状态码,如果为200,则将返回的数据存储到 mediaList 数据属性中。
    • 在WXML中使用 wx:for 循环遍历 mediaList,动态展示每个媒体文件。

3.4 错误处理

  在实际开发中,处理请求失败的情况非常重要。可以在 fail 回调中记录错误信息,并在页面上给用户反馈,例如:

fail(err) {console.error('请求错误:', err);wx.showToast({title: '加载失败,请重试',icon: 'none'});
}

4. 显示动态获取的媒体文件

  在小程序>微信小程序中,动态获取并展示媒体文件(如图片和视频)是提升用户体验的重要功能。通过结合 wx.request 获取媒体文件列表,并使用 WXML 进行展示,开发者可以实现灵活的内容展示。以下将详细阐述如何动态获取媒体文件并在小程序中显示,结合示例代码进行说明。

4.1 获取媒体文件列表

  首先,确保你已经实现了一个API接口,能够返回媒体文件的URL列表。以下是一个简单的Node.js服务器示例,提供 /api/media 接口,返回媒体文件的URL列表:

服务器端API示例(Node.js + Express)

const express = require('express');
const cors = require('cors');const app = express();
const PORT = 3000;// 使用CORS中间件
app.use(cors());// 示例API接口
app.get('/api/media', (req, res) => {// 返回媒体文件的完整URL列表const mediaList = ['https://your-server.com/path/to/image1.jpg','https://your-server.com/path/to/video1.mp4','https://your-server.com/path/to/image2.jpg','https://your-server.com/path/to/video2.mp4'];res.json(mediaList);
});// 启动服务器
app.listen(PORT, () => {console.log(`Server is running on http://localhost:${PORT}`);
});

4.2 小程序端代码

  在小程序中,使用 wx.request 方法获取媒体文件列表,并在页面上动态展示这些文件。

JavaScript 代码(index.js

// pages/index/index.js
Page({data: {mediaList: [] // 存储媒体文件列表},onLoad: function() {this.fetchMediaList(); // 页面加载时获取媒体文件列表},fetchMediaList: function() {const that = this;wx.request({url: 'https://your-server.com/api/media', // 替换为你的API地址method: 'GET',success(res) {if (res.statusCode === 200) {that.setData({mediaList: res.data // 假设返回的是完整URL数组});} else {console.error('请求失败:', res);}},fail(err) {console.error('请求错误:', err);wx.showToast({title: '加载失败,请重试',icon: 'none'});}});}
});

WXML 代码(index.wxml

<view><text>媒体文件列表</text><block wx:for="{{mediaList}}" wx:key="index"><view><image src="{{item}}" mode="aspectFit" style="width: 100%; height: auto;" /><video src="{{item}}" controls style="width: 100%; height: auto;"></video></view></block>
</view>

4.3 代码解析

  1. 服务器端API

    • 使用Express框架创建一个简单的HTTP服务器,提供 /api/media 接口,返回一个包含完整媒体文件URL的数组。
    • 使用CORS中间件,确保小程序能够跨域访问该API。
  2. 小程序

    • onLoad 生命周期函数中调用 fetchMediaList 方法,页面加载时自动获取媒体文件列表。
    • fetchMediaList 方法使用 wx.request服务器发送GET请求,获取媒体文件列表。
    • 在请求成功的回调中,检查响应状态码,如果为200,则将返回的数据存储到 mediaList 数据属性中。
    • 在WXML中使用 wx:for 循环遍历 mediaList,动态展示每个媒体文件。

4.4 处理动态展示

在WXML中,使用 wx:for 循环遍历 mediaList,并根据文件类型(图片或视频)选择合适的标签进行展示。以下是一个改进的示例,展示如何根据文件扩展名动态选择展示方式:

<view><text>媒体文件列表</text><block wx:for="{{mediaList}}" wx:key="index"><view><block wx:if="{{item.endsWith('.jpg')}}" ><image src="{{item}}" mode="aspectFit" style="width: 100%; height: auto;" /></block><block wx:if="{{item.endsWith('.mp4')}}" ><video src="{{item}}" controls style="width: 100%; height: auto;"></video></block></view></block>
</view>

4.5 错误处理

在实际开发中,处理请求失败的情况非常重要。可以在 fail 回调中记录错误信息,并在页面上给用户反馈,例如:

fail(err) {console.error('请求错误:', err);wx.showToast({title: '加载失败,请重试',icon: 'none'});
}

5. 处理跨域问题

  在开发小程序>微信小程序时,跨域问题是一个常见的挑战。跨域问题通常发生在浏览器中,当一个网页试图请求另一个域名下的资源时,浏览器会出于安全考虑阻止该请求。为了确保小程序能够顺利访问服务器资源,开发者需要采取一些措施来处理跨域问题。以下将详细阐述跨域问题的成因、解决方案以及相关示例。

5.1 跨域问题的成因

  跨域问题主要是由于浏览器的同源策略(Same-Origin Policy)引起的。根据同源策略,只有同源的网页才能互相访问。所谓同源是指协议、域名和端口都相同。例如:

  • 同源:https://example.com:443/page1https://example.com:443/page2
  • 不同源:https://example.com/page1http://example.com/page1(协议不同)
  • 不同源:https://example.com/page1https://api.example.com/page1(域名不同)

5.2 解决跨域问题的方法

  为了让小程序>微信小程序能够访问不同源的资源,通常需要在服务器端进行配置,允许跨域请求。以下是几种常见的解决方案:

1. CORS(跨域资源共享)

  CORS(Cross-Origin Resource Sharing)是一种允许服务器指定哪些源可以访问其资源的机制。通过设置HTTP响应头,服务器可以控制跨域请求的行为。

示例:Node.js + Express 设置CORS

在Node.js中,可以使用CORS中间件来轻松配置跨域访问。以下是一个示例:

const express = require('express');
const cors = require('cors');const app = express();
const PORT = 3000;// 使用CORS中间件
app.use(cors({origin: 'https://your-wechat-app.com', // 允许的源,可以设置为具体的域名或 '*'(允许所有)methods: ['GET', 'POST'], // 允许的请求方法allowedHeaders: ['Content-Type'], // 允许的请求头
}));// 示例API接口
app.get('/api/media', (req, res) => {const mediaList = ['https://your-server.com/path/to/image1.jpg','https://your-server.com/path/to/video1.mp4'];res.json(mediaList);
});// 启动服务器
app.listen(PORT, () => {console.log(`Server is running on http://localhost:${PORT}`);
});

在这个示例中,CORS中间件允许来自 https://your-wechat-app.com 的请求,并指定了允许的请求方法和请求头。

2. JSONP(JSON with Padding)

JSONP是一种通过动态创建<script>标签来实现跨域请求的技术。虽然JSONP可以解决GET请求的跨域问题,但它不支持POST请求,并且存在安全隐患,因此不推荐使用。

3. 代理服务器

在开发环境中,可以使用代理服务器来解决跨域问题。通过配置开发工具(如Webpack、Vue CLI等)中的代理选项,将请求转发到目标服务器

示例:Webpack 配置代理

// webpack.config.js
module.exports = {devServer: {proxy: {'/api': {target: 'https://your-server.com',changeOrigin: true,pathRewrite: { '^/api': '' },},},},
};

在这个示例中,所有以 /api 开头的请求都会被代理到 https://your-server.com,从而避免跨域问题。

5.3 测试和验证

在完成跨域配置后,可以使用以下方法测试是否成功:

  1. 使用浏览器开发者工具:打开开发者工具,查看网络请求的响应头,确认是否包含 Access-Control-Allow-Origin 等CORS相关的头部信息。
  2. 使用Postman等工具:发送请求到API接口,检查响应是否正常。

5.4 注意事项

  • 安全性:在配置CORS时,尽量避免使用 * 作为允许的源,特别是在生产环境中。应明确指定允许的域名,以降低安全风险。
  • 预检请求:对于某些复杂请求(如使用PUT、DELETE等方法),浏览器会先发送一个OPTIONS请求进行预检,确保服务器允许该请求。确保服务器能够正确处理OPTIONS请求。

6. 测试和调试

  在小程序>微信小程序的开发过程中,测试和调试是确保应用正常运行和用户体验良好的关键步骤。通过有效的测试和调试,开发者可以及时发现和修复问题,优化应用性能。以下将详细阐述测试和调试的策略、工具和方法。

6.1 测试的重要性

测试是验证应用功能是否按预期工作的过程。它可以帮助开发者:

  • 确保所有功能正常运行。
  • 发现并修复潜在的bug。
  • 提高用户体验,确保应用的稳定性和可靠性。

6.2 测试类型

小程序开发中,可以进行以下几种类型的测试:

1. 单元测试

单元测试是对应用中最小可测试单元(如函数、方法等)进行验证的过程。通过编写单元测试,开发者可以确保每个功能模块的正确性。

  • 工具:可以使用 Jest、Mocha 等 JavaScript 测试框架进行单元测试。
2. 集成测试

集成测试是对多个模块或组件之间的交互进行验证的过程。它可以帮助开发者确保不同模块能够协同工作。

  • 工具:可以使用 Cypress、Karma 等工具进行集成测试。
3. 功能测试

功能测试是对应用的功能进行验证,确保其符合需求规格说明。功能测试通常是手动进行的,开发者需要逐一测试每个功能。

  • 工具:可以使用微信开发者工具进行功能测试。
4. 性能测试

性能测试是对应用在不同负载下的响应时间、稳定性和资源消耗进行评估。通过性能测试,开发者可以识别性能瓶颈并进行优化。

  • 工具:可以使用 Lighthouse、WebPageTest 等工具进行性能测试。

6.3 调试工具

小程序>微信小程序开发中,微信开发者工具是最常用的调试工具。它提供了丰富的调试功能,帮助开发者快速定位和解决问题。

1. 微信开发者工具
  • 实时预览:可以在开发者工具中实时预览小程序的效果,查看UI布局和交互。
  • 调试面板:提供JavaScript调试功能,可以设置断点、查看变量值、调用栈等。
  • 网络面板:可以查看网络请求的详细信息,包括请求头、响应头、状态码和返回数据,帮助开发者分析网络问题。
  • 控制台:可以输出调试信息,使用 console.log() 打印变量值和错误信息,方便调试。
2. 使用断点调试

在开发者工具中,可以通过设置断点来逐步执行代码,观察程序的执行流程和变量的变化。这对于定位复杂逻辑中的问题非常有效。

6.4 常见调试技巧

  1. 使用 console.log():在代码中添加 console.log() 语句,输出变量值和执行状态,帮助分析问题。

    console.log('当前媒体列表:', this.data.mediaList);
    
  2. 检查网络请求:在网络面板中查看请求的状态和返回数据,确保API接口正常工作。

  3. 处理错误信息:在请求失败的回调中,输出错误信息,帮助快速定位问题。

    fail(err) {console.error('请求错误:', err);wx.showToast({title: '加载失败,请重试',icon: 'none'});
    }
    
  4. 逐步调试:使用断点逐步执行代码,观察变量的变化和程序的执行流程,帮助定位复杂逻辑中的问题。

6.5 测试和调试的最佳实践

  • 编写测试用例:在开发过程中,编写单元测试和集成测试用例,确保代码的可测试性。
  • 定期进行回归测试:在每次修改代码后,进行回归测试,确保新代码没有引入新的bug。
  • 使用版本控制:使用Git等版本控制工具,记录代码的变化,方便回溯和协作。
  • 收集用户反馈:在发布后,收集用户反馈,及时修复用户遇到的问题。

总结

  在小程序>微信小程序的开发过程中,确保应用的稳定性和良好的用户体验至关重要。通过有效的测试和调试策略,开发者可以及时发现和修复潜在问题,优化应用性能。本文详细阐述了测试的重要性、不同类型的测试方法、调试工具的使用以及常见的调试技巧。无论是通过单元测试、集成测试,还是利用微信开发者工具进行实时调试,开发者都应重视每一个环节,确保小程序在上线前经过充分的验证和优化。通过持续的测试和反馈收集,开发者能够不断提升小程序的质量,满足用户的需求,最终实现更高的用户满意度和应用成功。希望本文能为你的开发工作提供有价值的指导和参考。


  码文不易,本篇文章就介绍到这里,如果想要学习更多Java系列知识点击关注博主,博主带你零基础学习Java知识。与此同时,对于日常生活有困扰的朋友,欢迎阅读我的第四栏目:《国学周更—心性养成之路》,学习技术的同时,我们也注重了心性的养成。


http://www.ppmy.cn/embedded/164485.html

相关文章

解决 Plugin ‘org.springframework.boot:spring-boot-maven-plugin:‘ not found

idea显示如下报错 加上版本号 2.3.4.RELEASE 刷新依赖&#xff0c;报错即可消除

动态规划

简介 动态规划最核心两步&#xff1a; 状态表示&#xff1a;dp[i]代表什么状态转移方程&#xff1a;如何利用已有的dp求解dp[i] 只要这两步搞对了&#xff0c; 就完成了动态规划的%95 剩下的就是细节问题&#xff1a; dp初始化顺序&#xff08;有时是倒序&#xff09;处理边…

Spring Boot集成Swagger API文档:傻瓜式零基础教程

Springfox Swagger 是一个用于构建基于 Spring Boot 的 RESTful API 文档的开源工具。它通过使用注解来描述 API 端点&#xff0c;自动生成易于阅读和理解的 API 文档。Springfox 通过在运行时检查应用程序&#xff0c;基于 Spring 配置、类结构和各种编译时 Java 注释来推断 A…

Javascript网页设计案例:通过PDFLib实现一款PDF分割工具,分割方式自定义-完整源代码,开箱即用

功能预览 一、工具简介 PDF 分割工具支持以下核心功能: 拖放或上传 PDF 文件:用户可以通过拖放或点击上传 PDF 文件。两种分割模式: 指定范围:用户可以指定起始页和结束页,提取特定范围的内容。固定间距:用户可以设置间隔页数(例如每 5 页分割一次),工具会自动完成分…

deepseek清华大学第二版 如何获取 DeepSeek如何赋能职场应用 PDF文档 电子档(附下载)

deepseek清华大学第二版 DeepSeek如何赋能职场 pdf文件完整版下载 https://pan.baidu.com/s/1aQcNS8UleMldcoH0Jc6C6A?pwd1234 提取码: 1234 或 https://pan.quark.cn/s/3ee62050a2ac

【电机控制器】ESP32-C3语言模型——豆包

【电机控制器】ESP32-C3语言模型——豆包 文章目录 [TOC](文章目录) 前言一、简介二、代码三、实验结果四、参考资料总结 前言 使用工具&#xff1a; 提示&#xff1a;以下是本篇文章正文内容&#xff0c;下面案例可供参考 一、简介 二、代码 #include <WiFi.h> #inc…

Unity 淡入淡出

淡入&#xff08;Fade in&#xff09;&#xff1a;类似打开幕布 淡出&#xff08;Fade out&#xff09;&#xff1a;类似关上幕布 方案一 使用Dotween&#xff08;推荐&#xff09; using DG.Tweening; using UnityEngine; using UnityEngine.UI;public class Test : MonoB…

【git-hub项目:YOLOs-CPP】本地实现05:项目移植

ok&#xff0c;经过前3个博客&#xff0c;我们实现了项目的跑通。 但是&#xff0c;通常情况下&#xff0c;我们的项目都是需要在其他电脑上也跑通&#xff0c;才对。 然而&#xff0c;经过测试&#xff0c;目前出现了2 个bug。 项目一键下载【⬇️⬇️⬇️】&#xff1a; 精…