ajax 使用 Google Chrome 的 xmlHttpRequest 时拒绝设置不安全的标头“Origin”

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11182712/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-06 10:46:18  来源:igfitidea点击:

Refused to set unsafe header "Origin" when using xmlHttpRequest of Google Chrome

ajaxxmlhttprequestcometcors

提问by Derrick LAU

Got this error message: Refused to set unsafe header "Origin"

收到此错误消息: Refused to set unsafe header "Origin"

Using this code:

使用此代码:

   function getResponse() {
            document.getElementById("_receivedMsgLabel").innerHTML += "getResponse() called.<br/>";
            if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
                receiveReq.open("GET", "http://L45723:1802", true, "server", "server123");  //must use L45723:1802 at work.
                receiveReq.onreadystatechange = handleReceiveMessage;
                receiveReq.setRequestHeader("Origin", "http://localhost/");
                receiveReq.setRequestHeader("Access-Control-Request-Origin", "http://localhost");
                receiveReq.timeout = 0;
                var currentDate = new Date();
                var sendMessage = JSON.stringify({
                    SendTimestamp: currentDate,
                    Message: "Message 1",
                    Browser: navigator.appName
                });
                receiveReq.send(sendMessage);

            }
        }

What am I doing wrong? What am I missing in the header to make this CORS request work?

我究竟做错了什么?我在标题中缺少什么才能使此 CORS 请求工作?

I tried removing the receiveReq.setRequestHeader("Origin", ...)call but then Google Chrome throws an access error on my receiveReq.open()call...

我尝试删除receiveReq.setRequestHeader("Origin", ...)通话,但随后 Google Chrome 在我的receiveReq.open()通话中引发了访问错误...

Why?

为什么?

回答by Brian S

This is just a guess, as I use jquery for ajax requests, including CORS.

这只是一个猜测,因为我将 jquery 用于 ajax 请求,包括 CORS。

I think the browser is supposed to set the header, not you. If you were able to set the header, that would defeat the purpose of the security feature.

我认为浏览器应该设置标题,而不是你。如果您能够设置标题,那将违背安全功能的目的。

Try the request without setting those headers and see if the browser sets them for you.

在不设置这些标头的情况下尝试请求,看看浏览器是否为您设置了它们。

回答by MeTTeO

In CORS the calling code doesn't have to do any special configuration. Everything should be handled by the browser. It's the server's job to decide if request should be allowed or not. So any time you are making a request which breaks SOP policy, the browser will try to make a CORS request for you (it will add Origin header automatically, and possibly make a preflight request if you are using some unsafe headers/methods/content types). If the server supports CORS it will respond properly and allow/disallow the request by providing CORS specific response headers like

在 CORS 中,调用代码不必进行任何特殊配置。一切都应该由浏览器处理。决定是否应该允许请求是服务器的工作。因此,每当您发出违反 SOP 策略的请求时,浏览器都会尝试为您发出 CORS 请求(它会自动添加 Origin 标头,如果您使用一些不安全的标头/方法/内容类型,则可能会发出预检请求) )。如果服务器支持 CORS,它将通过提供 CORS 特定的响应标头来正确响应并允许/禁止请求

Access-Control-Allow-Origin: *

Keep in mind that Chrome is very restrictive about 'localhost' host name. (At least it was when I was working with it). Instead use your computer name or assign it another alias in 'hosts' file. So for example don't access your site like:

请记住,Chrome 对“localhost”主机名的限制非常严格。(至少在我使用它的时候是这样)。而是使用您的计算机名称或在“主机”文件中为其分配另一个别名。因此,例如不要访问您的网站,例如:

http://localhost:port/myappname

Instead use:

而是使用:

http://mymachinename:port/myappname

or

或者

http://mymachinealias:port/myappname

For more details please check specification.

有关更多详细信息,请查看规格

回答by fneron

Are you working cross-domain?

你是跨域工作吗?

Try Brian S solution or try this:

试试 Brian S 解决方案或试试这个:

instead of setting to localhost just pass anything... and see what happens.

而不是设置为 localhost 只需传递任何东西......看看会发生什么。

receiveReq.setRequestHeader("Origin", "*");