phphtml选择图⽚,转换成base64,上传yii框架中的form.php中的代码
<?php
use yii\helpers\Html;
use yii\widgets\ActiveForm;
use yii\helpers\Url;
/* @var $this yii\web\View */
/* @var $model backend\models\ActivityInfo */
/* @var $form yii\widgets\ActiveForm */
>
<div class="activity-info-form">
<script type="text/javascript">
function getBase64Image(img) {
var canvas = ateElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = Context("2d");
ctx.drawImage(img, 0, 0, img.width, img.height);
var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
var dataURL = DataURL("image/"+ext);
return dataURL;html代码转链接
}
//下⾯⽤于图⽚上传预览功能
function setImagePreview() {
var ElementById("files-list");
var obj = ElementById("upimage");
var imgObjPreview = ElementById("preview");
var src=event.target || window.event.srcElement; //获取事件源,兼容chrome/IE
//下⾯把路径截取为⽂件名
var filename=src.value;//图⽚完整路径
var prefix=filename.substring( filename.lastIndexOf('\\')+1 );//获取⽂件名的前缀名(⽂件格式)
var suffix=filename.substring( filename.lastIndexOf('.')+1).toLocaleLowerCase(); //获取⽂件名的后缀名(⽂件格式)
console.log(filename);
console.log(suffix);
console.log( src.files )
if(/image/.test(src.files[0].type)){
const reader = new FileReader();
var img = ElementById('image');
img.src = sult;
var base64 = getBase64Image(img).replace(/^data:\S+\/\S+;base64,/, '');
console.log(base64);
$.ajax({
type: "POST",
dataType: "json",
url: <?php $apiUrl = Yii::$app->params['APIUrl']; echo "'{$apiUrl}image/UploadImg'" ?>,
contentType: "application/json",
data:JSON.stringify({
"PreKey": "*2020#zz",
"Type": 3,
"Name": <?= "'a_$model->ID'" ?>,
"Data": base64,
}),
success: function (result) {
console.log("data is :" + JSON.stringify(result) );
if (de == 0) {
if (de == 0) {
var urlT = ElementById('activityinfo-url');
urlT.value = result.data.Url;
output.innerHTML="图⽚上传成功!";
}else {
output.innerHTML="图⽚上传失败,code=!"+de;
alert("图⽚上传失败,code=!"+de);
}
}
});
}
}else{
alert("图⽚格式只能为jpg 或者 png");
}
}
</script>
<?php $form = ActiveForm::begin([
'id' => 'activity-info-id',
'enableAjaxValidation' => true,
'validationUrl' => Url::toRoute(['validate-form']),
]); ?>
<?= $form->field($model, 'Tiltle')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'Url') ?>
<img id='image' src=<?php echo $model->Url ? Yii::$app->params['APIUrl']."image/download?url=$model->Url" : '' ?> style='width:300px'>    <div class="form-group field-activityinfo-imageurl">
<label class="control-label" for="activityinfo-imageurl">上传活动图⽚2</label>
<input type="hidden" name="ActivityInfo[imageUrl]" value="">
<input type="file" id="activityinfo-imageurl" name="ActivityInfo[imageUrl]" onchange="setImagePreview()">
<div id='output'>
</div>
<div class="help-block"></div>
</div>
<?= $form->field($model, 'JumpTo')->textInput() ?>
<?= $form->field($model, 'StartTime')->textInput() ?>
<?= $form->field($model, 'EndTime')->textInput() ?>
<div class="form-group">
<?=Html::submitButton(Yii::t('app', 'Save'), ['class' => 'btn btn-success']) ?>
</div>
<?php ActiveForm::end(); ?>
</div>

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。