iSharkFly-Open
/
DiscuzX
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

!140 修复 头像上传跨域问题 

Merge pull request !140 from Coxxs/fix/avatar
This commit is contained in:
Coxxs 2018-01-13 12:05:56 +08:00 committed by Discuz!
parent 60405cd703
commit 3617dc0d42
3 changed files with 43 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
upload/static/avatar/avatar.js
View File

@ -16,9 +16,8 @@ jQuery('#avatarcanvas').attr('width', (dwidth-150));
jQuery('#avatarcanvas').attr('height', dheight-25); jQuery('#avatarcanvas').attr('height', dheight-25);
jQuery('#avatardisplaycanvas').attr('width', dwidth-20); jQuery('#avatardisplaycanvas').attr('width', dwidth-20);
jQuery('#avatardisplaycanvas').attr('height', dheight-25); jQuery('#avatardisplaycanvas').attr('height', dheight-25);
var src = data[data.indexOf('src')+1].replace('images/camera.swf?inajax=1','index.php?m=user&a=uploadavatar'); $('avatarform').target ='uploadframe';
$('avatarform').action = src; $('avatarfile').onchange = uploadAvatarDone;
$('avatarform').target ='uploadframe';
jQuery(document).ready(function () { jQuery(document).ready(function () {
jQuery("#selector") jQuery("#selector")
@ -41,37 +40,32 @@ jQuery(document).ready(function () {
jQuery("#slider").append("<div style='position: absolute; top: -2px; left: 100px; width: 3px; height: 6px; background-color: black;'>&nbsp;</div>" ); jQuery("#slider").append("<div style='position: absolute; top: -2px; left: 100px; width: 3px; height: 6px; background-color: black;'>&nbsp;</div>" );
}); });
function uploadAvatarDone() { window.addEventListener('message', receiveMessage, false);
var iframe = $('uploadframe');
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
if (!iframeDocument.body) return;
var imageSrc = iframeDocument.body.innerHTML;
if (!imageSrc) return;
if (imageSrc.indexOf('/')===-1) { // server returns error message function receiveMessage(event) {
if (imageSrc!=-4) { // ie11 bug?: called twice, the value in the second time is -4 var msgdata = event.data;
alert(imageSrc); if (typeof(msgdata) !== 'string') {
}
return; return;
} }
try { rectAvatarDone(msgdata);
var av = $('avatarfile'); }
av.value = '';
if(av.value){ function uploadAvatarDone() {
av.type = "text"; if (this.files && this.files[0]) {
av.type = "file"; var fr = new FileReader();
} fr.onload = function(e) {
} catch(e){} jQuery('#avatarfileselector').hide();
jQuery('#avatarfileselector').hide(); jQuery('#avatardisplayer').hide();
jQuery('#avatardisplayer').hide(); jQuery('#avataradjuster').show();
jQuery('#avataradjuster').show(); jQuery('#selector').css('left', Math.floor((dwidth-300)/2));
jQuery('#selector').css('left', Math.floor((dwidth-300)/2)); jQuery('#selector').css('top', Math.floor((dheight-150)/2));
jQuery('#selector').css('top', Math.floor((dheight-150)/2)); jQuery('#selector').width(150);
jQuery('#selector').width(150); jQuery('#selector').height(150);
jQuery('#selector').height(150); $('avatarimage').src = e.target.result;
imageSrc += "?" + (new Date()); jQuery("#slider").slider('value', 50);
$('avatarimage').src = imageSrc; };
jQuery("#slider").slider('value', 50); fr.readAsDataURL(this.files[0]);
}
} }
function showAvatarFileSelector() { function showAvatarFileSelector() {
@ -189,6 +183,8 @@ function saveAvatar() {
canvas.width = tw; canvas.width = tw;
canvas.height = th; canvas.height = th;
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
ctx.fillStyle = 'white';
ctx.fillRect(0, 0, tw, th);
ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th);
var dataURL = canvas.toDataURL("image/jpeg"); var dataURL = canvas.toDataURL("image/jpeg");
jQuery('#avatar1').val(dataURL.substr(dataURL.indexOf(",") + 1)); jQuery('#avatar1').val(dataURL.substr(dataURL.indexOf(",") + 1));
@ -204,6 +200,8 @@ function saveAvatar() {
canvas.width = tw; canvas.width = tw;
canvas.height = th; canvas.height = th;
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
ctx.fillStyle = 'white';
ctx.fillRect(0, 0, tw, th);
ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th);
var dataURL = canvas.toDataURL("image/jpeg"); var dataURL = canvas.toDataURL("image/jpeg");
jQuery('#avatar2').val(dataURL.substr(dataURL.indexOf(",") + 1)); jQuery('#avatar2').val(dataURL.substr(dataURL.indexOf(",") + 1));
@ -223,12 +221,14 @@ function saveAvatar() {
canvas.width = tw; canvas.width = tw;
canvas.height = th; canvas.height = th;
var ctx = canvas.getContext("2d"); var ctx = canvas.getContext("2d");
ctx.fillStyle = 'white';
ctx.fillRect(0, 0, tw, th);
ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th); ctx.drawImage(img, sl, st, sw, sh, 0, 0, tw, th);
var dataURL = canvas.toDataURL("image/jpeg"); var dataURL = canvas.toDataURL("image/jpeg");
jQuery('#avatar3').val(dataURL.substr(dataURL.indexOf(",") + 1)); jQuery('#avatar3').val(dataURL.substr(dataURL.indexOf(",") + 1));
var src = $('avatarform').action; var src = $('avatarform').action;
$('avatarform').action = src.replace('&a=uploadavatar', '&a=rectavatar&base64=yes'); $('avatarform').action = data[data.indexOf('src')+1].replace('images/camera.swf?inajax=1', 'index.php?m=user&a=rectavatar&base64=yes');
$('avatarform').target='rectframe'; $('avatarform').target='rectframe';
} }
@ -291,11 +291,7 @@ function refreshAvatarCanvasForDisplay() {
ctx.fillText('以上是您头像的三种尺寸', dwidth - 200, 180); ctx.fillText('以上是您头像的三种尺寸', dwidth - 200, 180);
} }
function rectAvatarDone() { function rectAvatarDone(res) {
var iframe = $('rectframe');
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
if (!iframeDocument.body) return;
var res = iframeDocument.body.innerHTML;
if (!res) return; if (!res) return;
if (res=='success') { if (res=='success') {
jQuery('#avatardisplayer').show(); jQuery('#avatardisplayer').show();

14
upload/template/default/home/spacecp_avatar_body.htm
View File

@ -1,6 +1,6 @@
<div id="avatardesigner"> <div id="avatardesigner">
<div id="avatarfileselector"> <div id="avatarfileselector">
<input type="file" name="Filedata" id="avatarfile" accept="image/*" onchange="this.form.submit();" /> <input type="file" name="Filedata" id="avatarfile" accept="image/*" />
</div> </div>
<div id="avataradjuster"> <div id="avataradjuster">
<img id="avatarimage" style="visibility: hidden;" onload="forceSelectorInsideAvatar();" /> <img id="avatarimage" style="visibility: hidden;" onload="forceSelectorInsideAvatar();" />
@ -33,15 +33,15 @@
</div> </div>
</div> </div>
<script src="static/js/mobile/jquery.min.js?{VERHASH}"></script> <script src="{STATICURL}js/mobile/jquery.min.js?{VERHASH}"></script>
<script type="text/javascript"> <script type="text/javascript">
jQuery.noConflict(); jQuery.noConflict();
var data = "{echo implode(",", $uc_avatarflash);}".split(','); var data = "{echo implode(",", $uc_avatarflash);}".split(',');
</script> </script>
<link rel="stylesheet" href="static/avatar/avatar.css?{VERHASH}" /> <link rel="stylesheet" href="{STATICURL}avatar/avatar.css?{VERHASH}" />
<script src="static/avatar/jquery-ui.min.js?{VERHASH}"></script> <script src="{STATICURL}avatar/jquery-ui.min.js?{VERHASH}"></script>
<script src="static/avatar/avatar.js?{VERHASH}"></script> <script src="{STATICURL}avatar/avatar.js?{VERHASH}"></script>
<iframe name="uploadframe" id="uploadframe" style="display: none;" onload="uploadAvatarDone();"></iframe> <iframe name="uploadframe" id="uploadframe" style="display: none;"></iframe>
<iframe name="rectframe" id="rectframe" style="display: none;" onload="rectAvatarDone();"></iframe> <iframe name="rectframe" id="rectframe" style="display: none;"></iframe>

4
upload/uc_server/control/user.php
View File

@ -398,9 +398,9 @@ class usercontrol extends base {
if(getgpc('base64', 'G')){ if(getgpc('base64', 'G')){
if($success) { if($success) {
return "success"; return "<script>window.parent.postMessage('success','*');</script>";
} else { } else {
return "failure"; return "<script>window.parent.postMessage('failure','*');</script>";
} }
}else{ }else{
if($success) { if($success) {