Ajax - ember.js中的「Access-Control-Allow-Origin」錯誤

我想知道你對這個問題的意見，在這個簡單的代碼中，問題Access-Control-Allow-Origin，已經嘗試了幾種方法defenir the ember "Access-Control-Allow-Origin": "* "但沒有成功，所以我想知道有同樣問題的人是否找到了解決方案。Ajax - ember.js中的「Access-Control-Allow-Origin」錯誤

我使用的URL地址localhost: 4200，並已嘗試與firebase子域在這兩種情況下錯誤總是相同的。

Ajax請求：

import Ember from 'ember'; 
import { isAjaxError, isNotFoundError, isForbiddenError } from 'ember-ajax/errors'; 

export default Ember.Controller.extend({ 
    ajax: Ember.inject.service(), 
    actions: { 

     code() { 

      var cliente = '***'; 
      var redirectUri = 'http://localhost:4200/teste'; 
      var client_secret = '***'; 
      var code = '***'; 
      var grant_type = 'authorization_code'; 
      var data = 
        "client_id=" + cliente + 
        "&redirect_uri=" + encodeURIComponent(redirectUri) + 
        "&client_secret=" + client_secret + 
        "&code=" + code + 
        "&grant_type=" + grant_type; 

      this.send('post', data) 

     }, 

     post(data) { 

      this.get('ajax').post("https://login.live.com/oauth20_token.srf", { 
       method: 'POST', 
       headers: { 
        "Access-Control-Allow-Origin": "*", 
        "Content-Type": "application/x-www-form-urlencoded", 
       }, 
       data: data, 
       dataType: 'JSON', 

      }); 
     }, 
    }});

我的內容安全策略：

contentSecurityPolicy: { 
    'connect-src': "'self' http://localhost:4200 https://*.googleapis.com https://login.live.com/oauth20_token.srf", 
    'child-src': "'self' http://localhost:4200", 
    'script-src': "'self' 'unsafe-eval' https://login.live.com", 
    'img-src': "'self' https://*.bp.blogspot.com https://cdn2.iconfinder.com http://materializecss.com https://upload.wikimedia.org https://www.gstatic.com", 
    'style-src': "'self' 'unsafe-inline' ", 
},

的錯誤是：

的XMLHttpRequest無法加載https://login.live.com/oauth20_token.srf。對預檢請求的響應不會通過訪問控制檢查：請求的資源上不存在「Access-Control-Allow-Origin」標頭。因此不允許訪問原產地'http://localhost:4200'。

來源

2016-08-26 joel

cors限制是由微軟完成的。 –

如果我沒有弄錯，cors頭部必須是響應的一部分，而不是請求。您可以使用代理（如Charles）來追加正確的標題。 – chchrist

無論您在端口4200上運行的服務是否需要返回它所描述的頭文件 - 這都是瀏覽器的安全功能。（通常，它適用於'unsafesite.russia'時，它試圖連接到'yourbank.safe'，但它也適用於一個主機上的不同端口號） – Katana314

這實際上並不像Ember相關的問題。您遇到的問題完全與後端相關。對於ajax請求工作後端應響應適當的'Access-Control-Allow-Origin'標頭。否則，您的瀏覽器將不會接受此類回覆，並會拋出您所看到的錯誤。這不是Ember相關的，它只是瀏覽器的工作方式。

現在要解決此問題，您必須將正確的客戶端服務器名稱添加到您的後端'Access-Control-Allow-Origin'標頭中。即如果您打算從https://example.com服務您的Ember應用程序，那麼您需要將其添加到'Access-Control-Allow-Origin'標題。

因此，讓我們假設你只是想繞過這條消息的方式。

有很多瀏覽器擴展會禁用瀏覽器中的CORS檢查進行開發。如果您使用的是localhost，但這種方式可以很好地工作，但計劃在將來轉移到真實服務器，並且有辦法在後端真正設置'Access-Control-Allow-Origin'標頭。
假設您現在沒有任何方法來更改後端標頭，但絕望要測試客戶端應用程序如何在您的遠程https://example.com上工作。您必須設置一個遠程服務器，將所有請求都代理到目標後端，修改響應中發送的標頭，以便瀏覽器接受它們。這樣你就不必使用任何chrome擴展來禁用CORS。設置此類服務器的最簡單方法之一是使用以下軟件包 - https://www.npmjs.com/package/express-http-proxy。您的案例的配置將非常簡單。

示例快速應用程序： var proxy = require（'express-http-proxy'）; var app = require（'express'）（）;

app.use('/', proxy('www.example.com', { 
    intercept: function (rsp, data, req, res, callback) { 
     res.append('Access-Control-Allow-Origin', '*'); 
     callback(null, data); 
    }})); 

app.listen(3000, function() { 
    console.log('listening on port 3000'); 
});

來源

2016-09-01 01:09:00 canufeel

Ajax - ember.js中的「Access-Control-Allow-Origin」錯誤

回答

相關問題