Kindeditor4 cross-domain upload image resolution

Source: Internet
Author: User

Kindeditor is being used in the project, version number 4.1.10
A lot of company Pictures will go CDN, need a separate picture upload service such as: (upload.268xue.com)
Kindeditor simple internal process for uploading images:
the upload button is submitted to the IFRAME. Generate 1 form and one iframe,form commit to (arget) IFRAME
The OnLoad method of the IFRAME gets the returned value. Then call configure callback method Afterupload/aftererror.
Detailed implementation: (in a.com selected image, upload with upload.268xue.com, return the results of the upload to a.com. My project Springmvc):
cross-domain use need to change 2 places:1. The return mode after uploading, 2 callback page processing.
1.upload.268xue.com method of uploading:
@RequestMapping (value = "/upload", method = requestmethod.post) public String upload (httpservletrequest request, Httpse            Rvletresponse response) {try {String referer = Request.getheader ("Referer");            Pattern p = pattern.compile ("([a-z]*:(//[^/?#]+)?", pattern.case_insensitive);            Matcher mathcer = P.matcher (referer); if (Mathcer.find ()) {String Callbackpath = Mathcer.group ();//Request Source A.com Multiparthttpservle                Trequest multipartrequest = (multiparthttpservletrequest) request; Multipartfile imgfile = Multipartrequest.getfile ("FileUpload");//k4 fileupload json = own processing//jsonobject Ile//Json.tostring () can be returned directly to the same domain without redirectString url = "Redirect:" + Callbackpath + "/kindeditor/plugins/image/redirect.html?s=" + json.tostring () + "#" + JSON . toString ();Logger.info (String.Format ("Upload success url:%s", url));            return URL;            } else {logger.info ("Upload referer not find");        }} catch (Exception e) {logger.error ("Upload error", e);    } return null; }

Upload your own implementation. The point is to return the results of my printout:
Upload Success url:http://a.com/kindeditor/plugins/image/redirect.html?

s={"error": 0, "url": "Http://upload.268xue.com/upload/sns/temp/20140510/1399706737140139370.jpg"}#{"error": 0, " URL ":" Http://upload.268xue.com/upload/sns/temp/20140510/1399706737140139370.jpg "}


REDIRECT has a number of references S and # are repeated, very low, used in the a.com. Expected to change.
initialization of the editor in 2.a.com:
var Uploadbutton = Kindeditor.uploadbutton ({button:kindeditor ("FileUpload") [0],fieldname: "FileUpload", url: "http:/ /upload.268xue.com/upload ", afterupload:function (data) {if (Data.error = = 0) {            //data.url processing} else {alert (" error ");} },aftererror:function (str) {//alert (' ERROR: ' + str);}}); Uploadbutton.fileBox.change (function (e) {uploadbutton.submit ();});

Button:fileupload. There's no special place.

3.a.com content in kindeditor\plugins\image\redirect.html:

]*) "," IG "); Return ((Uri.match (re))?

(Uri.match (re) [0].substr (Val.length + 1)): null); } var upload_callback = function () {var data=getparameter ("s"); var Location_hash=location.hash; IE6 not get hash??

? Take it that way? Use URL to pass the number of S if (Location_hash!=null && location_hash!= "" && location_hash) {var data = Locati On.hash? Location.hash.substring (1): "; document.getElementsByTagName ("Body") [0].innerhtml = ' <pre> ' + data + ' </pre> '; }else{var data=getparameter ("s"); document.getElementsByTagName ("Body") [0].innerhtml = ' <pre> ' + data + ' </pre> '; } }; </script>
above IE6,7,8,9,ten, Firefox, Chrome test pass. Apple browser Safari test failed.
===========================================================Safari Down Reason: request redirect.html after the onload call processing of the IFRAME is converted to JSON wrong:

such as: Http://a.com/kindeditor/plugins/image/redirect.html?

s=%7b%22error%22:0,%22url%22:%22/upload/demo_web/temp/20140510/1399698690364609649.jpg%22%7d#%7b%22error%22:0, %22url%22:%22/upload/demo_web/temp/20140510/1399698690364609649.jpg%22%7d


Processed result: An error occurred while%7b%22error%22:0,%22url%22:%22/upload/demo_web/temp/20140510/1399698690364609649.jpg%22%7d was converted to JSON. The format should be: {"error": 0, "url": "/upload/demo_web/temp/20140510/1399698690364609649.jpg"} for example, str to Json:k.json (str). (Kindeditor-all.js 4196-4206 lines)

Should be the request has the problem, temporarily resolves, changes the kindeditor-all.js (when the error then tries the next transcoding)



their own treatment, low-level places to learn more.




Kindeditor4 cross-domain upload image resolution

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.