V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
syncher
V2EX  ›  Node.js

Node 心中有坑,处处是坑

  •  1
     
  •   syncher · 2017-07-28 17:37:53 +08:00 · 3466 次点击
    这是一个创建于 2670 天前的主题,其中的信息可能已经有所发展或是发生改变。

    记录一个 Node 的坑

    新手接触 Node 不到一个月,遇到了很多坑

    后端代码是这样写的:

    app.all('*', function(req, res, next) {
    	res.header("Access-Control-Allow-Origin", "*"); 
    	res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");
    	res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS"); 
    	res.header("X-Powered-By", ' 3.2.1')
    	res.header("Content-Type", "application/json;charset=utf-8");
    	next();
    });
     
    

    然而前端每次发送 AJAX 跨域请求时都收不到结果,错误信息为网关超时

     XMLHttpRequest cannot load http://111.111.111.111:8089/login_service. Response to
     preflight request doesn't pass access control check: No
     'Access-Control-Allow-Origin' header is present on the requested resource. Origin
     'http://111.111.111.111' is therefore not allowed access. The response had HTTP
     status code 504.
    

    后来发现前端使用 CORS 请求时content-type取值为application/json; charset=utf-8,也就是说发送跨域请求时会发送 OPTIONS 预检请求,而我没有对设置 OPTIONS 路由,因此成功入坑。后来把后端代码改为了

    app.all('*',function (req, res, next) {
    	res.header('Access-Control-Allow-Origin', '*');
    	res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
    	res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
    
    	if (req.method == 'OPTIONS') {
    	   console.log('you can do that!!');
    	   res.send(200); // 让 options 请求快速返回
    	} else {
    		next();
    	}
    });
    

    写在最后

    从坑中出来了,颇有感慨。顺便记录了一下对 CORS 跨域的探索,可能是知识盲点太多所以入坑太多,Node 的路上你遇到了哪些坑?求各位告知。

    12 条回复    2017-07-29 12:47:42 +08:00
    Cbdy
        1
    Cbdy  
       2017-07-28 18:19:17 +08:00
    这个和 node 无关,你只是对 http 协议不熟而已,用 java、python 照样碰到
    airyland
        2
    airyland  
       2017-07-28 18:19:22 +08:00   ❤️ 1
    这不叫 Node 的坑,这叫个人错误。
    syncher
        3
    syncher  
    OP
       2017-07-28 18:28:43 +08:00
    @Cbdy @airyland 确实是我个人问题,但话说 Apache 是不是会自动设置 OPTIONS 路由?
    Librazy
        4
    Librazy  
       2017-07-28 18:41:56 +08:00
    有很多 HTTP 框架或者辅助库处理这类的情况的,不一定要在业务代码里处理,比如说可以看看 https://www.npmjs.com/package/cors
    wly19960911
        5
    wly19960911  
       2017-07-28 18:44:52 +08:00 via Android
    这和 node 无关,cors 我建议还是直接上 nginx 反代掉,这个坑很多
    usedname
        6
    usedname  
       2017-07-28 18:47:52 +08:00 via Android
    这锅 node 不能背
    Yokira
        7
    Yokira  
       2017-07-28 18:49:54 +08:00
    204 是不是会比 200 更快一些呢?
    syncher
        8
    syncher  
    OP
       2017-07-28 18:57:50 +08:00
    @Librazy
    @wly19960911
    @Yokira
    @usedname
    哈哈哈,确实是我太年轻,感觉会火。感谢各位建议, 有想过用 Nginx 做代理,后期再改善吧!
    plqws
        9
    plqws  
       2017-07-28 18:58:10 +08:00
    @syncher 你一样可以用 Apache 反代 node
    syncher
        10
    syncher  
    OP
       2017-07-28 19:02:33 +08:00
    oott123
        11
    oott123  
       2017-07-28 20:49:11 +08:00 via Android
    @Yokira 不是。
    winglight2016
        12
    winglight2016  
       2017-07-29 12:47:42 +08:00
    你不用 express 就得自己实现全套啊,不然还是老老实实用 express 吧
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1190 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 18:31 · PVG 02:31 · LAX 10:31 · JFK 13:31
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.