首页 > 其他 > 详细

关于cros解决跨域的一个小例子(判断IP地址选择加不加跨域)

时间:2019-05-12 22:48:23      阅读:248      评论:0      收藏:0      [点我收藏+]

需求:通过8000、9000端口访问7000端口的1.html页面,并获取button按钮点击后触发的弹窗值

首先需要准备三个服务器,这里分别命名为http7000.js、http8000.js、http9000.js,其次要准备一个html页面书写ajax,命名为1.html

第一步先创建服务器,这里仅以get方式传值举例,7000中的代码为:

//引入http模块
var http = require(‘http‘);
//创建服务器
var server = http.createServer();
//引入url模块
var url = require(‘url‘);
//引入系统模块
var fs = require(‘fs‘);
//设置监听端口
server.listen(7000, function () {
    console.log(‘服务器端口为7000‘);
})
//为服务器绑定访问事件
server.on(‘request‘, function (req, res) {
    //获取url
    var urls = url.parse(req.url);
    //判断跨域的IP地址是否许可
    if (req.headers.origin == ‘http://127.0.0.1:8000‘) {
        //若许可则绑定响应头
        res.setHeader(‘Access-Control-Allow-Origin‘, ‘*‘);
    }
    //判断传值方式
    if (req.method == ‘GET‘) {
        if (urls.pathname == ‘/‘) {
            res.end(‘gggeettt‘)
        } else {
            fs.readFile(‘.‘ + urls.pathname, function (err, data_str) {
                if (!err) {
                    res.end(data_str);
                } else {
                    res.end(‘‘);
                }
            })
        }
}
else {
        res.end(‘ncc‘)
    }
})

8000、9000中的代码类似,只是没有判断跨域的IP地址,没有设置响应头,这里就不再列举

接下来书写html页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <input type="button" id="btn" value="发送">
</body>
<script>
    //ajax
    document.getElementById(btn).onclick = function () {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function(){
            if(xhr.readyState == 4){
                alert(xhr.responseText);
            }
        }
        xhr.open(get,http://127.0.0.1:7000)//设置要访问的地址
        xhr.send();}
</script>
</html>

同时开启3个服务器,并在浏览器输入 127.0.0.1:8000、127.0.0.1:9000 分别访问

效果如下

8000:

技术分享图片

 

9000:

技术分享图片

 

 

可见:1.实现了跨域

   2.实现了判断IP添加跨域

关于cros解决跨域的一个小例子(判断IP地址选择加不加跨域)

原文:https://www.cnblogs.com/xagg/p/10853905.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!