jQuery 通过输入或 Ajax 保存文件答案

【问题标题】：jQuery save files via input or AjaxjQuery 通过输入或 Ajax 保存文件
【发布时间】：2018-04-15 13:02:18
【问题描述】：

我正在开发一个基于 HTML 和 jQuery（无服务器端）的简单项目。 HTML 包含一个表单，用户将在其中插入图像，提交时也会创建一个包含该图像的 zip 文件。

通过使用 jsZip 库，我能够将所有其他文件添加到已经存在的已创建 zip 文件中。然而，用户可以从任何地方（从某个站点或从他计算机中的文件夹）添加图像。

试一试 我尝试使用input[type="file"]，以便用户可以浏览稍后将保存在图像文件夹中的图像，以便jsZip可以轻松访问它。

问题在不涉及服务器端语言的情况下，我无法找到将图像保存在图像文件夹中的任何方法

尝试两次我尝试使用input[type="text"] 让用户插入图片 URL，然后通过 Ajax 请求获取要通过 jsZip 添加的图片。

问题它正在生成错误Cross-Origin Request Blocked

$.ajax({
        url: PageBGimage,
        type: "Post",
        contentType:'image/jpeg',
        mimeType: 'image/jpeg; charset=x-user-defined',
        success: function (json, data){
           // code to add image to jsZip
        }
    });

演示：https://codepen.io/alikhan999/pen/MVvoOM

【问题讨论】：

This guide uploading-files-ajax 可以帮到你
朋友这需要php，而我们的项目只是用户机器中的html和js文件的文件夹。它甚至不会在任何地方托管

标签： jquery ajax file-upload cross-domain

【解决方案1】：

Cross-Origin Request Blocked 发生在您尝试在两个不同域之间发送 ajax 请求时。但如果该域允许，您可以向另一个域发送请求。

检查PageBGimage是否是保存你的js文件（发送请求的文件）的同一个域

【讨论】：

它是一个将保存在用户机器中的项目。它不会在任何地方托管。