微信小程序——设置Springboot本地服务器端口和地址，从而访问项目外文件夹的内容

版权声明：转载需征得博主同意，侵删。 https://blog.csdn.net/qq_39635610/article/details/86487230

例如现在有个功能，是实现图片上传到服务器并返回图片地址进行前端渲染的功能。

首先我们的思路如下：

1、微信小程序端选择图片--->2、上传到服务器--->3、将图片写入指定文件夹--->4、再将文件所在的地址记录到数据库(服务器地址)--->5、返回数据库中图片的地址于前端赋值。

由于前三步已经在上一篇博文完成，这里就不再过多阐述，我们将本次内容的重点放在第四、五步。

在完成第三步时，我第一时间想到的是将绝对路径，直接赋予微信小程序端image标签中的的src，

例如：

[code]<image class = "image-example"
src = "C:\Users\Admin\Desktop\example.jpg">
</image>

经过测试以及查阅相关资料，这种在项目外采用绝对路径的访问方式是错误的。

于是去网上查找了其他方法，有另一种加载本地图片资源的方式就是通过小程序自身项目中的image文件夹进行访问

然后image标签的内容改为

[code]<image class = "image-example"
src = "../image/example.jpg">
</image>

这种形式虽然可以达到加载图片的效果，但是图片是存放在前端小程序项目内的，如果该文件夹的图片过多或者过大，导致小程序越来越大（何况小程序大小也有限制），因此，这个目录用来存放用户图片也是不合理的。

那么有没有一种方式，既可以满足我们访问项目外其他文件夹的文件，又能保证其能够正确返回前端加载呢？

答案是肯定的。

此时我们回来看看springboot项目

IntelliJ IDEA---springboot---内置tomcat

端口：8080

端口下的内容：Hello World

于是一个想法油然而生：我们可以通过设置与修改springboot的访问地址与绝对路径的映射，达到通过访问地址去取绝对地址文件夹中的内容。

有了这个想法，我们去设置springboot的相关代码。

找到springboot的application.properties文件，补充两行代码：

[code]##这里选择D盘下的WeChat文件夹作为对外访问的目录，可以根据具体需求设置
spring.resources.static-locations=file:D:\\WeChat

##表示所有的访问都经过静态资源路径
spring.mvc.static-path-pattern=/**

然后将example.jpg文件放入D:\\WeChat目录，再运行项目，在浏览器中访问http://localhost:8080/example.jpg

浏览器能够显示图片，说明设置项目外文件夹访问成功，此时已经成功了一半。

那么又回到最初的问题上，我们现在既然能访问其他文件夹的图片了，我们就要把这个地址送到微信小程序将图片显示出来。

有了地址，就简单很多了，在我上一篇博文代码的基础上，我们只需要在文件名之前添加图片所在文件夹的访问地址。

例如我的图片存放在D:\\WeCha\\Pic\\example.jpg，那么我就将文件名设置成网络地址+图片名并写入数据库。

[code]String httpUrl = "http://localhost:8080/Pic/";
String picName = httpUrl + "图片名";
//调用service服务将图片的完整地址写入数据库
picService.addPic(picName);

数据库图片的地址如下

至此，小程序端已经可以进行这种方式的图片访问了（记得勾选”不校验合法域名.....https证书“那个选项）。

如果要部署项目到服务器，设置自己的域名即可。