将文件上传到Parse（JavaScript）

Question

简而言之，我正在尝试将pdf文档存储到解析中。 从本质上讲，用户是从Google驱动器中选择上传的文件，然后从我要存储到Parse的选定文档中选择。

我已经能够为从驱动器中选择的pdf文档生成URL，并且希望使用该URL存储在Parse中。

以下是允许用户从Google驱动器中选择pdf文档的代码，并为该项目生成了唯一的URL。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>eSnail Scan Upload Part 2</title>

    <script type="text/javascript">

      // The Browser API key obtained from the Google Developers Console.
      var developerKey = 'xxxxxxxxxx';

      // The Client ID obtained from the Google Developers Console.
      var clientId = 'xxxxxxxxxxxxx';

      // Scope to use to access user's photos.
      var scope = ['https://www.googleapis.com/auth/photos'];

      var pickerApiLoaded = false;
      var oauthToken;

      // Use the API Loader script to load google.picker and gapi.auth.
      function onApiLoad() {
        gapi.load('auth', {'callback': onAuthApiLoad});
        gapi.load('picker', {'callback': onPickerApiLoad});
      }

      function onAuthApiLoad() {
        window.gapi.auth.authorize(
            {
              'client_id': clientId,
              'scope': scope,
              'immediate': false
            },
            handleAuthResult);
      }

      function onPickerApiLoad() {
        pickerApiLoaded = true;
        createPicker();
      }

      function handleAuthResult(authResult) {
        if (authResult && !authResult.error) {
          oauthToken = authResult.access_token;
          createPicker();
        }
      }

      // Create and render a Picker object for picking user Photos.
      function createPicker() {
        if (pickerApiLoaded && oauthToken) {
          var picker = new google.picker.PickerBuilder().
              enableFeature(google.picker.Feature.MULTISELECT_ENABLED).
              addView(google.picker.ViewId.PDFS).
              setOAuthToken(oauthToken).
              setDeveloperKey(developerKey).
              setCallback(pickerCallback).
              build();
          picker.setVisible(true);
        }
      }

      // A simple callback implementation.
      function pickerCallback(data) {
        var url = 'nothing';
        if (data[google.picker.Response.ACTION] == google.picker.Action.PICKED) {
          var doc = data[google.picker.Response.DOCUMENTS][0];
          url = doc[google.picker.Document.URL];
        }
        var message = 'The following(s) were stored in Parse: ' + url;
        document.getElementById('result').innerHTML = message;
      }
    </script>
  </head>
  <body>
    <div id="result"></div>

    <!-- The Google API Loader script. -->
    <script type="text/javascript" src="https://apis.google.com/js/api.js?onload=onApiLoad"></script>
  </body>
</html>

本质上，我具有文件的URL，并且希望将该URL存储到Parse中，以便以后可以检索该文件。

注意：

以下是我发现的允许用户将文件上传到Parse的代码。 问题我不希望文件来自用户计算机（用户使用文件输入上传文件），而是来自Google驱动器提供的URL。

<HTML>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>

<body>
<form id="fileupload" name="fileupload" enctype="multipart/form-data" method="post">
  <fieldset>
    <input type="file" name="fileselect" id="fileselect"></input>
    <input id="uploadbutton" type="button" value="Upload to Parse"/>
  </fieldset>
</form>

<script type="text/javascript">
  $(function() {
    var file;

    // Set an event listener on the Choose File field.
    $('#fileselect').bind("change", function(e) {
      var files = e.target.files || e.dataTransfer.files;
      // Our file var now holds the selected file
      file = files[0];
    });

    // This function is called when the user clicks on Upload to Parse. It will create the REST API request to upload this image to Parse.
    $('#uploadbutton').click(function() {
      var serverUrl = 'https://api.parse.com/1/files/' + file.name;

      $.ajax({
        type: "POST",
        beforeSend: function(request) {
          request.setRequestHeader("X-Parse-Application-Id", 'pWG7YizRnwxRjplGT9RSLoHtFItDtvmc2EK0YJAe');
          request.setRequestHeader("X-Parse-REST-API-Key", '2LsfIAg5Np9u09ScVIT5StEcO0LXMfpzndWOiwHX');
          request.setRequestHeader("Content-Type", file.type);
        },
        url: serverUrl,
        data: file,
        processData: false,
        contentType: false,
        success: function(data) {
          prompt("File available at: ", data.url);
        },
        error: function(data) {
          var obj = jQuery.parseJSON(data);
          prompt(obj.error);
        }
      });
    });


  });
</script>


</head>
</body>
</HTML>

任何帮助或建议，将不胜感激。 提前致谢。

Answer 1

对于我的客户的一个项目，我们遇到了完全相同的问题。 我们以几种不同的方式进行了研究，并决定最好的方法是将URL传递到我们自己的服务器并在那里处理上传。 在我们的特定实例中，我们将cURL与PHP / Codeignitor一起使用，获取了文件，然后将其上传到S3（但是对于Parse上传，可以很容易地做到这一点）。

我们看过将CloudCode与httpRequest一起使用，但是存在执行超时的问题。 解析只会为每个CloudCode函数提供很短的时间，并且在我们超时之前文件永远不会完成下载。

将文件上传到Parse（JavaScript）

问题描述

1 个解决方案

解决方案1
0 2014-12-28 21:27:07

将文件上传到Parse（JavaScript）

问题描述

1 个解决方案

解决方案1 0 2014-12-28 21:27:07

解决方案1
0 2014-12-28 21:27:07