Question

我用php后端使用ionic和angular创建了应用程序。

我可以按照下面的训练将图像从角度上传到php服务器。

Upload.js

$scope.onProfileFileSelect = function($files) {
//$files: an array of files selected, each file has name, size, and type.
for (var i = 0; i < $files.length; i++) {
var $file = $files[i];
console.log($file.name);
$upload.upload({
url: 'http://www.testphp.com/upload.php',
file: $file,
progress: function(e){}
}).then(function(response) {
// file is uploaded successfully
$timeout(function() {
console.log(response.data);
});
}); 
}
}

Upload.html

<div class="item item-input item-icon-right">
<span class="input-label">Capture your profile picture: </span>                
<input type="file" name="ProfilePath" ng-model="inmateData.IMProfilePhotoPath" ng-file-select="onProfileFileSelect($files)" multiple />
</div>

upload.php的

<?php

if (isset($_SERVER['HTTP_ORIGIN'])) 
{
header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}");
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Max-Age: 86400');    // cache for 1 day
}

// Access-Control headers are received during OPTIONS requests
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {

if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
header("Access-Control-Allow-Methods: GET, POST, OPTIONS");         

if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
header("Access-Control-Allow-Headers:        {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");

exit(0);
}

$target_dir = "Inmate_Images/";
$target_file = $target_dir . basename($_FILES["file"]["name"]);
$result = move_uploaded_file($_FILES["file"]["tmp_name"], $target_file);
echo json_encode($_FILES["file"]);
echo($result);
?>

截至目前，我可以上传所选图像并存储在我的PHP服务器中＃34; Inmate_Images＆＃34;夹。

我的要求是：

我需要更改图像文件名，然后将其上传到服务器中。
如何使用get请求和我上传时提供的名称来获取图像。 ??

如何处理此活动的任何想法？

Answer 1

如上所述我的要求第二点我找到答案请找到下面的答案。任何建议请告诉我。

preview.html

<img ng-src="http://www.testphp.com/Inmate_Images/mike.png" style="height:75px; padding: 5px 5px 5px 5px;"/>

问题是你只需在服务器中获取图像文件夹的路径，就可以使用＆lt;直接显示它。 img＆gt;标签

但我的问题是如何从＆lt;中选择时更改图像文件名？ input type = file＆gt;标签因为我想在上传时更改文件名，所以我更容易再次获取文件。

从angular到php服务器上传和检索图像

1 个答案: