Trường tiêu đề yêu cầu Kiểm soát truy cập-Cho phép-Tiêu đề không được phép bởi Tiêu đề-Kiểm soát-Cho phép-Tiêu đề

Tôi đang cố gắng gửi tệp đến máy chủ của mình với yêu cầu bài đăng, nhưng khi gửi nó gây ra lỗi:

Trường tiêu đề yêu cầu Loại nội dung không được phép bởi Access-Control-Allow-Headers.

Vì vậy, tôi đã sửa lỗi và thêm các tiêu đề:

$http.post($rootScope.URL, {params: arguments}, {headers: {
    "Access-Control-Allow-Origin" : "*",
    "Access-Control-Allow-Methods" : "GET,POST,PUT,DELETE,OPTIONS",
    "Access-Control-Allow-Headers": "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
}

Sau đó tôi nhận được lỗi:

Trường tiêu đề yêu cầu Access-Control-allow-Origin không được phép bởi Access-Control-Allow-Headers

Vì vậy, tôi đã googled điều đó và câu hỏi tương tự duy nhất tôi có thể tìm thấy được cung cấp một nửa câu trả lời sau đó đóng lại như lạc đề. Tôi nên thêm / xóa tiêu đề nào?

Máy chủ (mà yêu cầu POST được gửi đến) cần bao gồm Access-Control-Allow-Headerstiêu đề (vv) trong phản hồi của nó . Đưa chúng vào yêu cầu của bạn từ khách hàng không có hiệu lực.

Điều này là do máy chủ chỉ định rằng nó chấp nhận các yêu cầu có nguồn gốc chéo (và nó cho phép Content-Typetiêu đề yêu cầu, v.v.) - khách hàng không thể tự quyết định rằng một máy chủ nhất định sẽ cho phép CORS.

Tôi đã từng gặp vấn đề tương tự. Trong tài liệu jQuery tôi tìm thấy:

Nếu có yêu cầu cross-domain, thiết lập các kiểu nội dung để bất cứ điều gì khác hơn application/x-www-form-urlencoded, multipart/form-datahoặc text/plainsẽ kích hoạt trình duyệt để gửi một OPTIONS preflight yêu cầu đến máy chủ.

Vì vậy, mặc dù máy chủ cho phép yêu cầu xuất xứ chéo nhưng không cho phép Access-Control-Allow-Headers, nó sẽ đưa ra lỗi. Theo mặc định, loại nội dung góc application/jsonlà cố gắng gửi yêu cầu TÙY CHỌN. Cố gắng ghi đè tiêu đề mặc định góc hoặc cho phép Access-Control-Allow-Headersở cuối máy chủ. Đây là một mẫu góc:

$http.post(url, data, {
    headers : {
        'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8'
    }
});

Nếu điều đó giúp được bất cứ ai, (ngay cả khi điều này là kém vì chúng ta chỉ phải cho phép điều này cho mục đích dev) thì đây là một giải pháp Java khi tôi gặp phải vấn đề tương tự. [Chỉnh sửa] Không sử dụng thẻ hoang dã * vì đây là một giải pháp tồi, hãy sử dụng localhostnếu bạn thực sự cần phải có một cái gì đó hoạt động tại địa phương.

public class SimpleCORSFilter implements Filter {

public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) res;
    response.setHeader("Access-Control-Allow-Origin", "my-authorized-proxy-or-domain");
    response.setHeader("Access-Control-Allow-Methods", "POST, GET");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
    chain.doFilter(req, res);
}

public void init(FilterConfig filterConfig) {}

public void destroy() {}

}

Máy chủ (mà yêu cầu POST được gửi đến) cần bao gồm tiêu đề Kiểu nội dung trong phản hồi của nó.

Dưới đây là danh sách các tiêu đề điển hình cần bao gồm, bao gồm một tiêu đề "X_ACCESS_TOKEN" tùy chỉnh:

"X-ACCESS_TOKEN", "Access-Control-Allow-Origin", "Authorization", "Origin", "x-requested-with", "Content-Type", "Content-Range", "Content-Disposition", "Content-Description"

Đó là những gì anh chàng máy chủ http của bạn cần định cấu hình cho máy chủ web mà bạn đang gửi yêu cầu của mình.

Bạn cũng có thể muốn yêu cầu anh chàng máy chủ của mình hiển thị tiêu đề "Độ dài nội dung".

Anh ta sẽ nhận ra đây là yêu cầu Chia sẻ tài nguyên nguồn gốc chéo (CORS) và nên hiểu ý nghĩa của việc tạo các cấu hình máy chủ đó.

Để biết chi tiết, xem:

• http://www.w3.org/TR/cors/
• http://enable-cors.org/

Bạn có thể kích hoạt tiêu đề thích hợp trong PHP bằng cách này:

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, X-Requested-With");

Các công việc sau đây đối với tôi với nodejs:

xServer.use(function(req, res, next) {
  res.setHeader("Access-Control-Allow-Origin", 'http://localhost:8080');
  res.setHeader('Access-Control-Allow-Methods', 'POST,GET,OPTIONS,PUT,DELETE');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type,Accept');

  next();
});

Các tiêu đề bạn đang cố gắng đặt là các tiêu đề phản hồi . Chúng phải được cung cấp, trong phản hồi, bởi máy chủ mà bạn đang yêu cầu.

Họ không có nơi nào được đặt trên máy khách. Sẽ là vô nghĩa khi có một phương tiện để cấp quyền nếu chúng có thể được cấp bởi trang web muốn có quyền thay vì trang web sở hữu dữ liệu.

Nếu bất cứ ai gặp vấn đề này với một máy chủ tốc hành, hãy thêm phần mềm trung gian sau

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

nếu bạn kiểm tra một số yêu cầu javascript cho ionic2 hoặc angularjs 2, trong chrome trên pc hoặc mac, thì hãy chắc chắn rằng bạn đã cài đặt plugin CORS cho trình duyệt chrome để cho phép xuất xứ chéo.

mayba nhận yêu cầu sẽ hoạt động mà không cần điều đó, nhưng đăng và đặt và xóa sẽ cần bạn cài đặt plugin cors để thử nghiệm mà không gặp vấn đề gì, điều đó chắc chắn không thú vị, nhưng tôi không biết mọi người làm thế nào nếu không có plugin CORS.

và cũng chắc chắn rằng phản hồi json không trả về 400 bởi một số trạng thái json

đây là vấn đề phụ trợ nếu sử dụng api sails trên phụ trợ thay đổi cors.js và thêm tệp của bạn vào đây

module.exports.cors = {
  allRoutes: true,
  origin: '*',
  credentials: true,
  methods: 'GET, POST, PUT, DELETE, OPTIONS, HEAD',
  headers: 'Origin, X-Requested-With, Content-Type, Accept, Engaged-Auth-Token'
};

Trong Asp Net Core , để nhanh chóng làm cho nó hoạt động để phát triển; vào Startup.cs, Configure methodthêm

app.UseCors(options => options.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader());

Trong trường hợp của tôi, tôi nhận được một số tham số như @HeaderParam thành một phương thức dịch vụ web.

Các tham số này PHẢI được khai báo trong bộ lọc CORS của bạn theo cách đó:

@Provider
public class CORSFilter implements ContainerResponseFilter {

    @Override
    public void filter(ContainerRequestContext requestContext, ContainerResponseContext responseContext) throws IOException {

        MultivaluedMap<String, Object> headers = responseContext.getHeaders();

        headers.add("Access-Control-Allow-Origin", "*");
        ...
        headers.add("Access-Control-Allow-Headers", 
        /*
         * name of the @HeaderParam("name") must be declared here (raw String):
         */
        "name", ...);
        headers.add("Access-Control-Allow-Credentials", "true");
        headers.add("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS, HEAD");   
    }
}

Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headerslỗi có nghĩa là Access-Control-Allow-Origintrường của tiêu đề HTTP không được xử lý hoặc cho phép bởi phản hồi. Xóa Access-Control-Allow-Origintrường khỏi tiêu đề yêu cầu.

Nếu bạn đang sử dụng localhostvà PHP đặt điều này để giải quyết vấn đề:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Content-Type'); 

Từ việc sử dụng front-end của bạn:

{headers: {"Content-Type": "application/json"}}

và bùng nổ không có nhiều vấn đề từ localhost!