Penggunaan pemalam jQuery.form dan fail tak segerak merentas domain upload_jquery

Biar saya terangkan dahulu

Untuk fungsi muat naik tak segerak merentas domain ini, kami menggunakan pemalam Jquery.form, yang sangat berkesan dalam bentuk tak segerak, kami akan menambahkan kaedah kawalan-akses-benarkan pada pengepala respons HTTP . Sudah tentu, teg pengepala ini hanya IE10, Firefox dan Google menyokongnya Untuk pelayar di bawah IE10, kami tidak boleh menggunakan kaedah ini domain yang sama seperti halaman muat naik fail) untuk mengembalikan data yang berkaitan.

Lakukan perkara lagi

1 Penggunaan Jquery.form

<form method="post" action="http://127.0.0.1:801/Home/UploadResult" enctype="multipart/form-data" id="form1">
<input name="qdctvfile" id="qdctvfile11" type="file" onchange="eventStart()">
</form>
<script type="text/javascript">
$("#form1").ajaxForm({
beforeSerialize: function () {
var filepath = $("#qdctvfile11").val()
var extStart = filepath.lastIndexOf(".");
var ext = filepath.substring(extStart, filepath.length).toUpperCase();
if (ext != ".PNG" && ext != ".JPG") {
alert("图片仅支持png,jpg格式");
$("#qdctvfile11").val("");
return false;
}
},
success: function (data) {
alert(data);
}
});
function eventStart(obj) {
$("#form1").submit();
}

Perhatikan bahawa kaedah eventStart dalam kod merujuk kepada menyerahkan borang secara automatik selepas memilih fail, manakala ajaxForm menunjukkan bahawa penyerahan borang adalah pengecualian, dan kaedah panggil balik kejayaan merujuk kepada nilai pulangan alamat borang pulangan tak segerak.

2 Pelaksanaan awal merentas domain

Untuk menyelesaikan akses domain, kami boleh menambahkan Access-Control-Allow-Origin dan Access-Control-Allow-Methods pada pengepala respons pelayan ini tidak disokong oleh pelayar di bawah IE10, yang sangat sukar menyedihkan.

/// <summary>
/// MVC模式下跨域访问
/// </summary>
public class MvcCorsAttribute : ActionFilterAttribute
{
public override void OnActionExecuting(ActionExecutingContext filterContext)
{
Dictionary<string, string> headers = new Dictionary<string, string>();
headers.Add("Access-Control-Allow-Origin", "*");
headers.Add("Access-Control-Allow-Methods", "*");
foreach (var item in headers.Keys)
{
filterContext.RequestContext.HttpContext.Response.Headers.Add(item, headers[item]);
}
base.OnActionExecuting(filterContext);
}
}

Perhatikan bahawa dalam persekitaran pengeluaran, Access-Control-Allow-Origin kami harus menyatakan nama domain yang sah, * bermakna semua tapak web terbuka untuk diakses, yang berbahaya.

3 Selesaikan masalah yang IE10 dan ke bawah tidak boleh merentas domain

Saya benar-benar tidak boleh mengatakan apa-apa tentang pelayar IE Walaupun saya sangat menyukai barangan Microsoft, saya hanya boleh mengatakan TIDAK kepada IE pelaksanaan muat naik merentas domain terlebih dahulu Idea penyelesaian: klien tidak mengembalikan data secara langsung, tetapi menulis semula alamat panggilan balik kepada klien, dan panggilan balik mengembalikan data akhir melalui kaedah ajaxForm

Ini menyelesaikan masalah merentas domain langsung.

/// <summary>
/// 第三方的服务端
/// </summary>
/// <param name="name"></param>
/// <returns></returns>
[HttpPost]
public ActionResult UploadResult()
{
string data = "{'code':'OK','thumpImgUrl':'http://127.0.0.1/images/1.jpg'}";
return Redirect("http://localhost:9497/Home/UploadCallback&#63;data=" + data);
}
/// <summary>
/// 可能是服务端来调用它
/// </summary>
/// <returns></returns>
public ActionResult UploadCallback(string data)
{
return Content(data);
}

Kadangkala, apabila kita berfikir tentang penyelesaian kepada masalah, jika kita tidak boleh melalui satu jalan, kita boleh mengubah pemikiran kita, dan kita mungkin mendapat keuntungan yang tidak dijangka!

Ada yang bertanya sama ada boleh menggunakan POST untuk memindahkan data antara pelayan dan pelanggan. Pakcik itu berkata: Tidak, kerana selepas POST diserahkan kepada pelanggan, pelanggan memprosesnya dan kemudian mengembalikan hasilnya kepada perkhidmatan. . berakhir, dan akhirnya pelayan mengembalikan hasilnya kepada ajaxform Ini kembali kepada masalah merentas domain pada mulanya, haha!

Di atas ialah kandungan berkaitan yang diperkenalkan oleh editor untuk melaksanakan muat naik fail tak segerak merentas domain jQuery berdasarkan pemalam jQuery.form Saya harap ia akan membantu semua orang.