2016-08-29 88 views
0

的Hello World, 我從一個Web服務器接收base64url "JVBERi0xLjMKMSAwIG9iago8...mVmCjM3MjgxCiUlRU9GCg=="
,我能夠給這個字符串轉換成BLOB和使用下面的代碼在瀏覽器中顯示它。顯示PDF從base64url

.controller("formB", function() { 
$scope.formb.year = ["2015"+"\/"+"2016", "2016"+"\/"+"2017"]; 
$scope.formb.semester = [1,2,3]; 
$scope.formb.pdf =""; 

setDefaultsForPdfViewer($scope); 
// Initialize the modal view. 
$ionicModal.fromTemplateUrl('src/app/components/form_b/pdf-viewer.html', { 
    scope: $scope, 
    animation: 'slide-in-up' 
}).then(function (modal) { 
    $scope.modal = modal; 
}); 
$scope.openModal = function() { 
    $scope.modal.show(); 
    }; 
$scope.$watchGroup([ 
'formb.year.selected', 
'formb.semester.selected' 
],function(newVals, oldVals){ 

    if(newVals[0]&&newVals[1]&&newVals!==oldVals){ 
      $ionicLoading.show({ 
      template:'Loading...' 
       }).then(function(){ 
      }); 

    DataFactory.getFormB(newVals[0],newVals[1]).then(function(resp){ 
      $scope.formb.pdf = resp.data.data; 
    var str = resp.data.data; 
    currentBlob = myB64ToBlob(str,"application/pdf"); 

    $ionicLoading.hide().then(function(){ 
    console.log("No more loading"); 
     }); 

    $scope.pdfUrl = window.URL.createObjectURL(currentBlob); 

      // Display the modal view 

      }); 
    } 

    }); 

    // Clean up the modal view. 
    $scope.$on('$destroy', function() { 
    $scope.modal.remove(); 
    }); 
    function base64ToUint8Array(base64) { 
    var raw = atob(base64); 
    var uint8Array = new Uint8Array(raw.length); 
    for (var i = 0; i < raw.length; i++) { 
    uint8Array[i] = raw.charCodeAt(i); 
    } 
    return uint8Array.buffer; 
    } 
    function myB64ToBlob(base64,contentType){ 
    var arr = base64ToUint8Array(base64); 

    var blob = new Blob([arr], {type: contentType}); 
    return blob; 
    } 
    ... 
     } 

這裏重要的是這條線的位置:

$scope.pdfUrl = window.URL.createObjectURL(currentBlob);

它可以在瀏覽器中,但它在手機出現故障。我很困惑,我似乎無法弄清楚發生了什麼。誰能幫忙?

回答

1

嘗試使用JS本地函數來創建URL並將其傳遞給作用域。 Windows將無法使用手機。

objectURL = URL.createObjectURL(blob); 

閱讀此項。 https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL

對於移動用戶,需要使用ng-cordova文件插件。看到這裏 https://github.com/apache/cordova-plugin-file

+0

它沒有工作。它仍然只在瀏覽器中運行 – TheEYL

+0

爲您更新了答案。你需要使用ng-cordova文件插件來處理移動文件。 –