使用 VF 页面和 Apex 将图像上传到 S3
Uploading image using VF page and Apex to S3
我尝试创建将图像发送到 Amazon S3 存储桶的 Visualforce 页面和 Apex,虽然它上传成功但是当我使用来自亚马逊的 link 查看图像时它显示框而不是实际上传的图像.见下图
这是我的 Visualforce 代码,它使用 javascript:
将文件发送到顶点
<input class="slds-input-custom" id="logo" name="bsLogo" type="file" />
<button id="submtBtn" onclick="toSubmit()" label="Submit" title="Submit" class="cSubmit" >Submit</button>
<apex:form id="formId">
<apex:actionFunction name="setParamAF" action="{!apexMethod}" rerender="panelId" status="checkingId" oncomplete="onloadCallback();">
<apex:param name="vBusiLogo" value=""/>
</apex:actionFunction>
</apex:form>
<script>
function toSubmit(){
reader.readAsDataURL(document.getElementById('logo').files[0]);
reader.onload = function(){
var dataURL = reader.result;
setParamAF(dataURL);
};
}
function onloadCallback(){
alert('uploaded');
}
</script>
dataURL 变量具有以下 base64 值:
在 Apex class 端,我有这个代码:
String busiLogo = '';
public static void apexMethod(){
busiLogo = ApexPages.currentPage().getParameters().get('vBusiLogo');
String logoName = 'image.png';
String bucketname ='amazon-file-s3';
String host = 's3-ap-sample-1.amazonaws.com';
Blob beforeblob = Blob.valueOf(busiLogo);
String attachmentBody = EncodingUtil.base64Encode(beforeblob);
HttpRequest req = new HttpRequest();
req.setMethod('PUT');
req.setEndpoint('callout:AmazonS3' + '/' + logoName);
req.setHeader('Host', bucketname + '.' + host);
req.setHeader('Content-Length', String.valueOf(attachmentBody.length()));
req.setHeader('Content-Encoding', 'UTF-8');
req.setHeader('Content-Type','image/png');
req.setHeader('Connection', 'keep-alive');
req.setHeader('Date', formattedDateString);
req.setHeader('ACL', 'public-read-write');
Blob blobFile = EncodingUtil.base64Decode(attachmentBody);
req.setBodyAsBlob(blobFile);
Http http = new Http();
HTTPResponse res = http.send(req);
}
你能帮助我如何将我的实际图像发送到 s3 文件,或者我的代码哪里出了问题?
我想通了,因为 busiLogo 变量是 base64
编码的,我可以解码它并从中删除 "data:image/png;base64"
。然后对值进行编码并将编码后的 blob 值发送到 S3。
我尝试创建将图像发送到 Amazon S3 存储桶的 Visualforce 页面和 Apex,虽然它上传成功但是当我使用来自亚马逊的 link 查看图像时它显示框而不是实际上传的图像.见下图
这是我的 Visualforce 代码,它使用 javascript:
将文件发送到顶点<input class="slds-input-custom" id="logo" name="bsLogo" type="file" />
<button id="submtBtn" onclick="toSubmit()" label="Submit" title="Submit" class="cSubmit" >Submit</button>
<apex:form id="formId">
<apex:actionFunction name="setParamAF" action="{!apexMethod}" rerender="panelId" status="checkingId" oncomplete="onloadCallback();">
<apex:param name="vBusiLogo" value=""/>
</apex:actionFunction>
</apex:form>
<script>
function toSubmit(){
reader.readAsDataURL(document.getElementById('logo').files[0]);
reader.onload = function(){
var dataURL = reader.result;
setParamAF(dataURL);
};
}
function onloadCallback(){
alert('uploaded');
}
</script>
dataURL 变量具有以下 base64 值:
在 Apex class 端,我有这个代码:
String busiLogo = '';
public static void apexMethod(){
busiLogo = ApexPages.currentPage().getParameters().get('vBusiLogo');
String logoName = 'image.png';
String bucketname ='amazon-file-s3';
String host = 's3-ap-sample-1.amazonaws.com';
Blob beforeblob = Blob.valueOf(busiLogo);
String attachmentBody = EncodingUtil.base64Encode(beforeblob);
HttpRequest req = new HttpRequest();
req.setMethod('PUT');
req.setEndpoint('callout:AmazonS3' + '/' + logoName);
req.setHeader('Host', bucketname + '.' + host);
req.setHeader('Content-Length', String.valueOf(attachmentBody.length()));
req.setHeader('Content-Encoding', 'UTF-8');
req.setHeader('Content-Type','image/png');
req.setHeader('Connection', 'keep-alive');
req.setHeader('Date', formattedDateString);
req.setHeader('ACL', 'public-read-write');
Blob blobFile = EncodingUtil.base64Decode(attachmentBody);
req.setBodyAsBlob(blobFile);
Http http = new Http();
HTTPResponse res = http.send(req);
}
你能帮助我如何将我的实际图像发送到 s3 文件,或者我的代码哪里出了问题?
我想通了,因为 busiLogo 变量是 base64
编码的,我可以解码它并从中删除 "data:image/png;base64"
。然后对值进行编码并将编码后的 blob 值发送到 S3。