2020-11-19 ajax跨域的几种解决的办法

最新推荐文章于 2022-12-10 09:00:11 发布

樱花树下'

最新推荐文章于 2022-12-10 09:00:11 发布

阅读量112

点赞数

文章标签： node.js

本文链接：https://blog.csdn.net/html_xiaojiu/article/details/109822096

版权

一，代理服务器

思路：当当前服务器的网页中用Ajax发起了对其他服务器的网络请求时，这时候就会出现了跨域的问题。这时候当前的服务器用request发起对其他服务器的数据请求在返回给前端进行使用那么这个服务器就是代理服务器的作用。（数据中转站）

1.主服务器

var router = require("./router")


router.use("/ajax",function(req,res){
    res.end("我是主服务器")
    //这个数据假设是代理服务器的前端需要的数据  但是前端无法直接的获得
})

2.代理服务器

var router = require("./router")
var request = require("request")


router.use("/ajax",function(req,res){
    res.end("我是自己服务器得数据")
})



router.use("/ajax2",function(req,res){
    request("http://192.168.2.114:8887/ajax",(err,xhr,body)=>{
    //对主服务器的数据进行请求和转发   对于前端来说就是同源的数据
        res.end(body)
    })
})

3.代理服务器的前端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.0/axios.js"></script>
</head>
<body>
    <h1>我可以接受其他服务器来的数据</h1>
    <button onclick="fn()">点击获得数据</button>
    <button onclick="ff()">其他服务器</button>
    <script>
         function fn() {
              axios("/ajax").then(function(date) {
                  console.log(date.data);
              })
         }

         
         //ajax在当前服务器得网页中去请求其他得赋予器里面得数据 那就会有跨域得问题
         function ff() {
              axios("/ajax2").then(function(date) {
                  console.log(date.data);
              })
         }
        

    </script>
</body>
</html>

注意：这个前端想要直接访问主服务器的数据时得不到了，跨域了，所以只有让代理服务器去取主服务器的内容在转发过来就可以得到了

二，跨域解决之CORS

思路：后端设置请求头信息相当于这个数据对特定或者所有的跨域请求开源告诉浏览器不要阻止。

var router = require("./router")


router.use("/ajax",function(req,res){
    res.writeHead(200,{"Access-Control-Allow-Origin":"*"})//添加这个就相当于这个数据是公开的  允许跨域访问
    res.end("hellow")
})

三，授权开发

1授权开发其实并不是真正得解决得跨域得问题
2只是获得了数据得接口   接口时别人提供得而已

樱花树下'

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2020-11-19 ajax跨域的几种解决的办法

一，代理服务器思路：当当前服务器的网页中用Ajax发起了对其他服务器的网络请求时，这时候就会出现了跨域的问题。这时候当前的服务器用request发起对其他服务器的数据请求在返回给前端进行使用那么这个服务器就是代理服务器的作用。（数据中转站）1.主服务器var router = require("./router")router.use("/ajax",function(req,res){ res.end("我是主服务器") //这个数据假设是代理服务器的前端需要的数据但是前
复制链接

扫一扫