How to implement upload and download functions with PHP and UniApp

How PHP and UniApp implement upload and download functions

In modern Internet applications, it is a very common requirement to implement file upload and download functions. PHP is a powerful server-side scripting language, and UniApp is a cross-platform development framework based on Vue. This article will introduce how to use PHP and UniApp to implement file upload and download functions, and provide corresponding code examples.

1. Implementation of upload function

In UniApp, you can use the uni.uploadFile() function to upload files. First, we need to add an upload button to the UniApp page and bind the corresponding event listener.

<template>
  <view>
    <button @click="chooseImage">选择图片</button>
    <button @click="uploadImage">上传图片</button>
  </view>
</template>

Then, write the event handler function for selecting pictures and uploading pictures in the script tag of the corresponding page.

<script>
export default {
  methods: {
    chooseImage() {
      uni.chooseImage({
        count: 1, // 可选择图片的数量
        success: (res) => {
          this.imagePath = res.tempFilePaths[0] // 选择的图片路径
        }
      })
    },
    uploadImage() {
      uni.uploadFile({
        url: 'http://your-domain.com/upload.php', // 上传接口地址
        filePath: this.imagePath, // 选择的图片路径
        name: 'file', // 服务器接收的文件字段名
        success: (res) => {
          console.log('上传成功', res)
        }
      })
    }
  }
}
</script>

In the above code, the function uni.chooseImage() that selects pictures will pop up the system's picture selector. The user can select a picture from the album and save the selected picture path to the data. imagePath variable. The function uni.uploadFile() for uploading images will upload the selected image file to the specified server address.

Next, we need to use PHP on the server side to handle file upload. You can use the $_FILES array to access uploaded file information. The following is sample code for a simple upload.php file.

<?php
$targetDir = "uploads/";
$targetFile = $targetDir . basename($_FILES["file"]["name"]);

if(move_uploaded_file($_FILES["file"]["tmp_name"], $targetFile)){
    echo "上传成功";
}else{
    echo "上传失败";
}
?>

In the upload.php file, we first specify the directory $targetDir where the file is saved, and use the basename() function to obtain the file name of the uploaded file. Then, use the move_uploaded_file() function to move the uploaded temporary file to the specified directory. Finally, based on the result of moving the file, the corresponding upload success or failure information is output.

2. Implementation of download function

In UniApp, the file download function can be easily realized through the uni.downloadFile() function. We only need to add a download button to the page and write the corresponding event handling function.

<template>
  <button @click="downloadFile">下载文件</button>
</template>

Then, you need to write the event handler function for downloading the file in the script tag of the page.

<script>
export default {
  methods: {
    downloadFile() {
      uni.downloadFile({
        url: 'http://your-domain.com/files/file.pdf', // 下载链接
        success: (res) => {
          console.log('下载成功', res)
          uni.saveFile({
            tempFilePath: res.tempFilePath, // 下载成功后的临时文件路径
            success: (res) => {
              console.log('保存成功', res)
            }
          })
        }
      })
    }
  }
}
</script>

In the above code, the function uni.downloadFile() that downloads the file will download the file to a temporary directory, and save the temporary file path after the download is successful to res.tempFilePath. We can use the uni.saveFile() function to save temporary files to local storage for subsequent use.

So far, we have completed the introduction of how PHP and UniApp implement the file upload and download functions. Using the above code example, you can easily upload and download files in your Internet application. Hope this article can be helpful to you!

The above is the detailed content of How to implement upload and download functions with PHP and UniApp. For more information, please follow other related articles on the PHP Chinese website!