在离子应用程序中从计算机中选择图像以将其提供给服务器

Question

我的离子应用程序有时在浏览器中使用，我需要上传一些图像。我已经实现了一个代码来选择我的文件，然后我有一个formData类型可以放入我的图像。我正在尝试使用发布请求将我的文件上传到服务器，但我不知道该怎么做。

当我在我的 php 代码中收到我的文件时，我将它插入到我的数据库中，我的数据库中有一个 blob 文件，但我认为它不是图像，它太小了......

html文件：

  <input

  style="display: none"

  type="file" (change)="onFileChanged($event)"

  #fileInput>

<button (click)="fileInput.click()">Select File</button>

<button (click)="onUpload()">Upload!</button>

文件：

onFileChanged(event) {

    this.selectedFile = <File>event.target.files[0];

    console.log(this.selectedFile);

  }

  onUpload() {

    // upload code goes here

      // this.http is the injected HttpClient

  let uploadData = new FormData();

  uploadData.append('file', this.selectedFile, this.selectedFile.name);

  console.log(this.selectedFile);

   this.http.post(this.server + 'saveExo.php', this.selectedFile)

     .subscribe(resData => {

         console.log(resData);

     });

  }

PHP 文件：

<?php

header('Access-Control-Allow-Origin: *');

header('Access-Control-Allow-Credentials: true');

header('Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE');

header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization');

header('Content-Type: application/json; charset=UTF-8');

include "db.php";

$postjson = json_decode(file_get_contents('php://input'), true);

$today = date('Y-m-d');

if ( isset( $_POST) ) {

    $result = json_encode(array('receive' => 'ok'));

    $query = mysqli_query($mysqli, "INSERT INTO EXO SET 

    image = '$_POST'");

    echo $result;

} else {

    $result = json_encode(array('receive' => 'nothing'));

    echo $result;

}

?>

这是我在数据库中得到的：

感谢您的帮助，我认为将我的图像保存在我的数据库中是错误的方式......

Answer 1

我的解决方案是在客户端使用 base64 将您的图像转换为base64 ，然后将其存储在服务器上。要再次查看，请将 base64 发送到客户端并使用 base64 插件再次转换。