今天终于搞定了 django 的 ajax 方式上传图片。
客户端我用的是 jQuery 的插件 AjaxFileUpload, 其原理是动态创建一个 iframe 和一个 form, 将 <input type="file" /> 控件的内容插入到 form 中,然后向那个 iframe 提交。当然这里 iframe 通过样式设置为不可见的了。
调试的过程中出现了很多低级错误,但因为 ajax 方式很难调试,花费了不少的时间才搞定,中间连 Visual Studio 2005 都用上了,用于调试 JavaScript. 下面把错误记录下来给自己以后提个醒:
1. fileElementId 注意不要在前面加上 '#', 否则会找不到控件(用 jQuery 时间久了很容易犯这个错误)。
2. <input type="file" /> 控件一定要加上 name 属性!因为这个没加表单将不会发送任何有效的文件数据。低级错误啊~
3. 其他需要在文件上传时同时发送的字段,可以考虑拼接成一个字符串,加到 url 里面用 get 的方式发送到服务器。当然,要记得字段内容用 encodeURIComponent 函数预先处理。
下面附上一点主要的客户端调用代码:
客户端我用的是 jQuery 的插件 AjaxFileUpload, 其原理是动态创建一个 iframe 和一个 form, 将 <input type="file" /> 控件的内容插入到 form 中,然后向那个 iframe 提交。当然这里 iframe 通过样式设置为不可见的了。
调试的过程中出现了很多低级错误,但因为 ajax 方式很难调试,花费了不少的时间才搞定,中间连 Visual Studio 2005 都用上了,用于调试 JavaScript. 下面把错误记录下来给自己以后提个醒:
1. fileElementId 注意不要在前面加上 '#', 否则会找不到控件(用 jQuery 时间久了很容易犯这个错误)。
2. <input type="file" /> 控件一定要加上 name 属性!因为这个没加表单将不会发送任何有效的文件数据。低级错误啊~
3. 其他需要在文件上传时同时发送的字段,可以考虑拼接成一个字符串,加到 url 里面用 get 的方式发送到服务器。当然,要记得字段内容用 encodeURIComponent 函数预先处理。
下面附上一点主要的客户端调用代码: