uniapp上传图片至服务器，获得在线图片链接预览（实战）

功能需求： 前端选择本地文件，将选择好的文件显示在界面上进行预览，可同时选择四张进行预览。 思路如下： 前端选择本地的png、jpg、等格式的图片，将图片以二进制的形式传到后端服务器，后端对二进制图片进行处理，返回给前端一个服务器链接在线图片，在浏览器就可以打开链接访问的那种。然后前端将这个图片链接渲染在页面进行预览。 首先 我们看一下uniapp的官方文档：https://uniapp.dcloud.io/api/media/image?id=chooseimage大概是这样的 先写一个模拟的demo 1：首先我是是用了colorUI的框架，在项目里面引入 在page底下的vue文件引入 这样一来，就不需要写什么样式了，直接使用写好的就行了。 效果是这样的 每次选完图片之后显示在页面上，我这里设置了最多可以选择四张，图片链接使用了临时的blob，接下来就要使用后端小伙伴给的接口，将自己本地的二进制文件传给他了。 在 chooseImage 选择好图片之后，写一个成功的回调函数，在回到函数里面添加一个图片上传的方法uploadFile，在方法里面添加url，等参数。 若是请求成功 则返回一个图片链接 添加接口之后 的，demo如下：

首先，下载实用工具箱

选择图片工具

选择图片转链接

输入图片的地址并电机转换即可把本地图片生成链接

扩展资料：

如果要让其他手机访问该图片链接，图片需要上传到服务器，需要注意的是：

1、图片一般单独保存在服务器，地址存储在数据库，并且做适当压缩，以减小传送压力。

2、可以采用FTP 或tcp  等协议上传，一般使用js。

3、数据库保存主键ID，IIS服务器需要创建虚拟目录保存图片。

4、图片服务器目录需要开通外网访问（共享）读写的权利，不然会读写失败。

5、根据时间戳保存，并且有容错措施。

6、常用的图片格式是gif和jpg

JPG格式：该格式的优点在于文件比较小，比如一张88k的gif格式的图片转换为jpg格式，只有20几k。所以，要想使您的网站空间容纳更多的图片，可以采取上传jpg格式的图片。

7、不要重复上传图片

每上传一张图片，图片库中就会保留，如果在其它网页上传相同的图片，可以直接从图片库中上传。或者复制该图片，可以节省宝贵的空间。

楼主你好

出现这种问题，一般有两种原因

服务器的 问题，服务器偶尔会出一些类似的问题，在所难免，重登就好了

你自己网络的问题，网络不稳定会导致掉线之类的

好好检查下，网络稳定重登就可以了

---