即使啟用了CORS，AJAX請求仍被阻止

Question

我正在用JAX-RS構建Web服務，並且在服務器端和AJAX請求中都啟用了CORS，但仍然收到錯誤消息：

跨域請求被阻止：同源策略禁止讀取位於http://www.bookstore.com/orderservice/order的遠程資源。 可以通過將資源移到同一域或啟用CORS來解決此問題。 有什么想法嗎？ 謝謝。

服務器端代碼：

<jaxrs:ser <bean id="cors-filter" class="org.apache.cxf.rs.security.cors.CrossOriginResourceSharingFilter"/>ver name="OrderService" address="http://www.bookstore.com">
          <jaxrs:serviceBeans>
                 <ref bean="orderServiceRest" />
          </jaxrs:serviceBeans>
          <jaxrs:providers>
                 <ref bean="jacksonProvider" />
                 <ref bean="cors-filter" />
          </jaxrs:providers>

          <jaxrs:schemaLocations>
                   <  <jaxrs:schemaLocation>com.bookengine.ws.service.representation.OrderRequest</jaxrs:schemaLocation>
                 <jaxrs:schemaLocation>com.bookengine.ws.service.representation.OrderRepresentation</jaxrs:schemaLocation>
          </jaxrs:schemaLocations>

   </jaxrs:server>
   <bean id="orderServiceRest" class="com.bookengine.ws.service.OrderResource" />

   AJAX Request
   $.ajax({
             headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
                'Access-Control-     Allow-Origin': "http://www.bookstore.com/orderservice"
            },
            type: 'POST',
            crossDomain: true,
            contentType: 'application/json',
            dataType: 'json',
            data: '{"orderId":null,"bookId":"X1","status":null,"customer":{"name":"John   Smith","address":"312 N State Street, Chicago IL 60611","phone":"312-345-9876","custId":"1234"},"paymentinfo":null}',
            url: 'http://bookstore/orderservice/order',                                                               
            error: function(xhr, status, error) {

            // Display a generic error for now.
                   alert("AJAX Error!");
                 },
            success: function (data) {
                var output = "<ul>";
                output += "<li>" + "Order ID: " + data.orderID
                        + "<br>Book ID: " + data.bookID
                        + "<br>Status: " + data.status
                        + "</li>";
                output += "</ul>";
                alert("Hello from sucess");
             document.getElementById("buydata").innerHTML = output;  
            }
  });

Answer 1

這是瀏覽器中的安全保護，可以防止從一個域到另一個域的Ajax調用。 僅當您擁有http://www.bookstore.com/orderservice/order的域時，才可以通過在服務器返回的標頭中添加Access-Control-Allow-Origin：或將您的網絡服務移至同一域。

Answer 2

您無法通過向發送請求添加標頭來從客戶端修復此問題。

從網站本身決定允許其訪問源的服務器啟用CORS，並且網站本身必須添加CORS標頭，該標頭告訴瀏覽器應允許來自哪個源的請求。

因此，您必須控制http://www.bookstore.com域及其服務器，才能在其上啟用CORS。

另一個跨源的可能性是JSONP，但是網站本身也必須明確支持JSONP請求（因為它們的結構與常規請求不同）。