我使用(Dropzone js)上传了ajax文件.它将文件发送到我的hapi服务器.我意识到浏览器发送了一个PREFLIGHT OPTIONS METHOD.但我的hapi服务器似乎没有发送正确的响应标题,所以我在chrome上遇到错误.
这是我得到的错误
这是我得到的错误
XMLHttpRequest cannot load http://localhost:3000/uploadbookimg. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.
这是hapi js路由处理程序
server.route({
path: '/uploadbookimg',method: 'POST',config: {
cors : true,payload: {
output: 'stream',parse: true,allow: 'multipart/form-data'
},handler: require('./books/webbookimgupload'),}
});
在我的理解中,hapi js应该从Pre-fight(OPTIONS)请求发送所有cors头.
不明白为什么不是
来自Chrome的网络请求/响应
**General** Request Method:OPTIONS Status Code:200 OK Remote Address:127.0.0.1:3000 **Response Headers** view parsed HTTP/1.1 200 OK content-type: application/json; charset=utf-8 cache-control: no-cache vary: accept-encoding Date: Wed,27 Apr 2016 07:25:33 GMT Connection: keep-alive Transfer-Encoding: chunked **Request Headers** view parsed OPTIONS /uploadbookimg HTTP/1.1 Host: localhost:3000 Connection: keep-alive Pragma: no-cache Cache-Control: no-cache Access-Control-Request-Method: POST Origin: http://localhost:4200 User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML,like Gecko) Chrome/50.0.2661.87 Safari/537.36 Access-Control-Request-Headers: accept,cache-control,content-type Accept: */* Referer: http://localhost:4200/books/upload Accept-Encoding: gzip,deflate,sdch Accept-Language: en-US,en;q=0.8
提前致谢
解决方法
hapi cors：true是一个通配符规则,它允许来自所有域的CORS请求,除了少数情况,包括在
hapi’s default whitelist之外还有其他请求标头时：
[“接受”,“授权”,“内容类型”,“if-none-match”,“origin”]
See the cors option section in the API docs under route options：
headers– a strings array of allowed headers (‘Access-Control-Allow-Headers’). Defaults to['Accept','Authorization','Content-Type','If-None-Match'].
additionalHeaders– a strings array of additional headers to headers. Use this to keep the default headers in place.
您的问题是Dropzone发送了几个标题以及不在此列表中的文件上载：
> x-requested-with(不在上面的标题中,但是是为我发送的)
>缓存控制
您有两种方法可以使工作正常,您需要在服务器或客户端上进行更改：
选项1 – 将额外标题列入白名单：
server.route({
config: {
cors: {
origin: ['*'],additionalHeaders: ['cache-control','x-requested-with']
}
},path: '/upload',handler: function (request,reply) {
...
}
});
选项2 – 告诉dropzone不发送那些额外的标题
尚未通过他们的配置,但有一个待定的PR允许它：https://github.com/enyo/dropzone/pull/685
