uni-app App文件上传功能，兼容ios和安卓

在uni-app中实现文件上传功能，并确保兼容iOS和Android，可以利用uni-app提供的文件上传API。以下是一个简单的代码示例，展示了如何实现文件上传功能：

1. 前端页面代码（pages/upload/upload.vue）

<template>
  <view>
    <button type="primary" @click="chooseImage">选择图片</button>
    <button type="primary" @click="uploadFile" :disabled="!filePath">上传图片</button>
    <image v-if="filePath" :src="filePath" style="width: 100px; height: 100px;"></image>
  </view>
</template>

<script>
export default {
  data() {
    return {
      filePath: ''
    };
  },
  methods: {
    chooseImage() {
      uni.chooseImage({
        count: 1,
        success: (res) => {
          this.filePath = res.tempFilePaths[0];
        },
        fail: (err) => {
          console.error('chooseImage failed:', err);
        }
      });
    },
    uploadFile() {
      uni.uploadFile({
        url: 'https://your-server-url/upload', // 替换为你的服务器上传接口
        filePath: this.filePath,
        name: 'file',
        formData: {
          user: 'test'
        },
        success: (uploadFileRes) => {
          const data = JSON.parse(uploadFileRes.data);
          console.log('Upload success:', data);
        },
        fail: (err) => {
          console.error('Upload failed:', err);
        }
      });
    }
  }
};
</script>

<style>
/* 添加一些简单的样式 */
button {
  margin: 10px 0;
}
</style>

2. 服务器端代码示例（Node.js）

这里假设你使用的是Node.js和Express来处理文件上传：

const express = require('express');
const multer = require('multer');
const path = require('path');
const app = express();
const port = 3000;

const storage = multer.diskStorage({
  destination: function (req, file, cb) {
    cb(null, 'uploads/');
  },
  filename: function (req, file, cb) {
    cb(null, Date.now() + path.extname(file.originalname));
  }
});

const upload = multer({ storage: storage });

app.post('/upload', upload.single('file'), (req, res) => {
  res.json({ message: 'File uploaded successfully', file: req.file });
});

app.listen(port, () => {
  console.log(`Server is running at http://localhost:${port}`);
});

注意事项

1. 文件路径：确保服务器上的uploads/目录存在，并且有写权限。
2. 跨域问题：如果前端和后端不在同一个域下，需要在服务器端处理跨域请求。
3. 错误处理：在实际应用中，需要更完善的错误处理机制，比如文件类型检查、文件大小限制等。

上述代码示例展示了如何在uni-app中实现文件上传功能，并确保在iOS和Android上兼容。通过调整服务器端代码，可以轻松地适应不同的后端技术栈。