2017-06-21 2 views
0

ich versuche, eine pdf von externen server zu laden und jetzt bekomme ich diesen fehler in der konsole.wie kors auf localhost/server

XMLHttpRequest kann nicht geladen werden https://mobile.switchitapp.com/uploads/pdf/userGuide.pdf. No Der 'Access-Control-Allow-Origin'-Header ist auf der angeforderten -Ressource vorhanden. Origin 'http://appsdata2.cloudapp.net' ist daher nicht Zugriff erlaubt.

Wie wird dieser Fehler behoben? Ich habe viel ausprobiert, aber nichts hat sich für mich gearbeitet, bis jetzt mir bitte

helfen

Dank :)

hier ist mein Code

<!DOCTYPE html> 
<html> 
<head> 
    <title>PDF.js Learning</title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/1.8.472/pdf.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/1.8.472/pdf.worker.js"></script> 
    <script> 
     // URL of PDF document 
     var url = "https://mobile.switchitapp.com/uploads/pdf/userGuide.pdf"; 

     // Asynchronous download PDF 
     PDFJS.getDocument(url) 
      .then(function(pdf) { 
       return pdf.getPage(1); 
      }) 
      .then(function(page) { 
       // Set scale (zoom) level 
       var scale = 1.5; 

       // Get viewport (dimensions) 
       var viewport = page.getViewport(scale); 

       // Get canvas#the-canvas 
       var canvas = document.getElementById('the-canvas'); 

       // Fetch canvas' 2d context 
       var context = canvas.getContext('2d'); 

       // Set dimensions to Canvas 
       canvas.height = viewport.height; 
       canvas.width = viewport.width; 

       // Prepare object needed by render method 
       var renderContext = { 
        canvasContext: context, 
        viewport: viewport 
       }; 

       // Render PDF page 
       page.render(renderContext); 
      }); 
    </script> 
</head> 
<body> 
<canvas id="the-canvas"></canvas> 
</body> 
</html> 
+0

Versuchen Sie 'var url =" https://cors-anywhere.herokuapp.com/https://mobile.switchitapp.com/uploads/pdf/userGuide.pdf "' und https://stackoverflow.com/ Fragen/20035101/no-access-control-allow-Herkunft-header-is-present-auf-der-angeforderten-Ressource/42744707 # 42744707 für eine Erklärung – sideshowbarker

+0

funktioniert nicht auch ich möchte dies auf meinem Server I tun habe versucht, cors ding zu versuchen, aber ich weiß nicht, wo ich falsch liege. –

+0

Das Problem besteht darin, dass die Website https://mobile.switchitapp.com den Antwort-Control-Allow-Origin-Antwortheader nicht in den Antworten sendet. Ist das deine Site? Wenn nicht, dann gibt es nichts, was Sie tun können, um es anders zu beheben, als die Anfrage über einen Proxy wie in meinem anderen Kommentar zu stellen. – sideshowbarker

Antwort

0

Try var url = "https://cors-anywhere.herokuapp.com/https://mobile.switchit App .com/uploads/pdf/userguide.pdf“

nicht funktioniert entweder auch

Die vorgeschlagene Lösung ist der Kommentar soll funktionieren. Bitte beachten Sie:

// URL of PDF document 
 
     var url = "https://cors-anywhere.herokuapp.com/" + 
 
"https://mobile.switchitapp.com/uploads/pdf/userGuide.pdf"; 
 

 
     // Asynchronous download PDF 
 
     PDFJS.getDocument(url) 
 
      .then(function(pdf) { 
 
       return pdf.getPage(1); 
 
      }) 
 
      .then(function(page) { 
 
       // Set scale (zoom) level 
 
       var scale = 1.5; 
 

 
       // Get viewport (dimensions) 
 
       var viewport = page.getViewport(scale); 
 

 
       // Get canvas#the-canvas 
 
       var canvas = document.getElementById('the-canvas'); 
 

 
       // Fetch canvas' 2d context 
 
       var context = canvas.getContext('2d'); 
 

 
       // Set dimensions to Canvas 
 
       canvas.height = viewport.height; 
 
       canvas.width = viewport.width; 
 

 
       // Prepare object needed by render method 
 
       var renderContext = { 
 
        canvasContext: context, 
 
        viewport: viewport 
 
       }; 
 

 
       // Render PDF page 
 
       page.render(renderContext); 
 
      });
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/1.8.472/pdf.js"></script> 
 
<canvas id="the-canvas"></canvas>

+0

ja es funktioniert aber was ist, wenn ich auf meinem Server tun möchte. –

+0

Verwenden Sie den gleichen Code? – async5

0

CORS auf localhost Aktivieren unterscheidet sich nicht von ermöglicht auf jedem entfernten Server. Siehe https://enable-cors.org/server.html

Ihr Problem, dass Sie das nicht für Remote-Server tun können, und Sie müssen wirklich CORS dort anstelle von localhost aktivieren. Deine Frage ist etwas falsch.