POST Binärdaten von Browser zu JFrog/Artifactory Server ohne Verwendung von form-data

Question

So erhalten wir eine Datei (eine Bilddatei) im Front-End wie so:

// html

<input type="file" ng-change="onFileChange"> 

// javascript

$scope.onFileChange = function (e) { 
     e.preventDefault(); 
     let file = e.target.files[0]; 
     // I presume this is just a binary file 
     // I want to HTTP Post this file to a server 
     // without using form-data 
    }; 

Was ich wissen möchte, ist - ist es eine Möglichkeit, diese Datei an einen Server zu senden, ohne die Datei als Formular-Daten, einschließlich? Das Problem ist, dass der Server, an den ich eine HTTP POST-Anfrage schicke, nicht wirklich weiß, wie man Formulardaten speichert, wenn er eine Anfrage erhält.

Ich glaube, das ist der richtige Weg, aber ich bin mir nicht sicher.

fetch('www.example.net', { // Your POST endpoint 
    method: 'POST', 
    headers: { 
     "Content-Type": "image/jpeg" 
    }, 
    body: e.target.files[0] // the file 
    }) 
    .then(
    response => response.json() // if the response is a JSON object 
) 

Answer 1

Unser Front-End konnte nicht HTTP POST direkt auf den JFrog/Artifactory-Server. Also haben wir am Ende einen Node.js Server als Proxy benutzt, was nicht sehr ideal ist.

Front-end:

// in an AngularJS controller: 

    $scope.onAcqImageFileChange = function (e) { 

      e.preventDefault(); 
      let file = e.target.files[0]; 
      $scope.acqImageFile = file; 
     }; 

// in an AngularJS service 

    createNewAcqImage: function(options) { 

     let file = options.file; 

     return $http({ 
      method: 'POST', 
      url: '/proxy/image', 
      data: file, 
      headers: { 
      'Content-Type': 'image/jpeg' 
      } 
     }) 
     }, 

Back-end:

const express = require('express'); 
const router = express.Router(); 

router.post('/image', function (req, res, next) { 

    const filename = uuid.v4(); 

    const proxy = http.request({ 
    method: 'PUT', 
    hostname: 'engci-maven.nabisco.com', 
    path: `/artifactory/cdt-repo/folder/${filename}`, 
    headers: { 
     'Authorization': 'Basic ' + Buffer.from('cdt-deployer:foobar').toString('base64'), 
    } 
    }, function(resp){ 
    resp.pipe(res).once('error', next); 
    }); 

    req.pipe(proxy).once('error', next); 
}); 

module.exports = router; 

nicht, dass wir eine PUT-Anfrage verwenden mussten ein Bild zu schicken, um Artifactory, nicht Post, etwas mit Artifactory zu tun (Der Server engci-maven.nabisco.com ist ein Artifactory-Server). Soweit ich mich erinnere, habe ich CORS-Probleme bekommen, als ich versuchte, direkt von unserem Frontend auf den anderen Server zu posten, also mussten wir unseren Server als Proxy benutzen, was ich lieber vermeiden würde, aber nun gut.